@xylabs/sdk-react 2.7.9 → 2.7.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -39,7 +39,7 @@ const EthAccount = (_a) => {
39
39
  ? addressToDisplay.toString()
40
40
  : addressToDisplay.toShortString();
41
41
  // Note: We use the all zero address for spacing in case it is
42
- 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 ? _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));
42
+ 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));
43
43
  };
44
44
  export { EthAccount };
45
45
  //# sourceMappingURL=EthAccount.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"EthAccount.js","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccount.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"EthAccount.js","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccount.tsx"],"names":[],"mappings":"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"}
@@ -1,10 +1,11 @@
1
1
  import React from 'react';
2
- interface IdenticonProps {
2
+ import { FlexBoxProps } from './FlexBox';
3
+ interface IdenticonProps extends FlexBoxProps {
3
4
  bg?: string;
4
5
  className?: string;
5
6
  count?: number;
6
7
  fg?: string;
7
- padding?: number;
8
+ iconPadding?: number;
8
9
  palette?: string[];
9
10
  size?: number;
10
11
  value?: string;
@@ -1 +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"}
1
+ {"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"}
@@ -1,11 +1,23 @@
1
+ var __rest = (this && this.__rest) || function (s, e) {
2
+ var t = {};
3
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
4
+ t[p] = s[p];
5
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
6
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
7
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
8
+ t[p[i]] = s[p[i]];
9
+ }
10
+ return t;
11
+ };
1
12
  import { jsx as _jsx } from "react/jsx-runtime";
2
13
  import md5 from 'md5';
3
14
  import { useEffect, useRef } from 'react';
15
+ import { FlexRow } from './FlexBox';
4
16
  const range = (n, in_min, in_max, out_min, out_max) => {
5
17
  return ((n - in_min) * (out_max - out_min)) / (in_max - in_min) + out_min;
6
18
  };
7
19
  const updateCanvas = (canvas, props) => {
8
- const { value = '', size = 400, bg = 'transparent', count = 5, palette, padding = 0 } = props;
20
+ const { value = '', size = 400, bg = 'transparent', count = 5, palette, iconPadding = 0 } = props;
9
21
  let { fg } = props;
10
22
  const hash = md5(value);
11
23
  const block = Math.floor(size / count);
@@ -18,9 +30,8 @@ const updateCanvas = (canvas, props) => {
18
30
  const index = Math.floor(range(parseInt(hash.slice(-3), 16), 0, 4095, 0, palette.length));
19
31
  fg = palette[index];
20
32
  }
21
- const pad = padding;
22
- current.width = block * count + pad;
23
- current.height = block * count + pad;
33
+ current.width = block * count + iconPadding;
34
+ current.height = block * count + iconPadding;
24
35
  const arr = hash.split('').map((el) => {
25
36
  const parsedEl = parseInt(el, 16);
26
37
  if (parsedEl < 8) {
@@ -42,23 +53,23 @@ const updateCanvas = (canvas, props) => {
42
53
  row.forEach((el, j) => {
43
54
  if (el) {
44
55
  ctx.fillStyle = fg ? fg : '#' + hashcolor;
45
- ctx.fillRect(block * i + pad, block * j + pad, block - pad, block - pad);
56
+ ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding);
46
57
  }
47
58
  else {
48
59
  ctx.fillStyle = bg;
49
- ctx.fillRect(block * i + pad, block * j + pad, block - pad, block - pad);
60
+ ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding);
50
61
  }
51
62
  });
52
63
  });
53
64
  }
54
65
  };
55
- const Identicon = (props) => {
56
- const { size = 400, className = 'identicon' } = props;
66
+ const Identicon = (_a) => {
67
+ var { size = 400, className = 'identicon', bg, count, fg, iconPadding, palette, value } = _a, props = __rest(_a, ["size", "className", "bg", "count", "fg", "iconPadding", "palette", "value"]);
57
68
  const canvas = useRef(null);
58
69
  useEffect(() => {
59
- updateCanvas(canvas, props);
70
+ updateCanvas(canvas, { bg, className, count, fg, iconPadding, palette, size, value });
60
71
  });
61
- return _jsx("canvas", { className: className, ref: canvas, style: { height: size, width: size } }, void 0);
72
+ return (_jsx(FlexRow, Object.assign({}, props, { children: _jsx("canvas", { className: className, ref: canvas, style: { height: size, width: size } }, void 0) }), void 0));
62
73
  };
63
74
  export { Identicon };
64
75
  //# sourceMappingURL=Identicon.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Identicon.js","sourceRoot":"","sources":["../../src/components/Identicon.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Identicon.js","sourceRoot":"","sources":["../../src/components/Identicon.tsx"],"names":[],"mappings":"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"}
@@ -1 +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"}
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,CA6C3C,CAAA;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}
@@ -25,11 +25,10 @@ const base10Shift = (bn, places) => {
25
25
  }
26
26
  };
27
27
  const TokenAmount = (_a) => {
28
- var { amount, places = -18, logo, label, onButtonClick } = _a, props = __rest(_a, ["amount", "places", "logo", "label", "onButtonClick"]);
28
+ var { fontFamily = '"Source Code Pro",monospace', textColor, statusColor, style, amount, places = -18, logo, label, onButtonClick } = _a, props = __rest(_a, ["fontFamily", "textColor", "statusColor", "style", "amount", "places", "logo", "label", "onButtonClick"]);
29
29
  const adjustedAmount = amount ? base10Shift(amount, places).toNumber() : undefined;
30
30
  const amountString = adjustedAmount ? Math.trunc(adjustedAmount).toLocaleString() : '-';
31
- const fontFamily = '"Source Code Pro",monospace';
32
- 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));
31
+ return (_jsx(ButtonEx, Object.assign({ style: Object.assign({ backgroundColor: statusColor }, 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));
33
32
  };
34
33
  export { TokenAmount };
35
34
  //# sourceMappingURL=TokenAmount.js.map
@@ -1 +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"}
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,EAWhD,EAAE,EAAE;QAX4C,EAC/C,UAAU,GAAG,6BAA6B,EAC1C,SAAS,EACT,WAAW,EACX,KAAK,EACL,MAAM,EACN,MAAM,GAAG,CAAC,EAAE,EACZ,IAAI,EACJ,KAAK,EACL,aAAa,OAEd,EADI,KAAK,cAVuC,yGAWhD,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,WAAW,IAAK,KAAK,GAAI,OAAO,EAAC,UAAU,EAAC,OAAO,EAAE,aAAa,IAAM,KAAK,cAC/G,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"}
@@ -3,8 +3,9 @@ import { ComponentMeta, ComponentStory } from '@storybook/react';
3
3
  declare const StorybookEntry: ComponentMeta<import("react").FC<import("./TokenAmountProps").TokenAmountProps>>;
4
4
  declare const Default: ComponentStory<import("react").FC<import("./TokenAmountProps").TokenAmountProps>>;
5
5
  declare const WithLogo: ComponentStory<import("react").FC<import("./TokenAmountProps").TokenAmountProps>>;
6
+ declare const WithLogoAndColor: ComponentStory<import("react").FC<import("./TokenAmountProps").TokenAmountProps>>;
6
7
  declare const WithLabel: ComponentStory<import("react").FC<import("./TokenAmountProps").TokenAmountProps>>;
7
8
  declare const WithLogoAndLabel: ComponentStory<import("react").FC<import("./TokenAmountProps").TokenAmountProps>>;
8
- export { Default, WithLabel, WithLogo, WithLogoAndLabel };
9
+ export { Default, WithLabel, WithLogo, WithLogoAndColor, WithLogoAndLabel };
9
10
  export default StorybookEntry;
10
11
  //# sourceMappingURL=TokenAmount.stories.d.ts.map
@@ -1 +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"}
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,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"}
@@ -21,6 +21,12 @@ WithLogo.args = {
21
21
  amount: new BigNumber('1195c751dbcc90ab4200000', 16),
22
22
  logo: true,
23
23
  };
24
+ const WithLogoAndColor = Template.bind({});
25
+ WithLogoAndColor.args = {
26
+ amount: new BigNumber('1195c751dbcc90ab4200000', 16),
27
+ logo: true,
28
+ statusColor: '#ff0',
29
+ };
24
30
  const WithLabel = Template.bind({});
25
31
  WithLabel.args = {
26
32
  amount: new BigNumber('1195c751dbcc90ab4200000', 16),
@@ -32,7 +38,7 @@ WithLogoAndLabel.args = {
32
38
  label: 'Balance',
33
39
  logo: true,
34
40
  };
35
- export { Default, WithLabel, WithLogo, WithLogoAndLabel };
41
+ export { Default, WithLabel, WithLogo, WithLogoAndColor, WithLogoAndLabel };
36
42
  // eslint-disable-next-line import/no-default-export
37
43
  export default StorybookEntry;
38
44
  //# sourceMappingURL=TokenAmount.stories.js.map
@@ -1 +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"}
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,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,IAAI,EAAE,IAAI;IACV,WAAW,EAAE,MAAM;CACpB,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"}
@@ -1,12 +1,15 @@
1
1
  /// <reference types="bn.js" />
2
2
  import { BigNumber } from '@xylabs/sdk-js';
3
3
  import { MouseEventHandler } from 'react';
4
- import { FlexBoxProps } from '../FlexBox';
5
- interface TokenAmountProps extends FlexBoxProps {
4
+ import { ButtonExProps } from '../ButtonEx';
5
+ interface TokenAmountProps extends ButtonExProps {
6
6
  amount?: BigNumber | null;
7
7
  label?: string;
8
8
  logo?: boolean;
9
9
  places?: number;
10
+ fontFamily?: string;
11
+ textColor?: string;
12
+ statusColor?: string;
10
13
  onButtonClick?: MouseEventHandler<HTMLButtonElement>;
11
14
  }
12
15
  export type { TokenAmountProps };
@@ -1 +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"}
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,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,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,aAAa,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAA;CACrD;AAED,YAAY,EAAE,gBAAgB,EAAE,CAAA"}
package/package.json CHANGED
@@ -108,5 +108,5 @@
108
108
  "sideEffects": false,
109
109
  "type": "module",
110
110
  "types": "dist/index.d.ts",
111
- "version": "2.7.9"
111
+ "version": "2.7.13"
112
112
  }
@@ -50,7 +50,7 @@ const EthAccount: React.FC<EthAccountProps> = ({
50
50
  return (
51
51
  <ButtonEx onClick={onClickLocal} title={`0x${address?.toHex()}`} {...props}>
52
52
  <FlexGrowRow justifyContent="space-between" alignItems="center">
53
- {icon ? <Identicon size={iconSize} value={address?.toHex()} /> : null}
53
+ {icon && address ? <Identicon size={iconSize} value={address?.toHex()} /> : null}
54
54
  {iconOnly ? null : (
55
55
  <FlexRow>
56
56
  <Typography
@@ -1,23 +1,25 @@
1
1
  import md5 from 'md5'
2
2
  import React, { useEffect, useRef } from 'react'
3
3
 
4
+ import { FlexBoxProps, FlexRow } from './FlexBox'
5
+
4
6
  const range = (n: number, in_min: number, in_max: number, out_min: number, out_max: number) => {
5
7
  return ((n - in_min) * (out_max - out_min)) / (in_max - in_min) + out_min
6
8
  }
7
9
 
8
- interface IdenticonProps {
10
+ interface IdenticonProps extends FlexBoxProps {
9
11
  bg?: string
10
12
  className?: string
11
13
  count?: number
12
14
  fg?: string
13
- padding?: number
15
+ iconPadding?: number
14
16
  palette?: string[]
15
17
  size?: number
16
18
  value?: string
17
19
  }
18
20
 
19
21
  const updateCanvas = (canvas: React.RefObject<HTMLCanvasElement>, props: IdenticonProps) => {
20
- const { value = '', size = 400, bg = 'transparent', count = 5, palette, padding = 0 } = props
22
+ const { value = '', size = 400, bg = 'transparent', count = 5, palette, iconPadding = 0 } = props
21
23
  let { fg } = props
22
24
  const hash = md5(value)
23
25
  const block = Math.floor(size / count)
@@ -34,9 +36,8 @@ const updateCanvas = (canvas: React.RefObject<HTMLCanvasElement>, props: Identic
34
36
  fg = palette[index]
35
37
  }
36
38
 
37
- const pad = padding
38
- current.width = block * count + pad
39
- current.height = block * count + pad
39
+ current.width = block * count + iconPadding
40
+ current.height = block * count + iconPadding
40
41
  const arr = hash.split('').map((el) => {
41
42
  const parsedEl = parseInt(el, 16)
42
43
  if (parsedEl < 8) {
@@ -61,26 +62,38 @@ const updateCanvas = (canvas: React.RefObject<HTMLCanvasElement>, props: Identic
61
62
  row.forEach((el, j) => {
62
63
  if (el) {
63
64
  ctx.fillStyle = fg ? fg : '#' + hashcolor
64
- ctx.fillRect(block * i + pad, block * j + pad, block - pad, block - pad)
65
+ ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)
65
66
  } else {
66
67
  ctx.fillStyle = bg
67
- ctx.fillRect(block * i + pad, block * j + pad, block - pad, block - pad)
68
+ ctx.fillRect(block * i + iconPadding, block * j + iconPadding, block - iconPadding, block - iconPadding)
68
69
  }
69
70
  })
70
71
  })
71
72
  }
72
73
  }
73
74
 
74
- const Identicon: React.FC<IdenticonProps> = (props) => {
75
- const { size = 400, className = 'identicon' } = props
76
-
75
+ const Identicon: React.FC<IdenticonProps> = ({
76
+ size = 400,
77
+ className = 'identicon',
78
+ bg,
79
+ count,
80
+ fg,
81
+ iconPadding,
82
+ palette,
83
+ value,
84
+ ...props
85
+ }) => {
77
86
  const canvas = useRef<HTMLCanvasElement>(null)
78
87
 
79
88
  useEffect(() => {
80
- updateCanvas(canvas, props)
89
+ updateCanvas(canvas, { bg, className, count, fg, iconPadding, palette, size, value })
81
90
  })
82
91
 
83
- return <canvas className={className} ref={canvas} style={{ height: size, width: size }} />
92
+ return (
93
+ <FlexRow {...props}>
94
+ <canvas className={className} ref={canvas} style={{ height: size, width: size }} />
95
+ </FlexRow>
96
+ )
84
97
  }
85
98
 
86
99
  export { Identicon }
@@ -27,6 +27,13 @@ WithLogo.args = {
27
27
  logo: true,
28
28
  }
29
29
 
30
+ const WithLogoAndColor = Template.bind({})
31
+ WithLogoAndColor.args = {
32
+ amount: new BigNumber('1195c751dbcc90ab4200000', 16),
33
+ logo: true,
34
+ statusColor: '#ff0',
35
+ }
36
+
30
37
  const WithLabel = Template.bind({})
31
38
  WithLabel.args = {
32
39
  amount: new BigNumber('1195c751dbcc90ab4200000', 16),
@@ -40,7 +47,7 @@ WithLogoAndLabel.args = {
40
47
  logo: true,
41
48
  }
42
49
 
43
- export { Default, WithLabel, WithLogo, WithLogoAndLabel }
50
+ export { Default, WithLabel, WithLogo, WithLogoAndColor, WithLogoAndLabel }
44
51
 
45
52
  // eslint-disable-next-line import/no-default-export
46
53
  export default StorybookEntry
@@ -15,37 +15,50 @@ const base10Shift = (bn: BigNumber, places: number) => {
15
15
  }
16
16
  }
17
17
 
18
- const TokenAmount: React.FC<TokenAmountProps> = ({ amount, places = -18, logo, label, onButtonClick, ...props }) => {
18
+ const TokenAmount: React.FC<TokenAmountProps> = ({
19
+ fontFamily = '"Source Code Pro",monospace',
20
+ textColor,
21
+ statusColor,
22
+ style,
23
+ amount,
24
+ places = -18,
25
+ logo,
26
+ label,
27
+ onButtonClick,
28
+ ...props
29
+ }) => {
19
30
  const adjustedAmount = amount ? base10Shift(amount, places).toNumber() : undefined
20
31
 
21
32
  const amountString = adjustedAmount ? Math.trunc(adjustedAmount).toLocaleString() : '-'
22
33
 
23
- const fontFamily = '"Source Code Pro",monospace'
24
-
25
34
  return (
26
- <FlexRow margin={0.5} padding={0.5} {...props}>
27
- <ButtonEx fullWidth variant="outlined" onClick={onButtonClick}>
28
- <FlexRow justifyContent="space-between" width="100%" busy={!amount} busySize={16}>
29
- <FlexRow>
30
- {logo ? <img src={xyoLogo} height={24} /> : null}
31
- {label ? (
32
- <Typography
33
- marginRight={1}
34
- marginLeft={logo ? 1 : 0}
35
- noWrap={true}
36
- fontFamily={fontFamily}
37
- variant="caption"
38
- >
39
- {label}
40
- </Typography>
41
- ) : null}
42
- </FlexRow>
43
- <Typography noWrap={true} fontFamily={fontFamily} variant="body1" style={{ textTransform: 'none' }}>
44
- {amountString}
45
- </Typography>
35
+ <ButtonEx style={{ backgroundColor: statusColor, ...style }} variant="outlined" onClick={onButtonClick} {...props}>
36
+ <FlexRow justifyContent="space-between" width="100%" busy={!amount} busySize={16}>
37
+ <FlexRow>
38
+ {logo ? <img src={xyoLogo} height={24} /> : null}
39
+ {label ? (
40
+ <Typography
41
+ marginRight={1}
42
+ marginLeft={logo ? 1 : 0}
43
+ noWrap={true}
44
+ fontFamily={fontFamily}
45
+ variant="caption"
46
+ >
47
+ {label}
48
+ </Typography>
49
+ ) : null}
46
50
  </FlexRow>
47
- </ButtonEx>
48
- </FlexRow>
51
+ <Typography
52
+ color={textColor}
53
+ noWrap={true}
54
+ fontFamily={fontFamily}
55
+ variant="body1"
56
+ style={{ textTransform: 'none' }}
57
+ >
58
+ {amountString}
59
+ </Typography>
60
+ </FlexRow>
61
+ </ButtonEx>
49
62
  )
50
63
  }
51
64
 
@@ -1,13 +1,16 @@
1
1
  import { BigNumber } from '@xylabs/sdk-js'
2
2
  import { MouseEventHandler } from 'react'
3
3
 
4
- import { FlexBoxProps } from '../FlexBox'
4
+ import { ButtonExProps } from '../ButtonEx'
5
5
 
6
- interface TokenAmountProps extends FlexBoxProps {
6
+ interface TokenAmountProps extends ButtonExProps {
7
7
  amount?: BigNumber | null
8
8
  label?: string
9
9
  logo?: boolean
10
10
  places?: number
11
+ fontFamily?: string
12
+ textColor?: string
13
+ statusColor?: string
11
14
  onButtonClick?: MouseEventHandler<HTMLButtonElement>
12
15
  }
13
16