@thecb/components 10.4.6-beta.7 → 10.4.6-beta.8
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.
- package/dist/index.cjs.js +24 -12
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.js +24 -12
- package/dist/index.esm.js.map +1 -1
- package/package.json +1 -1
- package/src/components/atoms/.DS_Store +0 -0
- package/src/components/atoms/icons/.DS_Store +0 -0
- package/src/components/atoms/icons/IconAdd.js +9 -3
- package/src/components/atoms/icons/IconQuitLarge.js +0 -1
- package/src/components/atoms/placeholder/Placeholder.js +5 -5
- package/src/components/atoms/placeholder/Placeholder.stories.js +2 -1
- package/src/components/atoms/wallet-name/WalletName.theme.js +2 -1
- package/src/components/molecules/toast-notification/ToastNotification.js +16 -12
- package/src/components/molecules/toast-notification/ToastNotification.stories.js +38 -0
- package/src/hooks/use-toast-notification/index.js +1 -1
- package/dist/src/apps/checkout/pages/payment/sub-pages/payment-amount/PaymentAmount_old.js +0 -49322
- package/src/.DS_Store +0 -0
- package/src/components/.DS_Store +0 -0
package/dist/index.cjs.js
CHANGED
|
@@ -14131,7 +14131,9 @@ var GenericErrorIcon = function GenericErrorIcon() {
|
|
|
14131
14131
|
}));
|
|
14132
14132
|
};
|
|
14133
14133
|
|
|
14134
|
-
var IconAdd = function IconAdd() {
|
|
14134
|
+
var IconAdd = function IconAdd(_ref) {
|
|
14135
|
+
var _ref$strokeWidth = _ref.strokeWidth,
|
|
14136
|
+
strokeWidth = _ref$strokeWidth === void 0 ? 1 : _ref$strokeWidth;
|
|
14135
14137
|
return /*#__PURE__*/React__default.createElement("svg", {
|
|
14136
14138
|
xmlns: "http://www.w3.org/2000/svg",
|
|
14137
14139
|
xmlnsXlink: "http://www.w3.org/1999/xlink",
|
|
@@ -14146,7 +14148,7 @@ var IconAdd = function IconAdd() {
|
|
|
14146
14148
|
fill: "none",
|
|
14147
14149
|
fillRule: "evenodd",
|
|
14148
14150
|
stroke: "none",
|
|
14149
|
-
strokeWidth:
|
|
14151
|
+
strokeWidth: strokeWidth
|
|
14150
14152
|
}, /*#__PURE__*/React__default.createElement("g", {
|
|
14151
14153
|
transform: "translate(-407 -563)"
|
|
14152
14154
|
}, /*#__PURE__*/React__default.createElement("g", {
|
|
@@ -14164,6 +14166,7 @@ var IconAdd = function IconAdd() {
|
|
|
14164
14166
|
xlinkHref: "#path-1"
|
|
14165
14167
|
})), /*#__PURE__*/React__default.createElement("circle", {
|
|
14166
14168
|
className: "stroke",
|
|
14169
|
+
strokeWidth: strokeWidth,
|
|
14167
14170
|
cx: "8.155",
|
|
14168
14171
|
cy: "8.072",
|
|
14169
14172
|
r: "8"
|
|
@@ -14180,7 +14183,7 @@ var IconQuitLarge = function IconQuitLarge(_ref) {
|
|
|
14180
14183
|
version: "1.1",
|
|
14181
14184
|
xmlns: "http://www.w3.org/2000/svg",
|
|
14182
14185
|
xmlnsXlink: "http://www.w3.org/1999/xlink"
|
|
14183
|
-
}, /*#__PURE__*/React__default.createElement("
|
|
14186
|
+
}, /*#__PURE__*/React__default.createElement("defs", null, /*#__PURE__*/React__default.createElement("polygon", {
|
|
14184
14187
|
id: "quit-large-path-1",
|
|
14185
14188
|
points: "18.9999989 6.40999946 17.589999 4.9999997 11.9999993 10.5899995 6.40999946 4.9999997 4.9999997 6.40999946 10.5899995 11.9999993 4.9999997 17.589999 6.40999946 18.9999989 11.9999993 13.409999 17.589999 18.9999989 18.9999989 17.589999 13.409999 11.9999993"
|
|
14186
14189
|
})), /*#__PURE__*/React__default.createElement("g", {
|
|
@@ -25994,7 +25997,7 @@ var useToastNotification = function useToastNotification() {
|
|
|
25994
25997
|
toastState = _useState2[0],
|
|
25995
25998
|
setToastState = _useState2[1];
|
|
25996
25999
|
React.useEffect(function () {
|
|
25997
|
-
if (toastState.isOpen) {
|
|
26000
|
+
if (toastState.isOpen && timeout > 0) {
|
|
25998
26001
|
setTimeout(function () {
|
|
25999
26002
|
setToastState(initialToastState);
|
|
26000
26003
|
}, timeout);
|
|
@@ -27836,13 +27839,13 @@ var Placeholder = function Placeholder(_ref2) {
|
|
|
27836
27839
|
childGap: "0"
|
|
27837
27840
|
}, variant === "large" && /*#__PURE__*/React__default.createElement("div", null), /*#__PURE__*/React__default.createElement(Box, {
|
|
27838
27841
|
padding: "0",
|
|
27839
|
-
extraStyles: ".fill { \n fill: ".concat(variant === "large" ? CHARADE_GREY : themeValues.color, "; \n } .stroke { \n stroke: ").concat(variant === "large" ? CHARADE_GREY : themeValues.color, "; \n }")
|
|
27842
|
+
extraStyles: ".fill { \n fill: ".concat(variant === "large" ? CHARADE_GREY : themeValues.color, "; \n } .stroke { \n stroke: ").concat(variant === "large" ? CHARADE_GREY : themeValues.color, "; \n } ")
|
|
27840
27843
|
}, variant === "large" ? /*#__PURE__*/React__default.createElement(Center, {
|
|
27841
27844
|
intrinsic: true
|
|
27842
27845
|
}, getLargeIcon(largeIcon), /*#__PURE__*/React__default.createElement(Text$1, {
|
|
27843
27846
|
variant: "pS",
|
|
27844
27847
|
color: themeValues.color,
|
|
27845
|
-
weight:
|
|
27848
|
+
weight: FONT_WEIGHT_SEMIBOLD,
|
|
27846
27849
|
extraStyles: "text-align: center;"
|
|
27847
27850
|
}, text)) : /*#__PURE__*/React__default.createElement(Cover, {
|
|
27848
27851
|
singleChild: true,
|
|
@@ -27850,12 +27853,14 @@ var Placeholder = function Placeholder(_ref2) {
|
|
|
27850
27853
|
}, /*#__PURE__*/React__default.createElement(Cluster, {
|
|
27851
27854
|
justify: "center",
|
|
27852
27855
|
align: "center"
|
|
27853
|
-
}, /*#__PURE__*/React__default.createElement(IconAdd,
|
|
27856
|
+
}, /*#__PURE__*/React__default.createElement(IconAdd, {
|
|
27857
|
+
strokeWidth: "2"
|
|
27858
|
+
}), /*#__PURE__*/React__default.createElement(Center, {
|
|
27854
27859
|
intrinsic: true
|
|
27855
27860
|
}, /*#__PURE__*/React__default.createElement(Text$1, {
|
|
27856
27861
|
variant: "pS",
|
|
27857
27862
|
color: themeValues.color,
|
|
27858
|
-
weight:
|
|
27863
|
+
weight: FONT_WEIGHT_SEMIBOLD,
|
|
27859
27864
|
extraStyles: "padding: 0 0 0 8px; text-align: center;"
|
|
27860
27865
|
}, text)))))))))));
|
|
27861
27866
|
};
|
|
@@ -39236,7 +39241,7 @@ var backgroundColor$6 = {
|
|
|
39236
39241
|
primary: WHITE
|
|
39237
39242
|
};
|
|
39238
39243
|
var boxShadow$1 = {
|
|
39239
|
-
primary: "box-shadow: 0px 1px 2px 0px #292A331A;\n box-shadow: 0px 2px 6px 0px #292a3333; box-shadow: 0px 1px 0px 0px #292A331A inset;"
|
|
39244
|
+
primary: "box-shadow: 0px 1px 2px 0px #292A331A;\n box-shadow: 0px 2px 6px 0px #292a3333; \n box-shadow: 0px -1px 0px 0px #292A331A inset;"
|
|
39240
39245
|
};
|
|
39241
39246
|
var fallbackValues$C = {
|
|
39242
39247
|
backgroundColor: backgroundColor$6,
|
|
@@ -49974,7 +49979,9 @@ var ToastNotification = function ToastNotification(_ref) {
|
|
|
49974
49979
|
height = _ref$height === void 0 ? "56px" : _ref$height,
|
|
49975
49980
|
_ref$childGap = _ref.childGap,
|
|
49976
49981
|
childGap = _ref$childGap === void 0 ? "1rem" : _ref$childGap,
|
|
49977
|
-
backgroundColor = _ref.backgroundColor
|
|
49982
|
+
backgroundColor = _ref.backgroundColor,
|
|
49983
|
+
_ref$role = _ref.role,
|
|
49984
|
+
role = _ref$role === void 0 ? "alert" : _ref$role;
|
|
49978
49985
|
return /*#__PURE__*/React__default.createElement(Box, {
|
|
49979
49986
|
onClick: closeToastNotification,
|
|
49980
49987
|
background: backgroundColor ? backgroundColor : variant === VARIANTS.SUCCESS ? HINT_GREEN : variant === VARIANTS.ERROR ? ERROR_BACKGROUND_COLOR : WHITE,
|
|
@@ -49985,7 +49992,12 @@ var ToastNotification = function ToastNotification(_ref) {
|
|
|
49985
49992
|
padding: "0rem 1rem",
|
|
49986
49993
|
borderRadius: "4px",
|
|
49987
49994
|
boxShadow: generateShadows().standard.base,
|
|
49988
|
-
extraStyles: "\n display: ".concat(toastOpen ? "block" : "none", ";\n position: fixed; bottom: 4rem; left: 4rem;\n ").concat(extraStyles, ";\n cursor: pointer;\n ")
|
|
49995
|
+
extraStyles: "\n display: ".concat(toastOpen ? "block" : "none", ";\n position: fixed; bottom: 4rem; left: 4rem;\n ").concat(extraStyles, ";\n cursor: pointer;\n "),
|
|
49996
|
+
role: role
|
|
49997
|
+
}, /*#__PURE__*/React__default.createElement(Cluster, {
|
|
49998
|
+
align: "center",
|
|
49999
|
+
childGap: childGap,
|
|
50000
|
+
justify: "space-between"
|
|
49989
50001
|
}, /*#__PURE__*/React__default.createElement(Cluster, {
|
|
49990
50002
|
align: "center",
|
|
49991
50003
|
childGap: childGap
|
|
@@ -49995,7 +50007,7 @@ var ToastNotification = function ToastNotification(_ref) {
|
|
|
49995
50007
|
}, /*#__PURE__*/React__default.createElement(Paragraph$1, {
|
|
49996
50008
|
weight: FONT_WEIGHT_SEMIBOLD,
|
|
49997
50009
|
extraStyles: "word-break: break-word;"
|
|
49998
|
-
}, message)), /*#__PURE__*/React__default.createElement(IconQuitLarge, null)));
|
|
50010
|
+
}, message))), /*#__PURE__*/React__default.createElement(IconQuitLarge, null)));
|
|
49999
50011
|
};
|
|
50000
50012
|
|
|
50001
50013
|
var fontWeight$9 = "600";
|