@kaio-xyz/design-system 1.1.136 → 1.1.138

package/dist/index.cjs.js

@@ -136,8 +136,8 @@ var _path$f;
 function _extends$g() { return _extends$g = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$g.apply(null, arguments); }
 var SvgCheck = function SvgCheck(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$g({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$f || (_path$f = /*#__PURE__*/React__namespace.createElement("path", {
@@ -150,8 +150,8 @@ var _path$e;
 function _extends$f() { return _extends$f = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$f.apply(null, arguments); }
 var SvgCircleDashed = function SvgCircleDashed(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$f({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$e || (_path$e = /*#__PURE__*/React__namespace.createElement("path", {
@@ -164,8 +164,8 @@ var _path$d;
 function _extends$e() { return _extends$e = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$e.apply(null, arguments); }
 var SvgCross = function SvgCross(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$e({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$d || (_path$d = /*#__PURE__*/React__namespace.createElement("path", {
@@ -178,8 +178,8 @@ var _path$c;
 function _extends$d() { return _extends$d = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$d.apply(null, arguments); }
 var SvgDeny = function SvgDeny(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$d({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$c || (_path$c = /*#__PURE__*/React__namespace.createElement("path", {
@@ -192,8 +192,8 @@ var _path$b, _path2$4, _path3$2;
 function _extends$c() { return _extends$c = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$c.apply(null, arguments); }
 var SvgInfo = function SvgInfo(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$c({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$b || (_path$b = /*#__PURE__*/React__namespace.createElement("path", {
@@ -212,8 +212,8 @@ var _path$a;
 function _extends$b() { return _extends$b = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$b.apply(null, arguments); }
 var SvgLoader = function SvgLoader(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$b({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$a || (_path$a = /*#__PURE__*/React__namespace.createElement("path", {
@@ -226,8 +226,8 @@ var _path$9;
 function _extends$a() { return _extends$a = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$a.apply(null, arguments); }
 var SvgWarning = function SvgWarning(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$a({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$9 || (_path$9 = /*#__PURE__*/React__namespace.createElement("path", {
@@ -240,8 +240,8 @@ var _path$8, _path2$3, _path3$1, _path4;
 function _extends$9() { return _extends$9 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$9.apply(null, arguments); }
 var SvgEyeClosed = function SvgEyeClosed(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$9({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$8 || (_path$8 = /*#__PURE__*/React__namespace.createElement("path", {
@@ -263,8 +263,8 @@ var _path$7, _path2$2;
 function _extends$8() { return _extends$8 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$8.apply(null, arguments); }
 var SvgEyeOpen = function SvgEyeOpen(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$8({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$7 || (_path$7 = /*#__PURE__*/React__namespace.createElement("path", {
@@ -280,8 +280,8 @@ var _path$6;
 function _extends$7() { return _extends$7 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$7.apply(null, arguments); }
 var SvgChevronGrabber = function SvgChevronGrabber(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$7({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$6 || (_path$6 = /*#__PURE__*/React__namespace.createElement("path", {
@@ -294,8 +294,8 @@ var _path$5;
 function _extends$6() { return _extends$6 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$6.apply(null, arguments); }
 var SvgMinus = function SvgMinus(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$6({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$5 || (_path$5 = /*#__PURE__*/React__namespace.createElement("path", {
@@ -308,8 +308,8 @@ var _path$4;
 function _extends$5() { return _extends$5 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$5.apply(null, arguments); }
 var SvgClipboard = function SvgClipboard(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$5({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$4 || (_path$4 = /*#__PURE__*/React__namespace.createElement("path", {
@@ -322,8 +322,8 @@ var _path$3, _path2$1;
 function _extends$4() { return _extends$4 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$4.apply(null, arguments); }
 var SvgLoadingCircle = function SvgLoadingCircle(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$4({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$3 || (_path$3 = /*#__PURE__*/React__namespace.createElement("path", {
@@ -340,8 +340,8 @@ var _path$2;
 function _extends$3() { return _extends$3 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$3.apply(null, arguments); }
 var SvgArrowDownRight = function SvgArrowDownRight(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$3({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$2 || (_path$2 = /*#__PURE__*/React__namespace.createElement("path", {
@@ -354,8 +354,8 @@ var _path$1;
 function _extends$2() { return _extends$2 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$2.apply(null, arguments); }
 var SvgArrowUpRight = function SvgArrowUpRight(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$2({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path$1 || (_path$1 = /*#__PURE__*/React__namespace.createElement("path", {
@@ -368,8 +368,8 @@ var _path, _path2, _path3;
 function _extends$1() { return _extends$1 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$1.apply(null, arguments); }
 var SvgLock = function SvgLock(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends$1({
-    width: "1em",
-    height: "1em",
+    width: 24,
+    height: 24,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
@@ -388,8 +388,8 @@ var _g;
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 var SvgLoginLogo = function SvgLoginLogo(props) {
   return /*#__PURE__*/React__namespace.createElement("svg", _extends({
-    width: "1em",
-    height: "1em",
+    width: 444,
+    height: 499,
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg"
   }, props), _g || (_g = /*#__PURE__*/React__namespace.createElement("g", {
@@ -460,14 +460,14 @@ var SpinnedIcon = function (_a) {
             width: size,
             height: size,
             animationDuration: "".concat(duration, "s"),
-        }, children: jsxRuntime.jsx(Icon, __assign({ width: size, height: size, viewBox: "0 0 24 24" }, rest)) }));
+        }, children: jsxRuntime.jsx(Icon, __assign({ width: size, height: size }, rest)) }));
 };
 
 var isAnchor = function (props) { return props.href !== undefined; };
 var Button = React.forwardRef(function (_a, ref) {
     var _b = _a.fullWidth, fullWidth = _b === void 0 ? false : _b, _c = _a.variant, variant = _c === void 0 ? "primary" : _c, _d = _a.size, size = _d === void 0 ? "normal" : _d, _e = _a.isInverted, isInverted = _e === void 0 ? false : _e, _f = _a.isLoading, isLoading = _f === void 0 ? false : _f, _g = _a.iconSize, iconSize = _g === void 0 ? 22 : _g, Icon = _a.icon, _h = _a.iconPosition, iconPosition = _h === void 0 ? "left" : _h, props = __rest(_a, ["fullWidth", "variant", "size", "isInverted", "isLoading", "iconSize", "icon", "iconPosition"]);
     var iconProps = { width: iconSize, height: iconSize, "aria-hidden": "true" };
-    var baseIcon = Icon && jsxRuntime.jsx(Icon, __assign({}, iconProps, { viewBox: "0 0 24 24" }));
+    var baseIcon = Icon && jsxRuntime.jsx(Icon, __assign({}, iconProps));
     var loadingIcon = isLoading && jsxRuntime.jsx(SpinnedIcon, __assign({ size: iconSize }, iconProps));
     var iconChild = loadingIcon || baseIcon || null;
     var classes = clsx(style$v.root, props.className);
@@ -666,7 +666,7 @@ var Clipboard = function (_a) {
         }, 2000);
     }, [value]);
     var text = isShowingCopy ? 'Copied!' : displayValue;
-    var icon = isShowingCopy ? jsxRuntime.jsx(SvgCheck, { viewBox: "0 0 24 24" }) : jsxRuntime.jsx(SvgClipboard, { viewBox: "0 0 24 24" });
+    var icon = isShowingCopy ? jsxRuntime.jsx(SvgCheck, {}) : jsxRuntime.jsx(SvgClipboard, {});
     return (jsxRuntime.jsx("button", { type: "button", onClick: handleClick, className: style$l.root, "data-is-copied": isCopied, "data-is-showing-copy": isShowingCopy, "data-test": dataTest, children: jsxRuntime.jsxs(Stack, { position: "horizontal", children: [jsxRuntime.jsx("span", { children: text }), icon] }) }));
 };
 
@@ -683,7 +683,7 @@ var Step = function (_a) {
     var label = _a.label, dataTest = _a.dataTest, className = _a.className, _b = _a.iconSize, iconSize = _b === void 0 ? 16 : _b, _c = _a.isCompleted, isCompleted = _c === void 0 ? false : _c, _d = _a.isCurrent, isCurrent = _d === void 0 ? false : _d, _e = _a.direction, direction = _e === void 0 ? 'vertical' : _e, props = __rest(_a, ["label", "dataTest", "className", "iconSize", "isCompleted", "isCurrent", "direction"]);
     var icon = React.useMemo(function () {
         switch (true) {
-            case isCompleted: return jsxRuntime.jsx(SvgCheck, { className: style$j.checkIcon, viewBox: "0 0 24 24" });
+            case isCompleted: return jsxRuntime.jsx(SvgCheck, { className: style$j.checkIcon });
             case isCurrent: return jsxRuntime.jsx(SpinnedIcon, { icon: SvgLoadingCircle, size: iconSize, className: style$j.loadingIcon });
             default: return jsxRuntime.jsx("span", { className: style$j.emptyIcon });
         }
@@ -776,7 +776,7 @@ var style$c = {"content":"dropdown-menu-module__content__sSYNC","arrow":"dropdow
 
 var DropdownMenu$1 = function (_a) {
     var text = _a.text, children = _a.children, Icon = _a.icon, disabled = _a.disabled, body = _a.body, variant = _a.variant, buttonSize = _a.buttonSize, rest = __rest(_a, ["text", "children", "icon", "disabled", "body", "variant", "buttonSize"]);
-    var defaultBody = !text ? Icon && jsxRuntime.jsx(Icon, { viewBox: "0 0 24 24" }) : jsxRuntime.jsx(Button, { size: buttonSize, icon: Icon, variant: variant, children: text });
+    var defaultBody = !text ? Icon && jsxRuntime.jsx(Icon, {}) : jsxRuntime.jsx(Button, { size: buttonSize, icon: Icon, variant: variant, children: text });
     return (jsxRuntime.jsxs(RDropdownMenu__namespace.Root, { children: [jsxRuntime.jsx(RDropdownMenu__namespace.Trigger, __assign({}, rest, { asChild: !!text, className: style$c.trigger, disabled: disabled, children: body ? body : defaultBody })), jsxRuntime.jsx(RDropdownMenu__namespace.Portal, { children: jsxRuntime.jsxs(RDropdownMenu__namespace.Content, { className: style$c.content, sideOffset: 5, children: [children, jsxRuntime.jsx(RDropdownMenu__namespace.Arrow, { className: style$c.arrow })] }) })] }));
 };
 
@@ -793,7 +793,7 @@ var style$a = {"trigger":"tooltip-module__trigger__8Eylk","content":"tooltip-mod
 
 var Tooltip = function (_a) {
     var children = _a.children, title = _a.title, description = _a.description, rest = __rest(_a, ["children", "title", "description"]);
-    return (jsxRuntime.jsx(RTooltip__namespace.Provider, { children: jsxRuntime.jsxs(RTooltip__namespace.Root, __assign({}, rest, { children: [jsxRuntime.jsx(RTooltip__namespace.Trigger, { className: style$a.trigger, asChild: true, children: children }), jsxRuntime.jsx(RTooltip__namespace.Portal, { children: jsxRuntime.jsxs(RTooltip__namespace.Content, { className: style$a.content, sideOffset: 2, children: [jsxRuntime.jsx(SvgInfo, { viewBox: "0 0 24 24", className: style$a.icon, width: 20, height: 20 }), jsxRuntime.jsxs("div", { className: style$a.body, children: [jsxRuntime.jsx("span", { className: style$a.title, children: title }), description && jsxRuntime.jsx("span", { className: style$a.description, children: description })] }), jsxRuntime.jsx(RTooltip__namespace.Arrow, { className: style$a.arrow })] }) })] })) }));
+    return (jsxRuntime.jsx(RTooltip__namespace.Provider, { children: jsxRuntime.jsxs(RTooltip__namespace.Root, __assign({}, rest, { children: [jsxRuntime.jsx(RTooltip__namespace.Trigger, { className: style$a.trigger, asChild: true, children: children }), jsxRuntime.jsx(RTooltip__namespace.Portal, { children: jsxRuntime.jsxs(RTooltip__namespace.Content, { className: style$a.content, sideOffset: 2, children: [jsxRuntime.jsx(SvgInfo, { className: style$a.icon, width: 20, height: 20 }), jsxRuntime.jsxs("div", { className: style$a.body, children: [jsxRuntime.jsx("span", { className: style$a.title, children: title }), description && jsxRuntime.jsx("span", { className: style$a.description, children: description })] }), jsxRuntime.jsx(RTooltip__namespace.Arrow, { className: style$a.arrow })] }) })] })) }));
 };
 
 var isEnter = function (e) { return e.key === "Enter"; };
@@ -1118,7 +1118,7 @@ var InvestmentGraph = function (_a) {
                                         ? 'true'
                                         : 'false', onClick: function () {
                                         return setViewMode === null || setViewMode === void 0 ? void 0 : setViewMode(mode);
-                                    }, children: mode === 'total' ? 'Total' : 'By Product' }, mode)); }) }))] })] }), isLocked ? (jsxRuntime.jsx("div", { className: style$9.lockedPlaceholder, children: jsxRuntime.jsx("div", { className: style$9.lockIconCircle, children: jsxRuntime.jsx(SvgLock, { viewBox: "0 0 24 24" }) }) })) : viewMode === 'byProduct' && hasByProductView ? (jsxRuntime.jsx(ByProductChart, { chartData: byProductChartData, data: byProductData, ticks: ticks, timeFrame: timeFrame === null || timeFrame === void 0 ? void 0 : timeFrame.value })) : (jsxRuntime.jsx(TotalChart, { data: totalData, ticks: ticks, timeFrame: timeFrame === null || timeFrame === void 0 ? void 0 : timeFrame.value }))] }));
+                                    }, children: mode === 'total' ? 'Total' : 'By Product' }, mode)); }) }))] })] }), isLocked ? (jsxRuntime.jsx("div", { className: style$9.lockedPlaceholder, children: jsxRuntime.jsx("div", { className: style$9.lockIconCircle, children: jsxRuntime.jsx(SvgLock, {}) }) })) : viewMode === 'byProduct' && hasByProductView ? (jsxRuntime.jsx(ByProductChart, { chartData: byProductChartData, data: byProductData, ticks: ticks, timeFrame: timeFrame === null || timeFrame === void 0 ? void 0 : timeFrame.value })) : (jsxRuntime.jsx(TotalChart, { data: totalData, ticks: ticks, timeFrame: timeFrame === null || timeFrame === void 0 ? void 0 : timeFrame.value }))] }));
 };
 
 var style$8 = {"root":"investments-header-module__root__fxQmk","total":"investments-header-module__total__DrEq0","badge":"investments-header-module__badge__-aeBM"};
@@ -1201,7 +1201,7 @@ var style$6 = {"root":"drawer-module__root__D3rM0","backdrop":"drawer-module__ba
 var Drawer = function (_a) {
     var isOpen = _a.isOpen, title = _a.title, children = _a.children, className = _a.className, actions = _a.actions, onClose = _a.onClose, _b = _a.isLarge, isLarge = _b === void 0 ? false : _b, subTitle = _a.subTitle, rest = __rest(_a, ["isOpen", "title", "children", "className", "actions", "onClose", "isLarge", "subTitle"]);
     var canAnimate = useCanAnimate();
-    var drawerContent = (jsxRuntime.jsxs("div", { className: clsx(style$6.root, className), "data-is-open": isOpen, "data-can-animate": canAnimate, children: [jsxRuntime.jsx("button", { className: style$6.backdrop, tabIndex: 0, onClick: onClose, onKeyDown: function (e) { return (isEnter(e) ? onClose === null || onClose === void 0 ? void 0 : onClose() : null); } }), jsxRuntime.jsxs("div", __assign({ className: style$6.drawer, "data-is-large": isLarge }, rest, { children: [jsxRuntime.jsxs("div", { className: style$6.header, children: [jsxRuntime.jsxs(Stack, { children: [jsxRuntime.jsx("h2", { className: style$6.title, children: title }), subTitle && jsxRuntime.jsx("p", { className: style$6.subTitle, children: subTitle })] }), jsxRuntime.jsx("button", { onClick: onClose, className: style$6.closeButton, type: "button", disabled: !onClose, children: jsxRuntime.jsx(SvgCross, { viewBox: "0 0 24 24" }) })] }), jsxRuntime.jsxs("div", { className: style$6.body, children: [jsxRuntime.jsx("div", { className: style$6.content, children: isOpen ? children : null }), actions && jsxRuntime.jsx("div", { className: style$6.actions, children: actions })] })] }))] }));
+    var drawerContent = (jsxRuntime.jsxs("div", { className: clsx(style$6.root, className), "data-is-open": isOpen, "data-can-animate": canAnimate, children: [jsxRuntime.jsx("button", { className: style$6.backdrop, tabIndex: 0, onClick: onClose, onKeyDown: function (e) { return (isEnter(e) ? onClose === null || onClose === void 0 ? void 0 : onClose() : null); } }), jsxRuntime.jsxs("div", __assign({ className: style$6.drawer, "data-is-large": isLarge }, rest, { children: [jsxRuntime.jsxs("div", { className: style$6.header, children: [jsxRuntime.jsxs(Stack, { children: [jsxRuntime.jsx("h2", { className: style$6.title, children: title }), subTitle && jsxRuntime.jsx("p", { className: style$6.subTitle, children: subTitle })] }), jsxRuntime.jsx("button", { onClick: onClose, className: style$6.closeButton, type: "button", disabled: !onClose, children: jsxRuntime.jsx(SvgCross, {}) })] }), jsxRuntime.jsxs("div", { className: style$6.body, children: [jsxRuntime.jsx("div", { className: style$6.content, children: isOpen ? children : null }), actions && jsxRuntime.jsx("div", { className: style$6.actions, children: actions })] })] }))] }));
     return reactDom.createPortal(drawerContent, document.body);
 };
 
@@ -1211,11 +1211,11 @@ var Alert = function (_a) {
     var title = _a.title, _b = _a.type, type = _b === void 0 ? "info" : _b, children = _a.children, buttonText = _a.buttonText, dataTest = _a.dataTest, onClick = _a.onClick, rest = __rest(_a, ["title", "type", "children", "buttonText", "dataTest", "onClick"]);
     var icon = React.useMemo(function () {
         switch (type) {
-            case "success": return jsxRuntime.jsx(SvgCheck, { viewBox: "0 0 24 24" });
+            case "success": return jsxRuntime.jsx(SvgCheck, {});
             case "warning":
-            case "danger": return jsxRuntime.jsx(SvgWarning, { viewBox: "0 0 24 24" });
-            case "info": return jsxRuntime.jsx(SvgInfo, { viewBox: "0 0 24 24" });
-            default: return jsxRuntime.jsx(SvgLoader, { viewBox: "0 0 24 24" });
+            case "danger": return jsxRuntime.jsx(SvgWarning, {});
+            case "info": return jsxRuntime.jsx(SvgInfo, {});
+            default: return jsxRuntime.jsx(SvgLoader, {});
         }
     }, [type]);
     return (jsxRuntime.jsxs(Stack, __assign({ className: style$5.root, position: children ? "vertical" : "horizontal-space", space: "m", "data-type": type, "data-test": dataTest }, rest, { children: [jsxRuntime.jsxs(Stack, { position: "horizontal", children: [icon, title] }), jsxRuntime.jsx("p", { children: children }), buttonText && (jsxRuntime.jsx(Button, { className: style$5.button, variant: type, onClick: onClick, isInverted: true, size: "small", children: buttonText }))] })));
@@ -1225,7 +1225,7 @@ var style$4 = {"root":"box-module__root__dZ-MR","icon":"box-module__icon__3dFXL"
 
 var Box = function (_a) {
     var title = _a.title, description = _a.description, Icon = _a.icon, iconType = _a.iconType, fullWidth = _a.fullWidth;
-    return (jsxRuntime.jsxs(Stack, { className: style$4.root, "data-is-full-width": fullWidth, as: "dl", children: [jsxRuntime.jsx("dt", { children: title }), jsxRuntime.jsxs("dd", { children: [description, Icon && jsxRuntime.jsx(Icon, { className: style$4.icon, "data-icon-type": iconType, viewBox: "0 0 24 24" })] })] }));
+    return (jsxRuntime.jsxs(Stack, { className: style$4.root, "data-is-full-width": fullWidth, as: "dl", children: [jsxRuntime.jsx("dt", { children: title }), jsxRuntime.jsxs("dd", { children: [description, Icon && jsxRuntime.jsx(Icon, { className: style$4.icon, "data-icon-type": iconType })] })] }));
 };
 
 var style$3 = {"list":"tabs-module__list__Nuvl-","trigger":"tabs-module__trigger__qOk2r","content":"tabs-module__content__4w1tZ","counter":"tabs-module__counter__QkcJB"};
@@ -1719,7 +1719,7 @@ var LoginCredentials = function (_a) {
 var style = {"buttonRow":"login-module__buttonRow__4LBxx"};
 
 var Login = function (_a) {
-    var signupRequestRoute = _a.signupRequestRoute, forgotPasswordRoute = _a.forgotPasswordRoute, loginFn = _a.loginFn, mfaLoginFn = _a.mfaLoginFn, onSignIn = _a.onSignIn, onVerifyAccountRedirect = _a.onVerifyAccountRedirect, onError = _a.onError, logo = _a.logo, backgroundIcon = _a.backgroundIcon, footer = _a.footer;
+    var signupRequestRoute = _a.signupRequestRoute, forgotPasswordRoute = _a.forgotPasswordRoute, loginFn = _a.loginFn, mfaLoginFn = _a.mfaLoginFn, onSignIn = _a.onSignIn, onVerifyAccountRedirect = _a.onVerifyAccountRedirect, onError = _a.onError, logo = _a.logo, header = _a.header, backgroundIcon = _a.backgroundIcon, footer = _a.footer;
     var _b = reactHookForm.useForm({ mode: "onChange" }), formState = _b.formState, control = _b.control, register = _b.register, handleSubmit = _b.handleSubmit, resetField = _b.resetField;
     var isValid = formState.isValid, errors = formState.errors;
     var email = reactHookForm.useWatch({ control: control, name: "email" });
@@ -1746,7 +1746,7 @@ var Login = function (_a) {
     var actions = isShowOtp
         ? (jsxRuntime.jsxs(Stack, { children: [jsxRuntime.jsx(Button, { "data-test": "LoginWithMfa__Button__submit", onClick: login, disabled: !isValid || isOtpLoading || isSuccessMfaAuth, isLoading: isOtpLoading, children: "Confirm" }), jsxRuntime.jsxs(Stack, { position: "horizontal-center", className: style.buttonRow, dataAlignItems: "center", children: [jsxRuntime.jsx(Stack, { position: "horizontal", children: jsxRuntime.jsx("p", { children: "Wrong account?" }) }), jsxRuntime.jsx(Link, { onClick: function () { return setIsShowOtp(false); }, children: "Back to login" })] })] }))
         : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Button, { "data-test": "LoginForm__Button__login", type: "submit", disabled: !isValid, isLoading: isLoading, children: "Log in" }), jsxRuntime.jsxs(Stack, { children: [signupRequestRoute && (jsxRuntime.jsxs(Stack, { position: "horizontal-center", className: style.buttonRow, dataAlignItems: "center", children: [jsxRuntime.jsx(Stack, { position: "horizontal", children: jsxRuntime.jsx("p", { children: "Don't have an account?" }) }), jsxRuntime.jsx(Link, { href: signupRequestRoute, "data-test": "LoginForm__Button__signup", children: "Sign up" })] })), jsxRuntime.jsxs(Stack, { position: "horizontal-center", className: style.buttonRow, dataAlignItems: "center", children: [jsxRuntime.jsx(Stack, { position: "horizontal", children: jsxRuntime.jsx("p", { children: "Forgot password?" }) }), jsxRuntime.jsx(Link, { href: forgotPasswordRoute, "data-test": "LoginForm__Button__forgotPassword", children: "Reset" })] })] })] }));
-    return (jsxRuntime.jsx("form", { onSubmit: handleSubmit(loginSubmit), children: jsxRuntime.jsx(LoginLayout, { logo: logo, backgroundIcon: backgroundIcon, footer: footer, actions: actions, children: body }) }));
+    return (jsxRuntime.jsx("form", { onSubmit: handleSubmit(loginSubmit), children: jsxRuntime.jsx(LoginLayout, { logo: logo, header: header, backgroundIcon: backgroundIcon, footer: footer, actions: actions, children: body }) }));
 };
 
 exports.Accordion = Accordion;