@xylabs/sdk-react 2.7.7 → 2.7.11

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

@@ -1 +1 @@
-{"version":3,"file":"EthAccount.d.ts","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccount.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAGnD,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAMzC,CAAA;AAED,OAAO,EAAE,UAAU,EAAE,CAAA"}
+{"version":3,"file":"EthAccount.d.ts","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccount.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAEnD,QAAA,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA+DzC,CAAA;AAED,OAAO,EAAE,UAAU,EAAE,CAAA"}

package/dist/components/EthAccount/EthAccount.js

@@ -9,17 +9,37 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx } from "react/jsx-runtime";
-import { EthAccountBase } from './EthAccountBase';
-import { EthAccountTo } from './EthAccountTo';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Typography, useTheme } from '@mui/material';
+import { assertEx, EthAddress } from '@xylabs/sdk-js';
+import { useContext } from 'react';
+import { EthersContext } from '../../contexts';
+import { useMediaQuery } from '../../hooks';
+import { ButtonEx } from '../ButtonEx';
+import { FlexGrowRow, FlexRow } from '../FlexBox';
+import { Identicon } from '../Identicon';
 const EthAccount = (_a) => {
-    var { to, toOptions } = _a, props = __rest(_a, ["to", "toOptions"]);
-    if (to || toOptions) {
-        return _jsx(EthAccountTo, Object.assign({ to: to, toOptions: toOptions }, props), void 0);
-    }
-    else {
-        return _jsx(EthAccountBase, Object.assign({}, props), void 0);
-    }
+    var { address, icon = false, iconSize = 16, iconOnly = false, addressLength = 'auto', fontFamily = '"Source Code Pro",monospace', toEtherScan, onButtonClick } = _a, props = __rest(_a, ["address", "icon", "iconSize", "iconOnly", "addressLength", "fontFamily", "toEtherScan", "onButtonClick"]);
+    const { localAddress } = useContext(EthersContext);
+    const theme = useTheme();
+    const large = useMediaQuery(theme.breakpoints.up('md'));
+    const isLocalAddress = address ? (localAddress === null || localAddress === void 0 ? void 0 : localAddress.toString()) === address.toString() : false;
+    const onClickLocal = (event) => {
+        onButtonClick === null || onButtonClick === void 0 ? void 0 : onButtonClick(event);
+        if (toEtherScan && address) {
+            window.open(`https://etherscan.io/address/${address.toString()}`, '_blank');
+        }
+    };
+    const addressToDisplay = assertEx(address !== null && address !== void 0 ? 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 (_jsx(ButtonEx, Object.assign({ onClick: onClickLocal, title: `0x${address === null || address === void 0 ? void 0 : address.toHex()}` }, props, { children: _jsxs(FlexGrowRow, Object.assign({ justifyContent: "space-between", alignItems: "center" }, { children: [icon && address ? _jsx(Identicon, { size: iconSize, value: address === null || address === void 0 ? void 0 : address.toHex() }, void 0) : null, iconOnly ? null : (_jsxs(FlexRow, { children: [_jsx(Typography, Object.assign({ marginLeft: icon ? 1 : 0, variant: "body1", fontFamily: fontFamily, visibility: address ? 'inherit' : 'hidden' }, { children: testToDisplay }), void 0), address ? null : (_jsx(Typography, Object.assign({ position: "absolute", marginLeft: icon ? 1 : 0, variant: "body1", fontFamily: fontFamily }, { children: "-- --" }), void 0))] }, void 0)), isLocalAddress ? _jsx(FlexRow, Object.assign({ marginLeft: 0.5 }, { children: "(You)" }), void 0) : null] }), void 0) }), void 0));
 };
 export { EthAccount };
 //# sourceMappingURL=EthAccount.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"EthAccount.js","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccount.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEjD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAE7C,MAAM,UAAU,GAA8B,CAAC,EAA2B,EAAE,EAAE;QAA/B,EAAE,EAAE,EAAE,SAAS,OAAY,EAAP,KAAK,cAAzB,mBAA2B,CAAF;IACtE,IAAI,EAAE,IAAI,SAAS,EAAE;QACnB,OAAO,KAAC,YAAY,kBAAC,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,SAAS,IAAM,KAAK,UAAI,CAAA;KACjE;SAAM;QACL,OAAO,KAAC,cAAc,oBAAK,KAAK,UAAI,CAAA;KACrC;AACH,CAAC,CAAA;AAED,OAAO,EAAE,UAAU,EAAE,CAAA"}
+{"version":3,"file":"EthAccount.js","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccount.tsx"],"names":[],"mappings":"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"}

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

@@ -1,7 +1,12 @@
 /// <reference types="react" />
 import { ComponentMeta, ComponentStory } from '@storybook/react';
 declare const StorybookEntry: ComponentMeta<import("react").FC<import("./EthAccountProps").EthAccountProps>>;
-declare const Default: ComponentStory<import("react").FC<import("./EthAccountProps").EthAccountProps>>;
-export { Default };
+declare const Long: ComponentStory<import("react").FC<import("./EthAccountProps").EthAccountProps>>;
+declare const LongEmpty: ComponentStory<import("react").FC<import("./EthAccountProps").EthAccountProps>>;
+declare const Short: ComponentStory<import("react").FC<import("./EthAccountProps").EthAccountProps>>;
+declare const ShortEmpty: ComponentStory<import("react").FC<import("./EthAccountProps").EthAccountProps>>;
+declare const Auto: ComponentStory<import("react").FC<import("./EthAccountProps").EthAccountProps>>;
+declare const AutoEmpty: ComponentStory<import("react").FC<import("./EthAccountProps").EthAccountProps>>;
+export { Auto, AutoEmpty, Long, LongEmpty, Short, ShortEmpty };
 export default StorybookEntry;
 //# sourceMappingURL=EthAccount.stories.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"EthAccount.stories.d.ts","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccount.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAKhE,QAAA,MAAM,cAAc,gFASiB,CAAA;AAIrC,QAAA,MAAM,OAAO,iFAAoB,CAAA;AASjC,OAAO,EAAE,OAAO,EAAE,CAAA;AAGlB,eAAe,cAAc,CAAA"}
+{"version":3,"file":"EthAccount.stories.d.ts","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccount.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAMhE,QAAA,MAAM,cAAc,gFASiB,CAAA;AAQrC,QAAA,MAAM,IAAI,iFAAoB,CAAA;AAS9B,QAAA,MAAM,SAAS,iFAAoB,CAAA;AAQnC,QAAA,MAAM,KAAK,iFAAoB,CAAA;AAS/B,QAAA,MAAM,UAAU,iFAAoB,CAAA;AAQpC,QAAA,MAAM,IAAI,iFAAoB,CAAA;AAS9B,QAAA,MAAM,SAAS,iFAAoB,CAAA;AAQnC,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,UAAU,EAAE,CAAA;AAG9D,eAAe,cAAc,CAAA"}

package/dist/components/EthAccount/EthAccount.stories.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { EthAddress } from '@xylabs/sdk-js';
+import { FlexRow } from '../FlexBox';
 import { EthAccount } from './EthAccount';
 const StorybookEntry = {
     argTypes: {},
@@ -11,16 +12,53 @@ const StorybookEntry = {
     },
     title: 'Components/EthAccount',
 };
-const Template = (args) => _jsx(EthAccount, Object.assign({}, args), void 0);
-const Default = Template.bind({});
-Default.args = {
+const Template = (args) => (_jsx(FlexRow, { children: _jsx(EthAccount, Object.assign({ variant: "outlined" }, args), void 0) }, void 0));
+const Long = Template.bind({});
+Long.args = {
     address: EthAddress.fromString('0x6792b02f88b32c4fe8e31cfa41ae5af44865f930'),
-    auto: true,
+    addressLength: 'long',
     icon: true,
     title: 'Sample EthAccount',
     toEtherScan: true,
 };
-export { Default };
+const LongEmpty = Template.bind({});
+LongEmpty.args = {
+    addressLength: 'long',
+    icon: true,
+    title: 'Sample EthAccount',
+    toEtherScan: true,
+};
+const Short = Template.bind({});
+Short.args = {
+    address: EthAddress.fromString('0x6792b02f88b32c4fe8e31cfa41ae5af44865f930'),
+    addressLength: 'short',
+    icon: true,
+    title: 'Sample EthAccount',
+    toEtherScan: true,
+};
+const ShortEmpty = Template.bind({});
+ShortEmpty.args = {
+    addressLength: 'short',
+    icon: true,
+    title: 'Sample EthAccount',
+    toEtherScan: true,
+};
+const Auto = Template.bind({});
+Auto.args = {
+    address: EthAddress.fromString('0x6792b02f88b32c4fe8e31cfa41ae5af44865f930'),
+    addressLength: 'auto',
+    icon: true,
+    title: 'Sample EthAccount',
+    toEtherScan: true,
+};
+const AutoEmpty = Template.bind({});
+AutoEmpty.args = {
+    addressLength: 'auto',
+    icon: true,
+    title: 'Sample EthAccount',
+    toEtherScan: true,
+};
+export { Auto, AutoEmpty, Long, LongEmpty, Short, ShortEmpty };
 // eslint-disable-next-line import/no-default-export
 export default StorybookEntry;
 //# sourceMappingURL=EthAccount.stories.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"EthAccount.stories.js","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccount.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAE3C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAEzC,MAAM,cAAc,GAAG;IACrB,QAAQ,EAAE,EAAE;IACZ,SAAS,EAAE,UAAU;IACrB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,IAAI,EAAE,IAAI;SACX;KACF;IACD,KAAK,EAAE,uBAAuB;CACK,CAAA;AAErC,MAAM,QAAQ,GAAsC,CAAC,IAAI,EAAE,EAAE,CAAC,KAAC,UAAU,oBAAK,IAAI,UAAe,CAAA;AAEjG,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACjC,OAAO,CAAC,IAAI,GAAG;IACb,OAAO,EAAE,UAAU,CAAC,UAAU,CAAC,4CAA4C,CAAC;IAC5E,IAAI,EAAE,IAAI;IACV,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,mBAAmB;IAC1B,WAAW,EAAE,IAAI;CAClB,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,CAAA;AAElB,oDAAoD;AACpD,eAAe,cAAc,CAAA"}
+{"version":3,"file":"EthAccount.stories.js","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccount.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAE3C,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACpC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAEzC,MAAM,cAAc,GAAG;IACrB,QAAQ,EAAE,EAAE;IACZ,SAAS,EAAE,UAAU;IACrB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,IAAI,EAAE,IAAI;SACX;KACF;IACD,KAAK,EAAE,uBAAuB;CACK,CAAA;AAErC,MAAM,QAAQ,GAAsC,CAAC,IAAI,EAAE,EAAE,CAAC,CAC5D,KAAC,OAAO,cACN,KAAC,UAAU,kBAAC,OAAO,EAAC,UAAU,IAAK,IAAI,UAAe,WAC9C,CACX,CAAA;AAED,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAC9B,IAAI,CAAC,IAAI,GAAG;IACV,OAAO,EAAE,UAAU,CAAC,UAAU,CAAC,4CAA4C,CAAC;IAC5E,aAAa,EAAE,MAAM;IACrB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,mBAAmB;IAC1B,WAAW,EAAE,IAAI;CAClB,CAAA;AAED,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACnC,SAAS,CAAC,IAAI,GAAG;IACf,aAAa,EAAE,MAAM;IACrB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,mBAAmB;IAC1B,WAAW,EAAE,IAAI;CAClB,CAAA;AAED,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAC/B,KAAK,CAAC,IAAI,GAAG;IACX,OAAO,EAAE,UAAU,CAAC,UAAU,CAAC,4CAA4C,CAAC;IAC5E,aAAa,EAAE,OAAO;IACtB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,mBAAmB;IAC1B,WAAW,EAAE,IAAI;CAClB,CAAA;AAED,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACpC,UAAU,CAAC,IAAI,GAAG;IAChB,aAAa,EAAE,OAAO;IACtB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,mBAAmB;IAC1B,WAAW,EAAE,IAAI;CAClB,CAAA;AAED,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAC9B,IAAI,CAAC,IAAI,GAAG;IACV,OAAO,EAAE,UAAU,CAAC,UAAU,CAAC,4CAA4C,CAAC;IAC5E,aAAa,EAAE,MAAM;IACrB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,mBAAmB;IAC1B,WAAW,EAAE,IAAI;CAClB,CAAA;AAED,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACnC,SAAS,CAAC,IAAI,GAAG;IACf,aAAa,EAAE,MAAM;IACrB,IAAI,EAAE,IAAI;IACV,KAAK,EAAE,mBAAmB;IAC1B,WAAW,EAAE,IAAI;CAClB,CAAA;AAED,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,UAAU,EAAE,CAAA;AAE9D,oDAAoD;AACpD,eAAe,cAAc,CAAA"}

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

@@ -1,19 +1,17 @@
-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>;
 }
 export type { EthAccountProps };

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

@@ -1 +1 @@
-{"version":3,"file":"EthAccountProps.d.ts","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccountProps.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACxC,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAC3C,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,eAAe,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAA;AAEtD,UAAU,eAAgB,SAAQ,QAAQ;IACxC,OAAO,CAAC,EAAE,UAAU,GAAG,IAAI,CAAA;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,EAAE,CAAC,EAAE,EAAE,CAAA;IACP,SAAS,CAAC,EAAE,eAAe,CAAA;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,aAAa,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAA;CACrD;AAED,YAAY,EAAE,eAAe,EAAE,CAAA"}
+{"version":3,"file":"EthAccountProps.d.ts","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccountProps.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAC3C,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAE3C,UAAU,eAAgB,SAAQ,aAAa;IAC7C,OAAO,CAAC,EAAE,UAAU,GAAG,IAAI,CAAA;IAC3B,aAAa,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,CAAA;IACzC,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,aAAa,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAA;CACrD;AAED,YAAY,EAAE,eAAe,EAAE,CAAA"}

package/dist/components/Identicon.d.ts

@@ -1,10 +1,11 @@
 import React from 'react';
-interface IdenticonProps {
+import { FlexBoxProps } from './FlexBox';
+interface IdenticonProps extends FlexBoxProps {
     bg?: string;
     className?: string;
     count?: number;
     fg?: string;
-    padding?: number;
+    iconPadding?: number;
     palette?: string[];
     size?: number;
     value?: string;

package/dist/components/Identicon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Identicon.d.ts","sourceRoot":"","sources":["../../src/components/Identicon.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAMhD,UAAU,cAAc;IACtB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAyDD,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAUvC,CAAA;AAED,OAAO,EAAE,SAAS,EAAE,CAAA"}
+{"version":3,"file":"Identicon.d.ts","sourceRoot":"","sources":["../../src/components/Identicon.tsx"],"names":[],"mappings":"AACA,OAAO,KAA4B,MAAM,OAAO,CAAA;AAEhD,OAAO,EAAE,YAAY,EAAW,MAAM,WAAW,CAAA;AAMjD,UAAU,cAAe,SAAQ,YAAY;IAC3C,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,OAAO,CAAC,EAAE,MAAM,EAAE,CAAA;IAClB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAwDD,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAsBvC,CAAA;AAED,OAAO,EAAE,SAAS,EAAE,CAAA"}

package/dist/components/Identicon.js

@@ -1,11 +1,23 @@
+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 md5 from 'md5';
 import { useEffect, useRef } from 'react';
+import { FlexRow } from './FlexBox';
 const range = (n, in_min, in_max, out_min, out_max) => {
     return ((n - in_min) * (out_max - out_min)) / (in_max - in_min) + out_min;
 };
 const updateCanvas = (canvas, props) => {
-    const { value = '', size = 400, bg = 'transparent', count = 5, palette, padding = 0 } = props;
+    const { value = '', size = 400, bg = 'transparent', count = 5, palette, iconPadding = 0 } = props;
     let { fg } = props;
     const hash = md5(value);
     const block = Math.floor(size / count);
@@ -18,9 +30,8 @@ const updateCanvas = (canvas, props) => {
         const index = Math.floor(range(parseInt(hash.slice(-3), 16), 0, 4095, 0, palette.length));
         fg = palette[index];
     }
-    const pad = padding;
-    current.width = block * count + pad;
-    current.height = block * count + pad;
+    current.width = block * count + iconPadding;
+    current.height = block * count + iconPadding;
     const arr = hash.split('').map((el) => {
         const parsedEl = parseInt(el, 16);
         if (parsedEl < 8) {
@@ -42,23 +53,23 @@ const updateCanvas = (canvas, props) => {
             row.forEach((el, j) => {
                 if (el) {
                     ctx.fillStyle = fg ? fg : '#' + hashcolor;
-                    ctx.fillRect(block * i + pad, block * j + pad, block - pad, block - pad);
+                    ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding);
                 }
                 else {
                     ctx.fillStyle = bg;
-                    ctx.fillRect(block * i + pad, block * j + pad, block - pad, block - pad);
+                    ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding);
                 }
             });
         });
     }
 };
-const Identicon = (props) => {
-    const { size = 400, className = 'identicon' } = props;
+const Identicon = (_a) => {
+    var { size = 400, className = 'identicon', bg, count, fg, iconPadding, palette, value } = _a, props = __rest(_a, ["size", "className", "bg", "count", "fg", "iconPadding", "palette", "value"]);
     const canvas = useRef(null);
     useEffect(() => {
-        updateCanvas(canvas, props);
+        updateCanvas(canvas, { bg, className, count, fg, iconPadding, palette, size, value });
     });
-    return _jsx("canvas", { className: className, ref: canvas, style: { height: size, width: size } }, void 0);
+    return (_jsx(FlexRow, Object.assign({}, props, { children: _jsx("canvas", { className: className, ref: canvas, style: { height: size, width: size } }, void 0) }), void 0));
 };
 export { Identicon };
 //# sourceMappingURL=Identicon.js.map

package/dist/components/Identicon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Identicon.js","sourceRoot":"","sources":["../../src/components/Identicon.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Identicon.js","sourceRoot":"","sources":["../../src/components/Identicon.tsx"],"names":[],"mappings":"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"}

package/dist/components/TokenAmount/TokenAmount.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TokenAmount.d.ts","sourceRoot":"","sources":["../../../src/components/TokenAmount/TokenAmount.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAWrD,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAgC3C,CAAA;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}
+{"version":3,"file":"TokenAmount.d.ts","sourceRoot":"","sources":["../../../src/components/TokenAmount/TokenAmount.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAWrD,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA6C3C,CAAA;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}

package/dist/components/TokenAmount/TokenAmount.js

@@ -25,11 +25,10 @@ const base10Shift = (bn, places) => {
     }
 };
 const TokenAmount = (_a) => {
-    var { amount, places = -18, logo, label, onButtonClick } = _a, props = __rest(_a, ["amount", "places", "logo", "label", "onButtonClick"]);
+    var { fontFamily = '"Source Code Pro",monospace', textColor, bgcolor, style, amount, places = -18, logo, label, onButtonClick } = _a, props = __rest(_a, ["fontFamily", "textColor", "bgcolor", "style", "amount", "places", "logo", "label", "onButtonClick"]);
     const adjustedAmount = amount ? base10Shift(amount, places).toNumber() : undefined;
     const amountString = adjustedAmount ? Math.trunc(adjustedAmount).toLocaleString() : '-';
-    const fontFamily = '"Source Code Pro",monospace';
-    return (_jsx(FlexRow, Object.assign({ margin: 0.5, padding: 0.5 }, props, { children: _jsx(ButtonEx, Object.assign({ fullWidth: true, variant: "outlined", onClick: onButtonClick }, { children: _jsxs(FlexRow, Object.assign({ justifyContent: "space-between", width: "100%", busy: !amount, busySize: 16 }, { children: [_jsxs(FlexRow, { children: [logo ? _jsx("img", { src: xyoLogo, height: 24 }, void 0) : null, label ? (_jsx(Typography, Object.assign({ marginRight: 1, marginLeft: logo ? 1 : 0, noWrap: true, fontFamily: fontFamily, variant: "caption" }, { children: label }), void 0)) : null] }, void 0), _jsx(Typography, Object.assign({ noWrap: true, fontFamily: fontFamily, variant: "body1", style: { textTransform: 'none' } }, { children: amountString }), void 0)] }), void 0) }), void 0) }), void 0));
+    return (_jsx(ButtonEx, Object.assign({ style: Object.assign({ backgroundColor: bgcolor }, style), variant: "outlined", onClick: onButtonClick }, props, { children: _jsxs(FlexRow, Object.assign({ justifyContent: "space-between", width: "100%", busy: !amount, busySize: 16 }, { children: [_jsxs(FlexRow, { children: [logo ? _jsx("img", { src: xyoLogo, height: 24 }, void 0) : null, label ? (_jsx(Typography, Object.assign({ marginRight: 1, marginLeft: logo ? 1 : 0, noWrap: true, fontFamily: fontFamily, variant: "caption" }, { children: label }), void 0)) : null] }, void 0), _jsx(Typography, Object.assign({ color: textColor, noWrap: true, fontFamily: fontFamily, variant: "body1", style: { textTransform: 'none' } }, { children: amountString }), void 0)] }), void 0) }), void 0));
 };
 export { TokenAmount };
 //# sourceMappingURL=TokenAmount.js.map

package/dist/components/TokenAmount/TokenAmount.js.map

@@ -1 +1 @@
-{"version":3,"file":"TokenAmount.js","sourceRoot":"","sources":["../../../src/components/TokenAmount/TokenAmount.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAE1C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACpC,OAAO,OAAO,MAAM,eAAe,CAAA;AAGnC,MAAM,WAAW,GAAG,CAAC,EAAa,EAAE,MAAc,EAAE,EAAE;IACpD,MAAM,MAAM,GAAG,IAAI,SAAS,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,IAAI,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAA;IACrE,IAAI,MAAM,GAAG,CAAC,EAAE;QACd,OAAO,EAAE,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;KACtB;SAAM;QACL,OAAO,EAAE,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;KACtB;AACH,CAAC,CAAA;AAED,MAAM,WAAW,GAA+B,CAAC,EAA8D,EAAE,EAAE;QAAlE,EAAE,MAAM,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,aAAa,OAAY,EAAP,KAAK,cAA5D,sDAA8D,CAAF;IAC3G,MAAM,cAAc,GAAG,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,SAAS,CAAA;IAElF,MAAM,YAAY,GAAG,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,GAAG,CAAA;IAEvF,MAAM,UAAU,GAAG,6BAA6B,CAAA;IAEhD,OAAO,CACL,KAAC,OAAO,kBAAC,MAAM,EAAE,GAAG,EAAE,OAAO,EAAE,GAAG,IAAM,KAAK,cAC3C,KAAC,QAAQ,kBAAC,SAAS,QAAC,OAAO,EAAC,UAAU,EAAC,OAAO,EAAE,aAAa,gBAC3D,MAAC,OAAO,kBAAC,cAAc,EAAC,eAAe,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,EAAE,iBAC9E,MAAC,OAAO,eACL,IAAI,CAAC,CAAC,CAAC,cAAK,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,WAAI,CAAC,CAAC,CAAC,IAAI,EAC/C,KAAK,CAAC,CAAC,CAAC,CACP,KAAC,UAAU,kBACT,WAAW,EAAE,CAAC,EACd,UAAU,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EACxB,MAAM,EAAE,IAAI,EACZ,UAAU,EAAE,UAAU,EACtB,OAAO,EAAC,SAAS,gBAEhB,KAAK,YACK,CACd,CAAC,CAAC,CAAC,IAAI,YACA,EACV,KAAC,UAAU,kBAAC,MAAM,EAAE,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,EAAC,OAAO,EAAC,KAAK,EAAE,EAAE,aAAa,EAAE,MAAM,EAAE,gBAC/F,YAAY,YACF,aACL,YACD,YACH,CACX,CAAA;AACH,CAAC,CAAA;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}
+{"version":3,"file":"TokenAmount.js","sourceRoot":"","sources":["../../../src/components/TokenAmount/TokenAmount.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAE1C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACpC,OAAO,OAAO,MAAM,eAAe,CAAA;AAGnC,MAAM,WAAW,GAAG,CAAC,EAAa,EAAE,MAAc,EAAE,EAAE;IACpD,MAAM,MAAM,GAAG,IAAI,SAAS,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,IAAI,SAAS,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAA;IACrE,IAAI,MAAM,GAAG,CAAC,EAAE;QACd,OAAO,EAAE,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;KACtB;SAAM;QACL,OAAO,EAAE,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;KACtB;AACH,CAAC,CAAA;AAED,MAAM,WAAW,GAA+B,CAAC,EAWhD,EAAE,EAAE;QAX4C,EAC/C,UAAU,GAAG,6BAA6B,EAC1C,SAAS,EACT,OAAO,EACP,KAAK,EACL,MAAM,EACN,MAAM,GAAG,CAAC,EAAE,EACZ,IAAI,EACJ,KAAK,EACL,aAAa,OAEd,EADI,KAAK,cAVuC,qGAWhD,CADS;IAER,MAAM,cAAc,GAAG,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,SAAS,CAAA;IAElF,MAAM,YAAY,GAAG,cAAc,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,GAAG,CAAA;IAEvF,OAAO,CACL,KAAC,QAAQ,kBAAC,KAAK,kBAAI,eAAe,EAAE,OAAO,IAAK,KAAK,GAAI,OAAO,EAAC,UAAU,EAAC,OAAO,EAAE,aAAa,IAAM,KAAK,cAC3G,MAAC,OAAO,kBAAC,cAAc,EAAC,eAAe,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,EAAE,iBAC9E,MAAC,OAAO,eACL,IAAI,CAAC,CAAC,CAAC,cAAK,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,WAAI,CAAC,CAAC,CAAC,IAAI,EAC/C,KAAK,CAAC,CAAC,CAAC,CACP,KAAC,UAAU,kBACT,WAAW,EAAE,CAAC,EACd,UAAU,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EACxB,MAAM,EAAE,IAAI,EACZ,UAAU,EAAE,UAAU,EACtB,OAAO,EAAC,SAAS,gBAEhB,KAAK,YACK,CACd,CAAC,CAAC,CAAC,IAAI,YACA,EACV,KAAC,UAAU,kBACT,KAAK,EAAE,SAAS,EAChB,MAAM,EAAE,IAAI,EACZ,UAAU,EAAE,UAAU,EACtB,OAAO,EAAC,OAAO,EACf,KAAK,EAAE,EAAE,aAAa,EAAE,MAAM,EAAE,gBAE/B,YAAY,YACF,aACL,YACD,CACZ,CAAA;AACH,CAAC,CAAA;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}

package/dist/components/TokenAmount/TokenAmount.stories.d.ts

@@ -3,8 +3,9 @@ import { ComponentMeta, ComponentStory } from '@storybook/react';
 declare const StorybookEntry: ComponentMeta<import("react").FC<import("./TokenAmountProps").TokenAmountProps>>;
 declare const Default: ComponentStory<import("react").FC<import("./TokenAmountProps").TokenAmountProps>>;
 declare const WithLogo: ComponentStory<import("react").FC<import("./TokenAmountProps").TokenAmountProps>>;
+declare const WithLogoAndColor: ComponentStory<import("react").FC<import("./TokenAmountProps").TokenAmountProps>>;
 declare const WithLabel: ComponentStory<import("react").FC<import("./TokenAmountProps").TokenAmountProps>>;
 declare const WithLogoAndLabel: ComponentStory<import("react").FC<import("./TokenAmountProps").TokenAmountProps>>;
-export { Default, WithLabel, WithLogo, WithLogoAndLabel };
+export { Default, WithLabel, WithLogo, WithLogoAndColor, WithLogoAndLabel };
 export default StorybookEntry;
 //# sourceMappingURL=TokenAmount.stories.d.ts.map

package/dist/components/TokenAmount/TokenAmount.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TokenAmount.stories.d.ts","sourceRoot":"","sources":["../../../src/components/TokenAmount/TokenAmount.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAKhE,QAAA,MAAM,cAAc,kFASkB,CAAA;AAItC,QAAA,MAAM,OAAO,mFAAoB,CAAA;AAKjC,QAAA,MAAM,QAAQ,mFAAoB,CAAA;AAMlC,QAAA,MAAM,SAAS,mFAAoB,CAAA;AAMnC,QAAA,MAAM,gBAAgB,mFAAoB,CAAA;AAO1C,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,gBAAgB,EAAE,CAAA;AAGzD,eAAe,cAAc,CAAA"}
+{"version":3,"file":"TokenAmount.stories.d.ts","sourceRoot":"","sources":["../../../src/components/TokenAmount/TokenAmount.stories.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAKhE,QAAA,MAAM,cAAc,kFASkB,CAAA;AAItC,QAAA,MAAM,OAAO,mFAAoB,CAAA;AAKjC,QAAA,MAAM,QAAQ,mFAAoB,CAAA;AAMlC,QAAA,MAAM,gBAAgB,mFAAoB,CAAA;AAO1C,QAAA,MAAM,SAAS,mFAAoB,CAAA;AAMnC,QAAA,MAAM,gBAAgB,mFAAoB,CAAA;AAO1C,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAA;AAG3E,eAAe,cAAc,CAAA"}

package/dist/components/TokenAmount/TokenAmount.stories.js

@@ -21,6 +21,12 @@ WithLogo.args = {
     amount: new BigNumber('1195c751dbcc90ab4200000', 16),
     logo: true,
 };
+const WithLogoAndColor = Template.bind({});
+WithLogoAndColor.args = {
+    amount: new BigNumber('1195c751dbcc90ab4200000', 16),
+    bgcolor: '#ff0',
+    logo: true,
+};
 const WithLabel = Template.bind({});
 WithLabel.args = {
     amount: new BigNumber('1195c751dbcc90ab4200000', 16),
@@ -32,7 +38,7 @@ WithLogoAndLabel.args = {
     label: 'Balance',
     logo: true,
 };
-export { Default, WithLabel, WithLogo, WithLogoAndLabel };
+export { Default, WithLabel, WithLogo, WithLogoAndColor, WithLogoAndLabel };
 // eslint-disable-next-line import/no-default-export
 export default StorybookEntry;
 //# sourceMappingURL=TokenAmount.stories.js.map

package/dist/components/TokenAmount/TokenAmount.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"TokenAmount.stories.js","sourceRoot":"","sources":["../../../src/components/TokenAmount/TokenAmount.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAE1C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE3C,MAAM,cAAc,GAAG;IACrB,QAAQ,EAAE,EAAE;IACZ,SAAS,EAAE,WAAW;IACtB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,IAAI,EAAE,IAAI;SACX;KACF;IACD,KAAK,EAAE,wBAAwB;CACK,CAAA;AAEtC,MAAM,QAAQ,GAAuC,CAAC,IAAI,EAAE,EAAE,CAAC,KAAC,WAAW,oBAAK,IAAI,UAAgB,CAAA;AAEpG,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACjC,OAAO,CAAC,IAAI,GAAG;IACb,MAAM,EAAE,IAAI,SAAS,CAAC,yBAAyB,EAAE,EAAE,CAAC;CACrD,CAAA;AAED,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAClC,QAAQ,CAAC,IAAI,GAAG;IACd,MAAM,EAAE,IAAI,SAAS,CAAC,yBAAyB,EAAE,EAAE,CAAC;IACpD,IAAI,EAAE,IAAI;CACX,CAAA;AAED,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACnC,SAAS,CAAC,IAAI,GAAG;IACf,MAAM,EAAE,IAAI,SAAS,CAAC,yBAAyB,EAAE,EAAE,CAAC;IACpD,KAAK,EAAE,SAAS;CACjB,CAAA;AAED,MAAM,gBAAgB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAC1C,gBAAgB,CAAC,IAAI,GAAG;IACtB,MAAM,EAAE,IAAI,SAAS,CAAC,yBAAyB,EAAE,EAAE,CAAC;IACpD,KAAK,EAAE,SAAS;IAChB,IAAI,EAAE,IAAI;CACX,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,gBAAgB,EAAE,CAAA;AAEzD,oDAAoD;AACpD,eAAe,cAAc,CAAA"}
+{"version":3,"file":"TokenAmount.stories.js","sourceRoot":"","sources":["../../../src/components/TokenAmount/TokenAmount.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAE1C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA;AAE3C,MAAM,cAAc,GAAG;IACrB,QAAQ,EAAE,EAAE;IACZ,SAAS,EAAE,WAAW;IACtB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,IAAI,EAAE,IAAI;SACX;KACF;IACD,KAAK,EAAE,wBAAwB;CACK,CAAA;AAEtC,MAAM,QAAQ,GAAuC,CAAC,IAAI,EAAE,EAAE,CAAC,KAAC,WAAW,oBAAK,IAAI,UAAgB,CAAA;AAEpG,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACjC,OAAO,CAAC,IAAI,GAAG;IACb,MAAM,EAAE,IAAI,SAAS,CAAC,yBAAyB,EAAE,EAAE,CAAC;CACrD,CAAA;AAED,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAClC,QAAQ,CAAC,IAAI,GAAG;IACd,MAAM,EAAE,IAAI,SAAS,CAAC,yBAAyB,EAAE,EAAE,CAAC;IACpD,IAAI,EAAE,IAAI;CACX,CAAA;AAED,MAAM,gBAAgB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAC1C,gBAAgB,CAAC,IAAI,GAAG;IACtB,MAAM,EAAE,IAAI,SAAS,CAAC,yBAAyB,EAAE,EAAE,CAAC;IACpD,OAAO,EAAE,MAAM;IACf,IAAI,EAAE,IAAI;CACX,CAAA;AAED,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AACnC,SAAS,CAAC,IAAI,GAAG;IACf,MAAM,EAAE,IAAI,SAAS,CAAC,yBAAyB,EAAE,EAAE,CAAC;IACpD,KAAK,EAAE,SAAS;CACjB,CAAA;AAED,MAAM,gBAAgB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;AAC1C,gBAAgB,CAAC,IAAI,GAAG;IACtB,MAAM,EAAE,IAAI,SAAS,CAAC,yBAAyB,EAAE,EAAE,CAAC;IACpD,KAAK,EAAE,SAAS;IAChB,IAAI,EAAE,IAAI;CACX,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,CAAA;AAE3E,oDAAoD;AACpD,eAAe,cAAc,CAAA"}

package/dist/components/TokenAmount/TokenAmountProps.d.ts

@@ -1,12 +1,15 @@
 /// <reference types="bn.js" />
 import { BigNumber } from '@xylabs/sdk-js';
 import { MouseEventHandler } from 'react';
-import { FlexBoxProps } from '../FlexBox';
-interface TokenAmountProps extends FlexBoxProps {
+import { ButtonExProps } from '../ButtonEx';
+interface TokenAmountProps extends ButtonExProps {
     amount?: BigNumber | null;
     label?: string;
     logo?: boolean;
     places?: number;
+    fontFamily?: string;
+    textColor?: string;
+    bgcolor?: string;
     onButtonClick?: MouseEventHandler<HTMLButtonElement>;
 }
 export type { TokenAmountProps };

package/dist/components/TokenAmount/TokenAmountProps.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TokenAmountProps.d.ts","sourceRoot":"","sources":["../../../src/components/TokenAmount/TokenAmountProps.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAEzC,UAAU,gBAAiB,SAAQ,YAAY;IAC7C,MAAM,CAAC,EAAE,SAAS,GAAG,IAAI,CAAA;IACzB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,aAAa,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAA;CACrD;AAED,YAAY,EAAE,gBAAgB,EAAE,CAAA"}
+{"version":3,"file":"TokenAmountProps.d.ts","sourceRoot":"","sources":["../../../src/components/TokenAmount/TokenAmountProps.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAE3C,UAAU,gBAAiB,SAAQ,aAAa;IAC9C,MAAM,CAAC,EAAE,SAAS,GAAG,IAAI,CAAA;IACzB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,aAAa,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAA;CACrD;AAED,YAAY,EAAE,gBAAgB,EAAE,CAAA"}

package/package.json

@@ -26,16 +26,16 @@
     "@emotion/styled": "^11.6.0",
     "@ethersproject/abstract-signer": "^5.5.0",
     "@ethersproject/providers": "^5.5.1",
-    "@mui/icons-material": "^5.2.0",
-    "@mui/material": "^5.2.2",
-    "@mui/styles": "^5.2.2",
-    "@storybook/addon-actions": "^6.4.7",
-    "@storybook/addon-docs": "^6.4.7",
-    "@storybook/addon-essentials": "^6.4.7",
-    "@storybook/addon-links": "^6.4.7",
-    "@storybook/components": "^6.4.7",
-    "@storybook/core-events": "^6.4.7",
-    "@storybook/react": "^6.4.7",
+    "@mui/icons-material": "^5.2.1",
+    "@mui/material": "^5.2.3",
+    "@mui/styles": "^5.2.3",
+    "@storybook/addon-actions": "^6.4.8",
+    "@storybook/addon-docs": "^6.4.8",
+    "@storybook/addon-essentials": "^6.4.8",
+    "@storybook/addon-links": "^6.4.8",
+    "@storybook/components": "^6.4.8",
+    "@storybook/core-events": "^6.4.8",
+    "@storybook/react": "^6.4.8",
     "@types/bn.js": "^5.1.0",
     "@types/lodash": "^4.14.177",
     "@types/md5": "^2.3.1",
@@ -43,7 +43,7 @@
     "@types/react": "^17",
     "@xylabs/eslint-config-react": "^2",
     "@xylabs/pixel": "^1.1.6",
-    "@xylabs/sdk-js": "^2.3.12",
+    "@xylabs/sdk-js": "^2.3.13",
     "@xylabs/ts-scripts": "^1.0.23",
     "babel-loader": "^8.2.3",
     "bn.js": "^5.2.0",
@@ -108,5 +108,5 @@
   "sideEffects": false,
   "type": "module",
   "types": "dist/index.d.ts",
-  "version": "2.7.7"
+  "version": "2.7.11"
 }

package/src/components/EthAccount/EthAccount.stories.tsx

@@ -1,6 +1,7 @@
 import { ComponentMeta, ComponentStory } from '@storybook/react'
 import { EthAddress } from '@xylabs/sdk-js'
 
+import { FlexRow } from '../FlexBox'
 import { EthAccount } from './EthAccount'
 
 const StorybookEntry = {
@@ -14,18 +15,64 @@ const StorybookEntry = {
   title: 'Components/EthAccount',
 } as ComponentMeta<typeof EthAccount>
 
-const Template: ComponentStory<typeof EthAccount> = (args) => <EthAccount {...args}></EthAccount>
+const Template: ComponentStory<typeof EthAccount> = (args) => (
+  <FlexRow>
+    <EthAccount variant="outlined" {...args}></EthAccount>
+  </FlexRow>
+)
 
-const Default = Template.bind({})
-Default.args = {
+const Long = Template.bind({})
+Long.args = {
   address: EthAddress.fromString('0x6792b02f88b32c4fe8e31cfa41ae5af44865f930'),
-  auto: true,
+  addressLength: 'long',
   icon: true,
   title: 'Sample EthAccount',
   toEtherScan: true,
 }
 
-export { Default }
+const LongEmpty = Template.bind({})
+LongEmpty.args = {
+  addressLength: 'long',
+  icon: true,
+  title: 'Sample EthAccount',
+  toEtherScan: true,
+}
+
+const Short = Template.bind({})
+Short.args = {
+  address: EthAddress.fromString('0x6792b02f88b32c4fe8e31cfa41ae5af44865f930'),
+  addressLength: 'short',
+  icon: true,
+  title: 'Sample EthAccount',
+  toEtherScan: true,
+}
+
+const ShortEmpty = Template.bind({})
+ShortEmpty.args = {
+  addressLength: 'short',
+  icon: true,
+  title: 'Sample EthAccount',
+  toEtherScan: true,
+}
+
+const Auto = Template.bind({})
+Auto.args = {
+  address: EthAddress.fromString('0x6792b02f88b32c4fe8e31cfa41ae5af44865f930'),
+  addressLength: 'auto',
+  icon: true,
+  title: 'Sample EthAccount',
+  toEtherScan: true,
+}
+
+const AutoEmpty = Template.bind({})
+AutoEmpty.args = {
+  addressLength: 'auto',
+  icon: true,
+  title: 'Sample EthAccount',
+  toEtherScan: true,
+}
+
+export { Auto, AutoEmpty, Long, LongEmpty, Short, ShortEmpty }
 
 // eslint-disable-next-line import/no-default-export
 export default StorybookEntry

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 && address ? <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/Identicon.tsx

@@ -1,23 +1,25 @@
 import md5 from 'md5'
 import React, { useEffect, useRef } from 'react'
 
+import { FlexBoxProps, FlexRow } from './FlexBox'
+
 const range = (n: number, in_min: number, in_max: number, out_min: number, out_max: number) => {
   return ((n - in_min) * (out_max - out_min)) / (in_max - in_min) + out_min
 }
 
-interface IdenticonProps {
+interface IdenticonProps extends FlexBoxProps {
   bg?: string
   className?: string
   count?: number
   fg?: string
-  padding?: number
+  iconPadding?: number
   palette?: string[]
   size?: number
   value?: string
 }
 
 const updateCanvas = (canvas: React.RefObject<HTMLCanvasElement>, props: IdenticonProps) => {
-  const { value = '', size = 400, bg = 'transparent', count = 5, palette, padding = 0 } = props
+  const { value = '', size = 400, bg = 'transparent', count = 5, palette, iconPadding = 0 } = props
   let { fg } = props
   const hash = md5(value)
   const block = Math.floor(size / count)
@@ -34,9 +36,8 @@ const updateCanvas = (canvas: React.RefObject<HTMLCanvasElement>, props: Identic
     fg = palette[index]
   }
 
-  const pad = padding
-  current.width = block * count + pad
-  current.height = block * count + pad
+  current.width = block * count + iconPadding
+  current.height = block * count + iconPadding
   const arr = hash.split('').map((el) => {
     const parsedEl = parseInt(el, 16)
     if (parsedEl < 8) {
@@ -61,26 +62,38 @@ const updateCanvas = (canvas: React.RefObject<HTMLCanvasElement>, props: Identic
       row.forEach((el, j) => {
         if (el) {
           ctx.fillStyle = fg ? fg : '#' + hashcolor
-          ctx.fillRect(block * i + pad, block * j + pad, block - pad, block - pad)
+          ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)
         } else {
           ctx.fillStyle = bg
-          ctx.fillRect(block * i + pad, block * j + pad, block - pad, block - pad)
+          ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)
         }
       })
     })
   }
 }
 
-const Identicon: React.FC<IdenticonProps> = (props) => {
-  const { size = 400, className = 'identicon' } = props
-
+const Identicon: React.FC<IdenticonProps> = ({
+  size = 400,
+  className = 'identicon',
+  bg,
+  count,
+  fg,
+  iconPadding,
+  palette,
+  value,
+  ...props
+}) => {
   const canvas = useRef<HTMLCanvasElement>(null)
 
   useEffect(() => {
-    updateCanvas(canvas, props)
+    updateCanvas(canvas, { bg, className, count, fg, iconPadding, palette, size, value })
   })
 
-  return <canvas className={className} ref={canvas} style={{ height: size, width: size }} />
+  return (
+    <FlexRow {...props}>
+      <canvas className={className} ref={canvas} style={{ height: size, width: size }} />
+    </FlexRow>
+  )
 }
 
 export { Identicon }

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

@@ -27,6 +27,13 @@ WithLogo.args = {
   logo: true,
 }
 
+const WithLogoAndColor = Template.bind({})
+WithLogoAndColor.args = {
+  amount: new BigNumber('1195c751dbcc90ab4200000', 16),
+  bgcolor: '#ff0',
+  logo: true,
+}
+
 const WithLabel = Template.bind({})
 WithLabel.args = {
   amount: new BigNumber('1195c751dbcc90ab4200000', 16),
@@ -40,7 +47,7 @@ WithLogoAndLabel.args = {
   logo: true,
 }
 
-export { Default, WithLabel, WithLogo, WithLogoAndLabel }
+export { Default, WithLabel, WithLogo, WithLogoAndColor, WithLogoAndLabel }
 
 // eslint-disable-next-line import/no-default-export
 export default StorybookEntry

package/src/components/TokenAmount/TokenAmount.tsx

@@ -15,37 +15,50 @@ const base10Shift = (bn: BigNumber, places: number) => {
   }
 }
 
-const TokenAmount: React.FC<TokenAmountProps> = ({ amount, places = -18, logo, label, onButtonClick, ...props }) => {
+const TokenAmount: React.FC<TokenAmountProps> = ({
+  fontFamily = '"Source Code Pro",monospace',
+  textColor,
+  bgcolor,
+  style,
+  amount,
+  places = -18,
+  logo,
+  label,
+  onButtonClick,
+  ...props
+}) => {
   const adjustedAmount = amount ? base10Shift(amount, places).toNumber() : undefined
 
   const amountString = adjustedAmount ? Math.trunc(adjustedAmount).toLocaleString() : '-'
 
-  const fontFamily = '"Source Code Pro",monospace'
-
   return (
-    <FlexRow margin={0.5} padding={0.5} {...props}>
-      <ButtonEx fullWidth variant="outlined" onClick={onButtonClick}>
-        <FlexRow justifyContent="space-between" width="100%" busy={!amount} busySize={16}>
-          <FlexRow>
-            {logo ? <img src={xyoLogo} height={24} /> : null}
-            {label ? (
-              <Typography
-                marginRight={1}
-                marginLeft={logo ? 1 : 0}
-                noWrap={true}
-                fontFamily={fontFamily}
-                variant="caption"
-              >
-                {label}
-              </Typography>
-            ) : null}
-          </FlexRow>
-          <Typography noWrap={true} fontFamily={fontFamily} variant="body1" style={{ textTransform: 'none' }}>
-            {amountString}
-          </Typography>
+    <ButtonEx style={{ backgroundColor: bgcolor, ...style }} variant="outlined" onClick={onButtonClick} {...props}>
+      <FlexRow justifyContent="space-between" width="100%" busy={!amount} busySize={16}>
+        <FlexRow>
+          {logo ? <img src={xyoLogo} height={24} /> : null}
+          {label ? (
+            <Typography
+              marginRight={1}
+              marginLeft={logo ? 1 : 0}
+              noWrap={true}
+              fontFamily={fontFamily}
+              variant="caption"
+            >
+              {label}
+            </Typography>
+          ) : null}
         </FlexRow>
-      </ButtonEx>
-    </FlexRow>
+        <Typography
+          color={textColor}
+          noWrap={true}
+          fontFamily={fontFamily}
+          variant="body1"
+          style={{ textTransform: 'none' }}
+        >
+          {amountString}
+        </Typography>
+      </FlexRow>
+    </ButtonEx>
   )
 }
 

package/src/components/TokenAmount/TokenAmountProps.tsx

@@ -1,13 +1,16 @@
 import { BigNumber } from '@xylabs/sdk-js'
 import { MouseEventHandler } from 'react'
 
-import { FlexBoxProps } from '../FlexBox'
+import { ButtonExProps } from '../ButtonEx'
 
-interface TokenAmountProps extends FlexBoxProps {
+interface TokenAmountProps extends ButtonExProps {
   amount?: BigNumber | null
   label?: string
   logo?: boolean
   places?: number
+  fontFamily?: string
+  textColor?: string
+  bgcolor?: string
   onButtonClick?: MouseEventHandler<HTMLButtonElement>
 }
 

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":";AAQA,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,42 +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, useTheme } from '@mui/material';
-import { useContext } from 'react';
-import { EthersContext } from '../../contexts';
-import { useMediaQuery } from '../../hooks';
-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":"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"}

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,60 +0,0 @@
-import { Typography, useTheme } from '@mui/material'
-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'
-
-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 }