@xyo-network/react-shared 2.27.13 → 2.27.16

package/dist/esm/components/TokenSummary/TokenSummary.d.ts

@@ -5,6 +5,7 @@ export interface TokenSummaryProps extends FlexBoxProps {
     icon?: string;
     symbol?: string;
     imgBgProps?: PaperProps;
+    imageMode?: 'circle';
 }
 export declare const TokenSummary: React.FC<TokenSummaryProps>;
 //# sourceMappingURL=TokenSummary.d.ts.map

package/dist/esm/components/TokenSummary/TokenSummary.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TokenSummary.d.ts","sourceRoot":"","sources":["../../../../src/components/TokenSummary/TokenSummary.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAS,UAAU,EAAc,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAE,YAAY,EAAoB,MAAM,uBAAuB,CAAA;AAEtE,MAAM,WAAW,iBAAkB,SAAQ,YAAY;IACrD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,UAAU,CAAC,EAAE,UAAU,CAAA;CACxB;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAcpD,CAAA"}
+{"version":3,"file":"TokenSummary.d.ts","sourceRoot":"","sources":["../../../../src/components/TokenSummary/TokenSummary.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAS,UAAU,EAAc,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAE,YAAY,EAAoB,MAAM,uBAAuB,CAAA;AAEtE,MAAM,WAAW,iBAAkB,SAAQ,YAAY;IACrD,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,UAAU,CAAC,EAAE,UAAU,CAAA;IACvB,SAAS,CAAC,EAAE,QAAQ,CAAA;CACrB;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAqBpD,CAAA"}

package/dist/esm/components/TokenSummary/TokenSummary.js

@@ -1,7 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Paper, Typography } from '@mui/material';
 import { FlexCol, FlexRow } from '@xylabs/react-flexbox';
-export const TokenSummary = ({ imgBgProps, icon, symbol, children, ...props }) => {
-    return (_jsxs(_Fragment, { children: [_jsxs(FlexRow, { className: "TokenSummary-root", paddingBottom: 3, width: "100%", justifyContent: "flex-start", ...props, children: [_jsx(Paper, { component: FlexCol, padding: 1, className: "token-logo-bg", height: "40px", width: "40px", sx: { borderRadius: '50%' }, ...imgBgProps, children: _jsx("img", { src: icon, height: "25px" }) }), _jsx(Typography, { variant: "h6", fontWeight: 300, textTransform: "uppercase", paddingLeft: 1, children: symbol })] }), children] }));
+export const TokenSummary = ({ imageMode = 'circle', imgBgProps = {}, icon, symbol, children, ...props }) => {
+    const paperProps = {
+        ...imgBgProps,
+        sx: {
+            ...imgBgProps.sx,
+            borderRadius: imageMode === 'circle' ? '50%' : 'inherit',
+        },
+    };
+    return (_jsxs(_Fragment, { children: [_jsxs(FlexRow, { className: "TokenSummary-root", paddingBottom: 3, width: "100%", justifyContent: "flex-start", ...props, children: [_jsx(Paper, { component: FlexCol, padding: 1, className: "token-logo-bg", height: "40px", width: "40px", ...paperProps, children: _jsx("img", { src: icon, height: "25px" }) }), _jsx(Typography, { variant: "h6", fontWeight: 300, textTransform: "uppercase", paddingLeft: 1, children: symbol })] }), children] }));
 };
 //# sourceMappingURL=TokenSummary.js.map

package/dist/esm/components/TokenSummary/TokenSummary.js.map

@@ -1 +1 @@
-{"version":3,"file":"TokenSummary.js","sourceRoot":"","sources":["../../../../src/components/TokenSummary/TokenSummary.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAc,UAAU,EAAE,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAgB,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAQtE,MAAM,CAAC,MAAM,YAAY,GAAgC,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAC5G,OAAO,CACL,8BACE,MAAC,OAAO,IAAC,SAAS,EAAC,mBAAmB,EAAC,aAAa,EAAE,CAAC,EAAE,KAAK,EAAC,MAAM,EAAC,cAAc,EAAC,YAAY,KAAK,KAAK,aACzG,KAAC,KAAK,IAAC,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,EAAC,eAAe,EAAC,MAAM,EAAC,MAAM,EAAC,KAAK,EAAC,MAAM,EAAC,EAAE,EAAE,EAAE,YAAY,EAAE,KAAK,EAAE,KAAM,UAAU,YACrI,cAAK,GAAG,EAAE,IAAI,EAAE,MAAM,EAAC,MAAM,GAAG,GAC1B,EACR,KAAC,UAAU,IAAC,OAAO,EAAC,IAAI,EAAC,UAAU,EAAE,GAAG,EAAE,aAAa,EAAC,WAAW,EAAC,WAAW,EAAE,CAAC,YAC/E,MAAM,GACI,IACL,EACT,QAAQ,IACR,CACJ,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"TokenSummary.js","sourceRoot":"","sources":["../../../../src/components/TokenSummary/TokenSummary.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAc,UAAU,EAAE,MAAM,eAAe,CAAA;AAC7D,OAAO,EAAgB,OAAO,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAStE,MAAM,CAAC,MAAM,YAAY,GAAgC,CAAC,EAAE,SAAS,GAAG,QAAQ,EAAE,UAAU,GAAG,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACvI,MAAM,UAAU,GAAG;QACjB,GAAG,UAAU;QACb,EAAE,EAAE;YACF,GAAG,UAAU,CAAC,EAAE;YAChB,YAAY,EAAE,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;SACzD;KACF,CAAA;IACD,OAAO,CACL,8BACE,MAAC,OAAO,IAAC,SAAS,EAAC,mBAAmB,EAAC,aAAa,EAAE,CAAC,EAAE,KAAK,EAAC,MAAM,EAAC,cAAc,EAAC,YAAY,KAAK,KAAK,aACzG,KAAC,KAAK,IAAC,SAAS,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,EAAC,eAAe,EAAC,MAAM,EAAC,MAAM,EAAC,KAAK,EAAC,MAAM,KAAK,UAAU,YACxG,cAAK,GAAG,EAAE,IAAI,EAAE,MAAM,EAAC,MAAM,GAAG,GAC1B,EACR,KAAC,UAAU,IAAC,OAAO,EAAC,IAAI,EAAC,UAAU,EAAE,GAAG,EAAE,aAAa,EAAC,WAAW,EAAC,WAAW,EAAE,CAAC,YAC/E,MAAM,GACI,IACL,EACT,QAAQ,IACR,CACJ,CAAA;AACH,CAAC,CAAA"}

package/package.json

@@ -22,7 +22,7 @@
     "@xylabs/react-flexbox": "^2.14.10",
     "@xylabs/react-link": "^2.14.10",
     "@xylabs/react-shared": "^2.14.10",
-    "@xyo-network/core": "^2.24.12",
+    "@xyo-network/core": "^2.25.2",
     "axios": "^0.27.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
@@ -34,9 +34,9 @@
   "devDependencies": {
     "@storybook/react": "^6.5.10",
     "@xylabs/pixel": "^1.4.5",
-    "@xylabs/tsconfig-dom": "^2.5.87",
-    "@xyo-network/api": "^2.24.12",
-    "@xyo-network/react-storybook": "^2.27.13"
+    "@xylabs/tsconfig-dom": "^2.5.88",
+    "@xyo-network/api": "^2.25.2",
+    "@xyo-network/react-storybook": "^2.27.16"
   },
   "browser": "dist/esm/index.js",
   "docs": "dist/docs.json",
@@ -80,5 +80,5 @@
   },
   "sideEffects": false,
   "types": "dist/esm/index.d.ts",
-  "version": "2.27.13"
+  "version": "2.27.16"
 }

package/src/components/TokenSummary/TokenSummary.tsx

@@ -5,13 +5,21 @@ export interface TokenSummaryProps extends FlexBoxProps {
   icon?: string
   symbol?: string
   imgBgProps?: PaperProps
+  imageMode?: 'circle'
 }
 
-export const TokenSummary: React.FC<TokenSummaryProps> = ({ imgBgProps, icon, symbol, children, ...props }) => {
+export const TokenSummary: React.FC<TokenSummaryProps> = ({ imageMode = 'circle', imgBgProps = {}, icon, symbol, children, ...props }) => {
+  const paperProps = {
+    ...imgBgProps,
+    sx: {
+      ...imgBgProps.sx,
+      borderRadius: imageMode === 'circle' ? '50%' : 'inherit',
+    },
+  }
   return (
     <>
       <FlexRow className="TokenSummary-root" paddingBottom={3} width="100%" justifyContent="flex-start" {...props}>
-        <Paper component={FlexCol} padding={1} className="token-logo-bg" height="40px" width="40px" sx={{ borderRadius: '50%' }} {...imgBgProps}>
+        <Paper component={FlexCol} padding={1} className="token-logo-bg" height="40px" width="40px" {...paperProps}>
           <img src={icon} height="25px" />
         </Paper>
         <Typography variant="h6" fontWeight={300} textTransform="uppercase" paddingLeft={1}>