@veniceswap/uikit 0.65.30 → 0.65.32
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
CHANGED
|
@@ -105,7 +105,7 @@ var getThemeValue = function (path, fallback) {
|
|
|
105
105
|
|
|
106
106
|
var rotate$1 = styled.keyframes(templateObject_1$1c || (templateObject_1$1c = __makeTemplateObject(["\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n"], ["\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n"])));
|
|
107
107
|
var spinStyle = styled.css(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n animation: ", " 2s linear infinite;\n"], ["\n animation: ", " 2s linear infinite;\n"])), rotate$1);
|
|
108
|
-
var Svg = styled__default["default"].svg(templateObject_3$
|
|
108
|
+
var Svg = styled__default["default"].svg(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n align-self: center; // Safari fix\n fill: ", ";\n flex-shrink: 0;\n ", "\n ", "\n"], ["\n align-self: center; // Safari fix\n fill: ", ";\n flex-shrink: 0;\n ", "\n ", "\n"])), function (_a) {
|
|
109
109
|
var theme = _a.theme, color = _a.color;
|
|
110
110
|
return getThemeValue("colors.".concat(color), color)(theme);
|
|
111
111
|
}, function (_a) {
|
|
@@ -118,7 +118,7 @@ Svg.defaultProps = {
|
|
|
118
118
|
xmlns: "http://www.w3.org/2000/svg",
|
|
119
119
|
spin: false,
|
|
120
120
|
};
|
|
121
|
-
var templateObject_1$1c, templateObject_2$z, templateObject_3$
|
|
121
|
+
var templateObject_1$1c, templateObject_2$z, templateObject_3$g;
|
|
122
122
|
|
|
123
123
|
var Icon$2i = function (props) {
|
|
124
124
|
return (React__default["default"].createElement(Svg, __assign({ viewBox: "0 0 24 24" }, props),
|
|
@@ -311,15 +311,15 @@ var templateObject_1$18;
|
|
|
311
311
|
|
|
312
312
|
var rotate = styled.keyframes(templateObject_1$17 || (templateObject_1$17 = __makeTemplateObject(["\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n"], ["\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n"])));
|
|
313
313
|
var float = styled.keyframes(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n\t0% {\n\t\ttransform: translatey(0px);\n\t}\n\t50% {\n\t\ttransform: translatey(10px);\n\t}\n\t100% {\n\t\ttransform: translatey(0px);\n\t}\n"], ["\n\t0% {\n\t\ttransform: translatey(0px);\n\t}\n\t50% {\n\t\ttransform: translatey(10px);\n\t}\n\t100% {\n\t\ttransform: translatey(0px);\n\t}\n"])));
|
|
314
|
-
var Container$1 = styled__default["default"].div(templateObject_3$
|
|
315
|
-
styled__default["default"](Icon$2d)(templateObject_4$
|
|
314
|
+
var Container$1 = styled__default["default"].div(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
|
|
315
|
+
styled__default["default"](Icon$2d)(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n animation: ", " 2s linear infinite;\n transform: translate3d(0, 0, 0);\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n animation: ", " 2s linear infinite;\n transform: translate3d(0, 0, 0);\n"])), rotate);
|
|
316
316
|
styled__default["default"](Icon$2e)(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n animation: ", " 6s ease-in-out infinite;\n transform: translate3d(0, 0, 0);\n"], ["\n animation: ", " 6s ease-in-out infinite;\n transform: translate3d(0, 0, 0);\n"])), float);
|
|
317
317
|
var Spinner = function (_a) {
|
|
318
318
|
var _b = _a.size, size = _b === void 0 ? 75 : _b, _c = _a.color, color = _c === void 0 ? "#448aff" : _c;
|
|
319
319
|
return (React__default["default"].createElement(Container$1, null,
|
|
320
320
|
React__default["default"].createElement(Animate, { size: size, color: color })));
|
|
321
321
|
};
|
|
322
|
-
var templateObject_1$17, templateObject_2$y, templateObject_3$
|
|
322
|
+
var templateObject_1$17, templateObject_2$y, templateObject_3$f, templateObject_4$c, templateObject_5$5;
|
|
323
323
|
|
|
324
324
|
var StyleSpinner = styled__default["default"].div(templateObject_1$16 || (templateObject_1$16 = __makeTemplateObject(["\n margin: 0 10px 0 0;\n"], ["\n margin: 0 10px 0 0;\n"])));
|
|
325
325
|
var Button = function (props) {
|
|
@@ -1737,8 +1737,8 @@ var Details = styled__default["default"].div(templateObject_2$x || (templateObje
|
|
|
1737
1737
|
var hasHandler = _a.hasHandler;
|
|
1738
1738
|
return (hasHandler ? "".concat(withHandlerSpacing, "px") : "12px");
|
|
1739
1739
|
});
|
|
1740
|
-
var CloseHandler = styled__default["default"].div(templateObject_3$
|
|
1741
|
-
var StyledAlert = styled__default["default"](Flex)(templateObject_4$
|
|
1740
|
+
var CloseHandler = styled__default["default"].div(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n border-radius: 0 16px 16px 0;\n right: 8px;\n position: absolute;\n top: 8px;\n"], ["\n border-radius: 0 16px 16px 0;\n right: 8px;\n position: absolute;\n top: 8px;\n"])));
|
|
1741
|
+
var StyledAlert = styled__default["default"](Flex)(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n position: relative;\n background-color: ", ";\n border-radius: 16px;\n box-shadow: 0px 20px 36px -8px rgba(14, 14, 44, 0.1), 0px 1px 1px rgba(0, 0, 0, 0.05);\n"], ["\n position: relative;\n background-color: ", ";\n border-radius: 16px;\n box-shadow: 0px 20px 36px -8px rgba(14, 14, 44, 0.1), 0px 1px 1px rgba(0, 0, 0, 0.05);\n"])), function (_a) {
|
|
1742
1742
|
var theme = _a.theme;
|
|
1743
1743
|
return theme.alert.background;
|
|
1744
1744
|
});
|
|
@@ -1755,7 +1755,7 @@ var Alert = function (_a) {
|
|
|
1755
1755
|
React__default["default"].createElement(IconButton, { scale: "sm", variant: "text", onClick: onClick },
|
|
1756
1756
|
React__default["default"].createElement(Icon$1K, { width: "24px", color: "currentColor" }))))));
|
|
1757
1757
|
};
|
|
1758
|
-
var templateObject_1$12, templateObject_2$x, templateObject_3$
|
|
1758
|
+
var templateObject_1$12, templateObject_2$x, templateObject_3$e, templateObject_4$b;
|
|
1759
1759
|
|
|
1760
1760
|
var Grid = styled__default["default"](Box)(templateObject_1$11 || (templateObject_1$11 = __makeTemplateObject(["\n display: grid;\n ", "\n ", "\n"], ["\n display: grid;\n ", "\n ", "\n"])), styledSystem.flexbox, styledSystem.grid);
|
|
1761
1761
|
var templateObject_1$11;
|
|
@@ -1825,7 +1825,7 @@ var UnitContainer = styled__default["default"](Text)(templateObject_2$w || (temp
|
|
|
1825
1825
|
var theme = _a.theme;
|
|
1826
1826
|
return theme.colors.textSubtle;
|
|
1827
1827
|
});
|
|
1828
|
-
var StyledBalanceInput = styled__default["default"](Box)(templateObject_3$
|
|
1828
|
+
var StyledBalanceInput = styled__default["default"](Box)(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 16px;\n box-shadow: ", ";\n padding: 8px 16px;\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 16px;\n box-shadow: ", ";\n padding: 8px 16px;\n"])), function (_a) {
|
|
1829
1829
|
var theme = _a.theme;
|
|
1830
1830
|
return theme.colors.input;
|
|
1831
1831
|
}, function (_a) {
|
|
@@ -1835,14 +1835,14 @@ var StyledBalanceInput = styled__default["default"](Box)(templateObject_3$c || (
|
|
|
1835
1835
|
var theme = _a.theme, isWarning = _a.isWarning;
|
|
1836
1836
|
return theme.shadows[isWarning ? "warning" : "inset"];
|
|
1837
1837
|
});
|
|
1838
|
-
var StyledInput$1 = styled__default["default"](Input$1)(templateObject_4$
|
|
1838
|
+
var StyledInput$1 = styled__default["default"](Input$1)(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n background: transparent;\n border-radius: 0;\n box-shadow: none;\n padding-left: 0;\n padding-right: 0;\n text-align: ", ";\n border: none;\n\n ::placeholder {\n color: ", ";\n }\n\n &:focus:not(:disabled) {\n box-shadow: none;\n }\n"], ["\n background: transparent;\n border-radius: 0;\n box-shadow: none;\n padding-left: 0;\n padding-right: 0;\n text-align: ", ";\n border: none;\n\n ::placeholder {\n color: ", ";\n }\n\n &:focus:not(:disabled) {\n box-shadow: none;\n }\n"])), function (_a) {
|
|
1839
1839
|
var _b = _a.textAlign, textAlign = _b === void 0 ? "right" : _b;
|
|
1840
1840
|
return textAlign;
|
|
1841
1841
|
}, function (_a) {
|
|
1842
1842
|
var theme = _a.theme;
|
|
1843
1843
|
return theme.colors.textSubtle;
|
|
1844
1844
|
});
|
|
1845
|
-
var templateObject_1$$, templateObject_2$w, templateObject_3$
|
|
1845
|
+
var templateObject_1$$, templateObject_2$w, templateObject_3$d, templateObject_4$a;
|
|
1846
1846
|
|
|
1847
1847
|
var BalanceInput = function (_a) {
|
|
1848
1848
|
var value = _a.value, _b = _a.placeholder, placeholder = _b === void 0 ? "0.0" : _b, onUserInput = _a.onUserInput, currencyValue = _a.currencyValue, inputProps = _a.inputProps, innerRef = _a.innerRef, _c = _a.isWarning, isWarning = _c === void 0 ? false : _c, _d = _a.decimals, decimals = _d === void 0 ? 18 : _d, unit = _a.unit, switchEditingUnits = _a.switchEditingUnits, props = __rest(_a, ["value", "placeholder", "onUserInput", "currencyValue", "inputProps", "innerRef", "isWarning", "decimals", "unit", "switchEditingUnits"]);
|
|
@@ -1981,7 +1981,7 @@ var getBorderColor = function (_a) {
|
|
|
1981
1981
|
}
|
|
1982
1982
|
return theme.colors.cardBorder;
|
|
1983
1983
|
};
|
|
1984
|
-
var StyledCard = styled__default["default"].div(templateObject_3$
|
|
1984
|
+
var StyledCard = styled__default["default"].div(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n background: ", ";\n border-radius: ", ";\n color: ", ";\n overflow: hidden;\n position: relative;\n\n ", "\n\n padding: 1px 1px 3px 1px;\n\n ", "\n"], ["\n background: ", ";\n border-radius: ", ";\n color: ", ";\n overflow: hidden;\n position: relative;\n\n ", "\n\n padding: 1px 1px 3px 1px;\n\n ", "\n"])), getBorderColor, function (_a) {
|
|
1985
1985
|
var theme = _a.theme;
|
|
1986
1986
|
return theme.radii.card;
|
|
1987
1987
|
}, function (_a) {
|
|
@@ -1991,7 +1991,7 @@ var StyledCard = styled__default["default"].div(templateObject_3$b || (templateO
|
|
|
1991
1991
|
var isActive = _a.isActive;
|
|
1992
1992
|
return isActive && styled.css(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n animation: ", " 3s ease infinite;\n background-size: 400% 400%;\n "], ["\n animation: ", " 3s ease infinite;\n background-size: 400% 400%;\n "])), PromotedGradient);
|
|
1993
1993
|
}, styledSystem.space);
|
|
1994
|
-
var StyledCardInner = styled__default["default"](Box)(templateObject_4$
|
|
1994
|
+
var StyledCardInner = styled__default["default"](Box)(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n overflow: ", ";\n background: ", ";\n border-radius: ", ";\n"], ["\n width: 100%;\n height: 100%;\n overflow: ", ";\n background: ", ";\n border-radius: ", ";\n"])), function (_a) {
|
|
1995
1995
|
var hasCustomBorder = _a.hasCustomBorder;
|
|
1996
1996
|
return (hasCustomBorder ? "initial" : "inherit");
|
|
1997
1997
|
}, function (_a) {
|
|
@@ -2007,7 +2007,7 @@ StyledCard.defaultProps = {
|
|
|
2007
2007
|
isWarning: false,
|
|
2008
2008
|
isDisabled: false,
|
|
2009
2009
|
};
|
|
2010
|
-
var templateObject_1$X, templateObject_2$u, templateObject_3$
|
|
2010
|
+
var templateObject_1$X, templateObject_2$u, templateObject_3$c, templateObject_4$9;
|
|
2011
2011
|
|
|
2012
2012
|
var Card = function (_a) {
|
|
2013
2013
|
var ribbon = _a.ribbon, children = _a.children, background = _a.background, props = __rest(_a, ["ribbon", "children", "background"]);
|
|
@@ -2080,14 +2080,14 @@ var variant = {
|
|
|
2080
2080
|
|
|
2081
2081
|
var waves = styled.keyframes(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n from {\n left: -150px;\n }\n to {\n left: 100%;\n }\n"], ["\n from {\n left: -150px;\n }\n to {\n left: 100%;\n }\n"])));
|
|
2082
2082
|
var pulse = styled.keyframes(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.4;\n }\n 100% {\n opacity: 1;\n }\n"], ["\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.4;\n }\n 100% {\n opacity: 1;\n }\n"])));
|
|
2083
|
-
var Root = styled__default["default"].div(templateObject_3$
|
|
2083
|
+
var Root = styled__default["default"].div(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n min-height: 20px;\n display: block;\n background-color: ", ";\n border-radius: ", ";\n\n ", "\n ", "\n"], ["\n min-height: 20px;\n display: block;\n background-color: ", ";\n border-radius: ", ";\n\n ", "\n ", "\n"])), function (_a) {
|
|
2084
2084
|
var theme = _a.theme;
|
|
2085
2085
|
return theme.colors.backgroundDisabled;
|
|
2086
2086
|
}, function (_a) {
|
|
2087
2087
|
var variant$1 = _a.variant, theme = _a.theme;
|
|
2088
2088
|
return (variant$1 === variant.CIRCLE ? theme.radii.circle : theme.radii.small);
|
|
2089
2089
|
}, styledSystem.layout, styledSystem.space);
|
|
2090
|
-
var Pulse = styled__default["default"](Root)(templateObject_4$
|
|
2090
|
+
var Pulse = styled__default["default"](Root)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n animation: ", " 2s infinite ease-out;\n transform: translate3d(0, 0, 0);\n"], ["\n animation: ", " 2s infinite ease-out;\n transform: translate3d(0, 0, 0);\n"])), pulse);
|
|
2091
2091
|
var Waves = styled__default["default"](Root)(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n position: relative;\n overflow: hidden;\n transform: translate3d(0, 0, 0);\n &:before {\n content: \"\";\n position: absolute;\n background-image: linear-gradient(90deg, transparent, rgba(243, 243, 243, 0.5), transparent);\n top: 0;\n left: -150px;\n height: 100%;\n width: 150px;\n animation: ", " 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;\n }\n"], ["\n position: relative;\n overflow: hidden;\n transform: translate3d(0, 0, 0);\n &:before {\n content: \"\";\n position: absolute;\n background-image: linear-gradient(90deg, transparent, rgba(243, 243, 243, 0.5), transparent);\n top: 0;\n left: -150px;\n height: 100%;\n width: 150px;\n animation: ", " 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;\n }\n"])), waves);
|
|
2092
2092
|
var Skeleton = function (_a) {
|
|
2093
2093
|
var _b = _a.variant, variant$1 = _b === void 0 ? variant.RECT : _b, _c = _a.animation, animation$1 = _c === void 0 ? animation.PULSE : _c, props = __rest(_a, ["variant", "animation"]);
|
|
@@ -2096,7 +2096,7 @@ var Skeleton = function (_a) {
|
|
|
2096
2096
|
}
|
|
2097
2097
|
return React__default["default"].createElement(Pulse, __assign({ variant: variant$1 }, props));
|
|
2098
2098
|
};
|
|
2099
|
-
var templateObject_1$S, templateObject_2$t, templateObject_3$
|
|
2099
|
+
var templateObject_1$S, templateObject_2$t, templateObject_3$b, templateObject_4$8, templateObject_5$4;
|
|
2100
2100
|
|
|
2101
2101
|
var PriceLink = styled__default["default"].a(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n display: flex;\n align-items: center;\n svg {\n transition: transform 0.3s;\n }\n :hover {\n svg {\n transform: scale(1.2);\n }\n }\n"], ["\n display: flex;\n align-items: center;\n svg {\n transition: transform 0.3s;\n }\n :hover {\n svg {\n transform: scale(1.2);\n }\n }\n"])));
|
|
2102
2102
|
var CakePrice = function (_a) {
|
|
@@ -2528,7 +2528,7 @@ var Message = function (_a) {
|
|
|
2528
2528
|
var templateObject_1$B;
|
|
2529
2529
|
|
|
2530
2530
|
var NotificationDotRoot = styled__default["default"].span(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n display: inline-flex;\n position: relative;\n"], ["\n display: inline-flex;\n position: relative;\n"])));
|
|
2531
|
-
var Dot = styled__default["default"].span(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n display: ", ";\n position: absolute;\n top: 0;\n right: 0;\n width: 10px;\n height: 10px;\n pointer-events: none;\n border: 2px solid ", ";\n border-radius: 50%;\n background-color: ", ";\n"], ["\n display: ", ";\n position: absolute;\n top: 0;\n right: 0;\n width: 10px;\n height: 10px;\n pointer-events: none;\n border: 2px solid ", ";\n border-radius: 50%;\n background-color: ", ";\n"])), function (_a) {
|
|
2531
|
+
var Dot$1 = styled__default["default"].span(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n display: ", ";\n position: absolute;\n top: 0;\n right: 0;\n width: 10px;\n height: 10px;\n pointer-events: none;\n border: 2px solid ", ";\n border-radius: 50%;\n background-color: ", ";\n"], ["\n display: ", ";\n position: absolute;\n top: 0;\n right: 0;\n width: 10px;\n height: 10px;\n pointer-events: none;\n border: 2px solid ", ";\n border-radius: 50%;\n background-color: ", ";\n"])), function (_a) {
|
|
2532
2532
|
var show = _a.show;
|
|
2533
2533
|
return (show ? "inline-flex" : "none");
|
|
2534
2534
|
}, function (_a) {
|
|
@@ -2542,7 +2542,7 @@ var NotificationDot = function (_a) {
|
|
|
2542
2542
|
var _b = _a.show, show = _b === void 0 ? false : _b, _c = _a.color, color = _c === void 0 ? "failure" : _c, children = _a.children, props = __rest(_a, ["show", "color", "children"]);
|
|
2543
2543
|
return (React__default["default"].createElement(NotificationDotRoot, null,
|
|
2544
2544
|
React.Children.map(children, function (child) { return React.cloneElement(child, props); }),
|
|
2545
|
-
React__default["default"].createElement(Dot, { show: show, color: color })));
|
|
2545
|
+
React__default["default"].createElement(Dot$1, { show: show, color: color })));
|
|
2546
2546
|
};
|
|
2547
2547
|
var templateObject_1$A, templateObject_2$n;
|
|
2548
2548
|
|
|
@@ -2647,14 +2647,14 @@ var PancakeInput = styled__default["default"].input(templateObject_2$m || (templ
|
|
|
2647
2647
|
var theme = _a.theme;
|
|
2648
2648
|
return theme.shadows.focus;
|
|
2649
2649
|
}, getScale$2("travelDistance"), getScale$2("pancakeThickness"), getScale$2("pancakeThickness"));
|
|
2650
|
-
var PancakeLabel = styled__default["default"].label(templateObject_3$
|
|
2650
|
+
var PancakeLabel = styled__default["default"].label(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n background: ", ";\n box-shadow: ", ";\n display: inline-block;\n border-radius: 50px;\n position: relative;\n transition: all 0.3s ease;\n transform-origin: 20% center;\n cursor: pointer;\n"], ["\n width: ", ";\n height: ", ";\n background: ", ";\n box-shadow: ", ";\n display: inline-block;\n border-radius: 50px;\n position: relative;\n transition: all 0.3s ease;\n transform-origin: 20% center;\n cursor: pointer;\n"])), getScale$2("toggleWidth"), getScale$2("toggleHeight"), function (_a) {
|
|
2651
2651
|
var theme = _a.theme, checked = _a.checked;
|
|
2652
2652
|
return theme.colors[checked ? "success" : "input"];
|
|
2653
2653
|
}, function (_a) {
|
|
2654
2654
|
var theme = _a.theme;
|
|
2655
2655
|
return theme.shadows.inset;
|
|
2656
2656
|
});
|
|
2657
|
-
var templateObject_1$y, templateObject_2$m, templateObject_3$
|
|
2657
|
+
var templateObject_1$y, templateObject_2$m, templateObject_3$a;
|
|
2658
2658
|
|
|
2659
2659
|
var PancakeToggle = function (_a) {
|
|
2660
2660
|
var checked = _a.checked, _b = _a.scale, scale = _b === void 0 ? scales$4.LG : _b, props = __rest(_a, ["checked", "scale"]);
|
|
@@ -2991,11 +2991,11 @@ var SliderLabel = styled__default["default"](Text)(templateObject_2$k || (templa
|
|
|
2991
2991
|
var progress = _a.progress;
|
|
2992
2992
|
return progress;
|
|
2993
2993
|
});
|
|
2994
|
-
var BunnyButt = styled__default["default"].div(templateObject_3$
|
|
2994
|
+
var BunnyButt = styled__default["default"].div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n background: url(", ") no-repeat;\n height: 32px;\n filter: ", ";\n position: absolute;\n width: 15px;\n"], ["\n background: url(", ") no-repeat;\n height: 32px;\n filter: ", ";\n position: absolute;\n width: 15px;\n"])), bunnyButt, function (_a) {
|
|
2995
2995
|
var disabled = _a.disabled;
|
|
2996
2996
|
return (disabled ? "grayscale(100%)" : "none");
|
|
2997
2997
|
});
|
|
2998
|
-
var BunnySlider = styled__default["default"].div(templateObject_4$
|
|
2998
|
+
var BunnySlider = styled__default["default"].div(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n position: absolute;\n left: 14px;\n width: calc(100% - 14px);\n"], ["\n position: absolute;\n left: 14px;\n width: calc(100% - 14px);\n"])));
|
|
2999
2999
|
var StyledInput = styled__default["default"].input(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n cursor: ", ";\n height: 32px;\n position: relative;\n\n ::-webkit-slider-thumb {\n ", "\n }\n\n ::-moz-range-thumb {\n ", "\n }\n\n ::-ms-thumb {\n ", "\n }\n"], ["\n cursor: ", ";\n height: 32px;\n position: relative;\n\n ::-webkit-slider-thumb {\n ", "\n }\n\n ::-moz-range-thumb {\n ", "\n }\n\n ::-ms-thumb {\n ", "\n }\n"])), getCursorStyle, getBaseThumbStyles, getBaseThumbStyles, getBaseThumbStyles);
|
|
3000
3000
|
var BarBackground = styled__default["default"].div(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject(["\n background-color: ", ";\n height: 2px;\n position: absolute;\n top: 18px;\n width: 100%;\n"], ["\n background-color: ", ";\n height: 2px;\n position: absolute;\n top: 18px;\n width: 100%;\n"])), function (_a) {
|
|
3001
3001
|
var theme = _a.theme, disabled = _a.disabled;
|
|
@@ -3008,7 +3008,7 @@ var BarProgress = styled__default["default"].div(templateObject_7$2 || (template
|
|
|
3008
3008
|
var disabled = _a.disabled;
|
|
3009
3009
|
return (disabled ? "grayscale(100%)" : "none");
|
|
3010
3010
|
});
|
|
3011
|
-
var templateObject_1$u, templateObject_2$k, templateObject_3$
|
|
3011
|
+
var templateObject_1$u, templateObject_2$k, templateObject_3$9, templateObject_4$7, templateObject_5$3, templateObject_6$2, templateObject_7$2;
|
|
3012
3012
|
|
|
3013
3013
|
var Slider = function (_a) {
|
|
3014
3014
|
var name = _a.name, min = _a.min, max = _a.max, value = _a.value, onValueChanged = _a.onValueChanged, valueLabel = _a.valueLabel, _b = _a.step, step = _b === void 0 ? "any" : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, props = __rest(_a, ["name", "min", "max", "value", "onValueChanged", "valueLabel", "step", "disabled"]);
|
|
@@ -3081,14 +3081,14 @@ var Connector = styled__default["default"].div(templateObject_2$j || (templateOb
|
|
|
3081
3081
|
var theme = _a.theme, status = _a.status;
|
|
3082
3082
|
return theme.colors[status === "past" || status === "current" ? "success" : "textDisabled"];
|
|
3083
3083
|
});
|
|
3084
|
-
var ChildrenWrapper = styled__default["default"](Box)(templateObject_3$
|
|
3084
|
+
var ChildrenWrapper = styled__default["default"](Box)(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n ", " {\n visibility: ", ";\n }\n"], ["\n ", " {\n visibility: ", ";\n }\n"])), function (_a) {
|
|
3085
3085
|
var theme = _a.theme;
|
|
3086
3086
|
return theme.mediaQueries.md;
|
|
3087
3087
|
}, function (_a) {
|
|
3088
3088
|
var isVisible = _a.isVisible;
|
|
3089
3089
|
return (isVisible ? "visible" : "hidden");
|
|
3090
3090
|
});
|
|
3091
|
-
var ChildrenLeftWrapper = styled__default["default"](ChildrenWrapper)(templateObject_4$
|
|
3091
|
+
var ChildrenLeftWrapper = styled__default["default"](ChildrenWrapper)(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n display: none;\n ", " {\n display: block;\n margin-right: 16px;\n }\n"], ["\n display: none;\n ", " {\n display: block;\n margin-right: 16px;\n }\n"])), function (_a) {
|
|
3092
3092
|
var theme = _a.theme;
|
|
3093
3093
|
return theme.mediaQueries.md;
|
|
3094
3094
|
});
|
|
@@ -3127,7 +3127,7 @@ var Step = function (_a) {
|
|
|
3127
3127
|
!isFirst && !isLast && React__default["default"].createElement(Connector, { "$isFirstStep": isFirst, "$isLastStep": isLast, status: statusSecondPart })),
|
|
3128
3128
|
React__default["default"].createElement(ChildrenRightWrapper, { isVisible: isIndexPair }, children)));
|
|
3129
3129
|
};
|
|
3130
|
-
var templateObject_1$s, templateObject_2$j, templateObject_3$
|
|
3130
|
+
var templateObject_1$s, templateObject_2$j, templateObject_3$8, templateObject_4$6, templateObject_5$2, templateObject_6$1, templateObject_7$1;
|
|
3131
3131
|
|
|
3132
3132
|
var InlineMenuContainer = styled__default["default"](Box)(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n background-color: ", ";\n border-radius: ", ";\n box-shadow: ", ";\n"], ["\n background-color: ", ";\n border-radius: ", ";\n box-shadow: ", ";\n"])), function (_a) {
|
|
3133
3133
|
var theme = _a.theme;
|
|
@@ -3149,15 +3149,15 @@ var SubMenuContainer = styled__default["default"](Flex)(templateObject_2$i || (t
|
|
|
3149
3149
|
var theme = _a.theme;
|
|
3150
3150
|
return "1px solid ".concat(theme.colors.inputSecondary);
|
|
3151
3151
|
});
|
|
3152
|
-
var ClickableElementContainer = styled__default["default"].div(templateObject_3$
|
|
3153
|
-
var SubMenuItem = styled__default["default"].button(templateObject_4$
|
|
3152
|
+
var ClickableElementContainer = styled__default["default"].div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n cursor: pointer;\n display: inline-flex;\n"], ["\n cursor: pointer;\n display: inline-flex;\n"])));
|
|
3153
|
+
var SubMenuItem = styled__default["default"].button(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n border: 0;\n outline: 0;\n cursor: pointer;\n background: transparent;\n padding: 8px 16px;\n color: ", ";\n width: 100%;\n font-size: 16px;\n text-align: left;\n\n &:hover {\n background-color: ", ";\n text-decoration: none;\n }\n"], ["\n border: 0;\n outline: 0;\n cursor: pointer;\n background: transparent;\n padding: 8px 16px;\n color: ", ";\n width: 100%;\n font-size: 16px;\n text-align: left;\n\n &:hover {\n background-color: ", ";\n text-decoration: none;\n }\n"])), function (_a) {
|
|
3154
3154
|
var theme = _a.theme;
|
|
3155
3155
|
return theme.colors.text;
|
|
3156
3156
|
}, function (_a) {
|
|
3157
3157
|
var theme = _a.theme;
|
|
3158
3158
|
return theme.colors.inputSecondary;
|
|
3159
3159
|
});
|
|
3160
|
-
var templateObject_1$r, templateObject_2$i, templateObject_3$
|
|
3160
|
+
var templateObject_1$r, templateObject_2$i, templateObject_3$7, templateObject_4$5;
|
|
3161
3161
|
|
|
3162
3162
|
var portalRoot$1 = document.getElementById("portal-root");
|
|
3163
3163
|
var BaseMenu = function (_a) {
|
|
@@ -3684,14 +3684,14 @@ var Input = styled__default["default"].input(templateObject_2$f || (templateObje
|
|
|
3684
3684
|
var theme = _a.theme;
|
|
3685
3685
|
return theme.shadows.focus;
|
|
3686
3686
|
});
|
|
3687
|
-
var StyledToggle = styled__default["default"].div(templateObject_3$
|
|
3687
|
+
var StyledToggle = styled__default["default"].div(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border-radius: 24px;\n box-shadow: ", ";\n cursor: pointer;\n display: inline-flex;\n height: ", ";\n position: relative;\n transition: background-color 200ms;\n width: ", ";\n"], ["\n align-items: center;\n background-color: ", ";\n border-radius: 24px;\n box-shadow: ", ";\n cursor: pointer;\n display: inline-flex;\n height: ", ";\n position: relative;\n transition: background-color 200ms;\n width: ", ";\n"])), function (_a) {
|
|
3688
3688
|
var theme = _a.theme, $checked = _a.$checked, $checkedColor = _a.$checkedColor, $defaultColor = _a.$defaultColor;
|
|
3689
3689
|
return theme.colors[$checked ? $checkedColor : $defaultColor];
|
|
3690
3690
|
}, function (_a) {
|
|
3691
3691
|
var theme = _a.theme;
|
|
3692
3692
|
return theme.shadows.inset;
|
|
3693
3693
|
}, getScale("toggleHeight"), getScale("toggleWidth"));
|
|
3694
|
-
var templateObject_1$m, templateObject_2$f, templateObject_3$
|
|
3694
|
+
var templateObject_1$m, templateObject_2$f, templateObject_3$6;
|
|
3695
3695
|
|
|
3696
3696
|
var Toggle = function (_a) {
|
|
3697
3697
|
var checked = _a.checked, _b = _a.defaultColor, defaultColor = _b === void 0 ? "input" : _b, _c = _a.checkedColor, checkedColor = _c === void 0 ? "success" : _c, _d = _a.scale, scale = _d === void 0 ? scales$1.LG : _d, startIcon = _a.startIcon, endIcon = _a.endIcon, props = __rest(_a, ["checked", "defaultColor", "checkedColor", "scale", "startIcon", "endIcon"]);
|
|
@@ -4274,7 +4274,7 @@ var ModalHeader = styled__default["default"].div(templateObject_1$g || (template
|
|
|
4274
4274
|
return theme.colors.cardBorder;
|
|
4275
4275
|
});
|
|
4276
4276
|
var ModalTitle = styled__default["default"](Flex)(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n align-items: center;\n flex: 1;\n"], ["\n align-items: center;\n flex: 1;\n"])));
|
|
4277
|
-
var ModalBody = styled__default["default"](Flex)(templateObject_3$
|
|
4277
|
+
var ModalBody = styled__default["default"](Flex)(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n flex-direction: column;\n max-height: 90vh;\n overflow-y: auto;\n"], ["\n flex-direction: column;\n max-height: 90vh;\n overflow-y: auto;\n"])));
|
|
4278
4278
|
var ModalCloseButton = function (_a) {
|
|
4279
4279
|
var onDismiss = _a.onDismiss;
|
|
4280
4280
|
return (React__default["default"].createElement(IconButton, { variant: "text", onClick: onDismiss, "aria-label": "Close the dialog" },
|
|
@@ -4285,7 +4285,7 @@ var ModalBackButton = function (_a) {
|
|
|
4285
4285
|
return (React__default["default"].createElement(IconButton, { variant: "text", onClick: onBack, "area-label": "go back", mr: "8px" },
|
|
4286
4286
|
React__default["default"].createElement(Icon$29, { color: "primary" })));
|
|
4287
4287
|
};
|
|
4288
|
-
var ModalContainer = styled__default["default"](Box)(templateObject_4$
|
|
4288
|
+
var ModalContainer = styled__default["default"](Box)(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n overflow: hidden;\n background: ", ";\n box-shadow: 0px 20px 36px -8px rgba(14, 14, 44, 0.1), 0px 1px 1px rgba(0, 0, 0, 0.05);\n border: 1px solid ", ";\n border-radius: 32px;\n width: 100%;\n max-height: 100vh;\n z-index: ", ";\n\n ", " {\n width: auto;\n min-width: ", ";\n max-width: 100%;\n }\n"], ["\n overflow: hidden;\n background: ", ";\n box-shadow: 0px 20px 36px -8px rgba(14, 14, 44, 0.1), 0px 1px 1px rgba(0, 0, 0, 0.05);\n border: 1px solid ", ";\n border-radius: 32px;\n width: 100%;\n max-height: 100vh;\n z-index: ", ";\n\n ", " {\n width: auto;\n min-width: ", ";\n max-width: 100%;\n }\n"])), function (_a) {
|
|
4289
4289
|
var theme = _a.theme;
|
|
4290
4290
|
return theme.modal.background;
|
|
4291
4291
|
}, function (_a) {
|
|
@@ -4301,7 +4301,7 @@ var ModalContainer = styled__default["default"](Box)(templateObject_4$3 || (temp
|
|
|
4301
4301
|
var minWidth = _a.minWidth;
|
|
4302
4302
|
return minWidth;
|
|
4303
4303
|
});
|
|
4304
|
-
var templateObject_1$g, templateObject_2$b, templateObject_3$
|
|
4304
|
+
var templateObject_1$g, templateObject_2$b, templateObject_3$5, templateObject_4$4;
|
|
4305
4305
|
|
|
4306
4306
|
var Modal = function (_a) {
|
|
4307
4307
|
var title = _a.title, onDismiss = _a.onDismiss, onBack = _a.onBack, children = _a.children, _b = _a.hideCloseButton, hideCloseButton = _b === void 0 ? false : _b, _c = _a.bodyPadding, bodyPadding = _c === void 0 ? "24px" : _c, _d = _a.headerBackground, headerBackground = _d === void 0 ? "transparent" : _d, _e = _a.minWidth, minWidth = _e === void 0 ? "320px" : _e, props = __rest(_a, ["title", "onDismiss", "onBack", "children", "hideCloseButton", "bodyPadding", "headerBackground", "minWidth"]);
|
|
@@ -4498,11 +4498,11 @@ var DropdownMenuItem = styled__default["default"].button(templateObject_1$b || (
|
|
|
4498
4498
|
return theme.colors.tertiary;
|
|
4499
4499
|
});
|
|
4500
4500
|
var StyledDropdownMenuItemContainer = styled__default["default"].div(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n &:first-child > ", " {\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n }\n\n &:last-child > ", " {\n border-bottom-left-radius: 8px;\n border-bottom-right-radius: 8px;\n }\n"], ["\n &:first-child > ", " {\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n }\n\n &:last-child > ", " {\n border-bottom-left-radius: 8px;\n border-bottom-right-radius: 8px;\n }\n"])), DropdownMenuItem, DropdownMenuItem);
|
|
4501
|
-
var DropdownMenuDivider = styled__default["default"].hr(templateObject_3$
|
|
4501
|
+
var DropdownMenuDivider = styled__default["default"].hr(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n border-color: ", ";\n border-style: solid;\n border-width: 1px 0 0;\n margin: 4px 0;\n"], ["\n border-color: ", ";\n border-style: solid;\n border-width: 1px 0 0;\n margin: 4px 0;\n"])), function (_a) {
|
|
4502
4502
|
var theme = _a.theme;
|
|
4503
4503
|
return theme.colors.cardBorder;
|
|
4504
4504
|
});
|
|
4505
|
-
var StyledDropdownMenu = styled__default["default"].div(templateObject_4$
|
|
4505
|
+
var StyledDropdownMenu = styled__default["default"].div(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 16px;\n padding-bottom: 4px;\n padding-top: 4px;\n pointer-events: auto;\n width: ", ";\n visibility: visible;\n z-index: 1001;\n\n ", "\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 16px;\n padding-bottom: 4px;\n padding-top: 4px;\n pointer-events: auto;\n width: ", ";\n visibility: visible;\n z-index: 1001;\n\n ", "\n"])), function (_a) {
|
|
4506
4506
|
var theme = _a.theme;
|
|
4507
4507
|
return theme.card.background;
|
|
4508
4508
|
}, function (_a) {
|
|
@@ -4526,7 +4526,7 @@ var LinkStatus = styled__default["default"](Text)(templateObject_5$1 || (templat
|
|
|
4526
4526
|
var theme = _a.theme, color = _a.color;
|
|
4527
4527
|
return theme.colors[color];
|
|
4528
4528
|
});
|
|
4529
|
-
var templateObject_1$b, templateObject_2$7, templateObject_3$
|
|
4529
|
+
var templateObject_1$b, templateObject_2$7, templateObject_3$4, templateObject_4$3, templateObject_5$1;
|
|
4530
4530
|
|
|
4531
4531
|
exports.DropdownMenuItemType = void 0;
|
|
4532
4532
|
(function (DropdownMenuItemType) {
|
|
@@ -4869,8 +4869,8 @@ styled__default["default"].ul(templateObject_2$6 || (templateObject_2$6 = __make
|
|
|
4869
4869
|
var theme = _a.theme;
|
|
4870
4870
|
return theme.mediaQueries.md;
|
|
4871
4871
|
});
|
|
4872
|
-
styled__default["default"].li(templateObject_3$
|
|
4873
|
-
styled__default["default"](Box)(templateObject_4$
|
|
4872
|
+
styled__default["default"].li(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n font-size: 16px;\n margin-bottom: 8px;\n text-transform: capitalize;\n\n &:first-child {\n color: ", ";\n font-weight: 600;\n text-transform: uppercase;\n }\n"], ["\n font-size: 16px;\n margin-bottom: 8px;\n text-transform: capitalize;\n\n &:first-child {\n color: ", ";\n font-weight: 600;\n text-transform: uppercase;\n }\n"])), darkColors.secondary);
|
|
4873
|
+
styled__default["default"](Box)(templateObject_4$2 || (templateObject_4$2 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
4874
4874
|
var StyledToolsContainer = styled__default["default"](Flex)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n border-top: 1px solid ", ";\n padding: 42px 0;\n"], ["\n border-top: 1px solid ", ";\n padding: 42px 0;\n"])), lightColors.cardBorder);
|
|
4875
4875
|
var StyledSocialLinks = styled__default["default"](SocialLinks$1)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n border-bottom: 1px solid ", ";\n"], ["\n border-bottom: 1px solid ", ";\n"])), darkColors.cardBorder);
|
|
4876
4876
|
var StyledPrivacyLinks = styled__default["default"](PrivacyLinks$1)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n border-bottom: 1px solid ", ";\n"], ["\n border-bottom: 1px solid ", ";\n"])), darkColors.cardBorder);
|
|
@@ -4879,7 +4879,7 @@ var StyledFooterMenuLinks = styled__default["default"](FooterMenuLinks$1)(templa
|
|
|
4879
4879
|
return (theme.devicesQueries.mobile ? "30px" : 0);
|
|
4880
4880
|
});
|
|
4881
4881
|
styled__default["default"].span(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), darkColors.text);
|
|
4882
|
-
var templateObject_1$a, templateObject_2$6, templateObject_3$
|
|
4882
|
+
var templateObject_1$a, templateObject_2$6, templateObject_3$3, templateObject_4$2, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;
|
|
4883
4883
|
|
|
4884
4884
|
var MenuItem = function (_a) {
|
|
4885
4885
|
var items = _a.items, props = __rest(_a, ["items"]);
|
|
@@ -5121,8 +5121,8 @@ var StyledNav = styled__default["default"].nav(templateObject_2$4 || (templateOb
|
|
|
5121
5121
|
var theme = _a.theme;
|
|
5122
5122
|
return theme.colors.cardBorder;
|
|
5123
5123
|
});
|
|
5124
|
-
var BodyWrapper = styled__default["default"](Box)(templateObject_3$
|
|
5125
|
-
var Inner = styled__default["default"].div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n flex-grow: 1;\n transition: margin-top 0.2s, margin-left 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n transform: translate3d(0, 0, 0);\n max-width: 100%;\n"], ["\n flex-grow: 1;\n transition: margin-top 0.2s, margin-left 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n transform: translate3d(0, 0, 0);\n max-width: 100%;\n"])));
|
|
5124
|
+
var BodyWrapper = styled__default["default"](Box)(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n position: relative;\n display: flex;\n"], ["\n position: relative;\n display: flex;\n"])));
|
|
5125
|
+
var Inner = styled__default["default"].div(templateObject_4$1 || (templateObject_4$1 = __makeTemplateObject(["\n flex-grow: 1;\n transition: margin-top 0.2s, margin-left 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n transform: translate3d(0, 0, 0);\n max-width: 100%;\n"], ["\n flex-grow: 1;\n transition: margin-top 0.2s, margin-left 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n transform: translate3d(0, 0, 0);\n max-width: 100%;\n"])));
|
|
5126
5126
|
var Menu$1 = function (_a) {
|
|
5127
5127
|
var _b;
|
|
5128
5128
|
var userMenu = _a.userMenu, globalMenu = _a.globalMenu, isDark = _a.isDark, toggleTheme = _a.toggleTheme, currentLang = _a.currentLang, setLang = _a.setLang, cakePriceUsd = _a.cakePriceUsd, links = _a.links, subLinks = _a.subLinks, footerLinks = _a.footerLinks, activeItem = _a.activeItem, activeSubItem = _a.activeSubItem, langs = _a.langs, buyCakeLabel = _a.buyCakeLabel, children = _a.children;
|
|
@@ -5177,13 +5177,14 @@ var Menu$1 = function (_a) {
|
|
|
5177
5177
|
React__default["default"].createElement(MenuItem, { items: footerLinks, isDark: isDark, toggleTheme: toggleTheme, langs: langs, setLang: setLang, currentLang: currentLang, cakePriceUsd: cakePriceUsd, buyCakeLabel: buyCakeLabel, mb: ["".concat(MOBILE_MENU_HEIGHT, "px"), null, "0px"] }))),
|
|
5178
5178
|
isMobile && React__default["default"].createElement(BottomNav, { items: links, activeItem: activeItem, activeSubItem: activeSubItem })));
|
|
5179
5179
|
};
|
|
5180
|
-
var templateObject_1$7, templateObject_2$4, templateObject_3$
|
|
5180
|
+
var templateObject_1$7, templateObject_2$4, templateObject_3$2, templateObject_4$1;
|
|
5181
5181
|
|
|
5182
5182
|
var variants = {
|
|
5183
5183
|
DEFAULT: "default",
|
|
5184
5184
|
WARNING: "warning",
|
|
5185
5185
|
DANGER: "danger",
|
|
5186
5186
|
PENDING: "pending",
|
|
5187
|
+
SUCCESS: "success",
|
|
5187
5188
|
};
|
|
5188
5189
|
|
|
5189
5190
|
var MenuIconWrapper = styled__default["default"].div(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border-color: ", ";\n border-radius: 50%;\n border-style: solid;\n border-width: 2px;\n display: flex;\n height: 40px;\n justify-content: center;\n left: 0;\n position: absolute;\n top: -4px;\n width: 40px;\n z-index: 102;\n"], ["\n align-items: center;\n background-color: ", ";\n border-color: ", ";\n border-radius: 50%;\n border-style: solid;\n border-width: 2px;\n display: flex;\n height: 40px;\n justify-content: center;\n left: 0;\n position: absolute;\n top: -4px;\n width: 40px;\n z-index: 102;\n"])), function (_a) {
|
|
@@ -5194,31 +5195,40 @@ var MenuIconWrapper = styled__default["default"].div(templateObject_1$6 || (temp
|
|
|
5194
5195
|
return theme.colors[borderColor];
|
|
5195
5196
|
});
|
|
5196
5197
|
var ProfileIcon = styled__default["default"](Image)(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n left: 0;\n position: absolute;\n top: -4px;\n z-index: 102;\n\n & > img {\n border-radius: 50%;\n }\n"], ["\n left: 0;\n position: absolute;\n top: -4px;\n z-index: 102;\n\n & > img {\n border-radius: 50%;\n }\n"])));
|
|
5197
|
-
var
|
|
5198
|
-
|
|
5198
|
+
var DotWrapper = styled__default["default"].span(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
|
|
5199
|
+
var Dot = styled__default["default"].span(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n background: rgba(255,54,54,.4);\n border-radius: 100%;\n display: block;\n display: flex;\n height: 8px;\n justify-content: center;\n position: absolute;\n right: -5px;\n top: 0;\n width: 8px;\n &:after{\n background: #ff3636;\n border-radius: 100%;\n content: \" \";\n display: block;\n height: 4px;\n width: 4px;\n }\n"], ["\n align-items: center;\n background: rgba(255,54,54,.4);\n border-radius: 100%;\n display: block;\n display: flex;\n height: 8px;\n justify-content: center;\n position: absolute;\n right: -5px;\n top: 0;\n width: 8px;\n &:after{\n background: #ff3636;\n border-radius: 100%;\n content: \" \";\n display: block;\n height: 4px;\n width: 4px;\n }\n"])));
|
|
5200
|
+
var NoProfileMenuIcon = function (_a) {
|
|
5201
|
+
var isWarning = _a.isWarning;
|
|
5202
|
+
return (React__default["default"].createElement(MenuIconWrapper, { borderColor: "primary" }, isWarning ? React__default["default"].createElement(DotWrapper, null,
|
|
5203
|
+
React__default["default"].createElement(Icon$k, { color: "primary", width: "24px" }),
|
|
5204
|
+
React__default["default"].createElement(Dot, null)) : React__default["default"].createElement(Icon$k, { color: "primary", width: "24px" })));
|
|
5205
|
+
};
|
|
5199
5206
|
var PendingMenuIcon = function () { return (React__default["default"].createElement(MenuIconWrapper, { borderColor: "secondary" },
|
|
5200
5207
|
React__default["default"].createElement(Icon$V, { color: "secondary", width: "24px", spin: true }))); };
|
|
5201
|
-
var WarningMenuIcon = function () { return (React__default["default"].createElement(MenuIconWrapper, { borderColor: "warning" },
|
|
5202
|
-
React__default["default"].createElement(Icon$n, { color: "warning", width: "24px" }))); };
|
|
5203
5208
|
var DangerMenuIcon = function () { return (React__default["default"].createElement(MenuIconWrapper, { borderColor: "failure" },
|
|
5204
5209
|
React__default["default"].createElement(Icon$n, { color: "failure", width: "24px" }))); };
|
|
5210
|
+
var SuccessMenuIcon = function () { return (React__default["default"].createElement(MenuIconWrapper, { borderColor: "primary" },
|
|
5211
|
+
React__default["default"].createElement(Icon$1Q, { color: "success", width: "24px" }))); };
|
|
5205
5212
|
var MenuIcon = function (_a) {
|
|
5206
5213
|
var avatarSrc = _a.avatarSrc, variant = _a.variant;
|
|
5207
5214
|
if (variant === variants.DANGER) {
|
|
5208
5215
|
return React__default["default"].createElement(DangerMenuIcon, null);
|
|
5209
5216
|
}
|
|
5210
5217
|
if (variant === variants.WARNING) {
|
|
5211
|
-
return React__default["default"].createElement(
|
|
5218
|
+
return React__default["default"].createElement(NoProfileMenuIcon, { isWarning: true });
|
|
5212
5219
|
}
|
|
5213
5220
|
if (variant === variants.PENDING) {
|
|
5214
5221
|
return React__default["default"].createElement(PendingMenuIcon, null);
|
|
5215
5222
|
}
|
|
5223
|
+
if (variant === variants.SUCCESS) {
|
|
5224
|
+
return React__default["default"].createElement(SuccessMenuIcon, null);
|
|
5225
|
+
}
|
|
5216
5226
|
if (!avatarSrc) {
|
|
5217
5227
|
return React__default["default"].createElement(NoProfileMenuIcon, null);
|
|
5218
5228
|
}
|
|
5219
5229
|
return React__default["default"].createElement(ProfileIcon, { src: avatarSrc, height: 40, width: 40 });
|
|
5220
5230
|
};
|
|
5221
|
-
var templateObject_1$6, templateObject_2$3;
|
|
5231
|
+
var templateObject_1$6, templateObject_2$3, templateObject_3$1, templateObject_4;
|
|
5222
5232
|
|
|
5223
5233
|
var UserMenuDivider = styled__default["default"].hr(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n border-color: ", ";\n border-style: solid;\n border-width: 1px 0 0;\n margin: 4px 0;\n"], ["\n border-color: ", ";\n border-style: solid;\n border-width: 1px 0 0;\n margin: 4px 0;\n"])), function (_a) {
|
|
5224
5234
|
var theme = _a.theme;
|
package/dist/index.esm.js
CHANGED
|
@@ -73,7 +73,7 @@ var getThemeValue = function (path, fallback) {
|
|
|
73
73
|
|
|
74
74
|
var rotate$1 = keyframes(templateObject_1$1c || (templateObject_1$1c = __makeTemplateObject(["\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n"], ["\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n"])));
|
|
75
75
|
var spinStyle = css(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n animation: ", " 2s linear infinite;\n"], ["\n animation: ", " 2s linear infinite;\n"])), rotate$1);
|
|
76
|
-
var Svg = styled.svg(templateObject_3$
|
|
76
|
+
var Svg = styled.svg(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n align-self: center; // Safari fix\n fill: ", ";\n flex-shrink: 0;\n ", "\n ", "\n"], ["\n align-self: center; // Safari fix\n fill: ", ";\n flex-shrink: 0;\n ", "\n ", "\n"])), function (_a) {
|
|
77
77
|
var theme = _a.theme, color = _a.color;
|
|
78
78
|
return getThemeValue("colors.".concat(color), color)(theme);
|
|
79
79
|
}, function (_a) {
|
|
@@ -86,7 +86,7 @@ Svg.defaultProps = {
|
|
|
86
86
|
xmlns: "http://www.w3.org/2000/svg",
|
|
87
87
|
spin: false,
|
|
88
88
|
};
|
|
89
|
-
var templateObject_1$1c, templateObject_2$z, templateObject_3$
|
|
89
|
+
var templateObject_1$1c, templateObject_2$z, templateObject_3$g;
|
|
90
90
|
|
|
91
91
|
var Icon$2i = function (props) {
|
|
92
92
|
return (React__default.createElement(Svg, __assign({ viewBox: "0 0 24 24" }, props),
|
|
@@ -279,15 +279,15 @@ var templateObject_1$18;
|
|
|
279
279
|
|
|
280
280
|
var rotate = keyframes(templateObject_1$17 || (templateObject_1$17 = __makeTemplateObject(["\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n"], ["\n from {\n transform: rotate(0deg);\n }\n to {\n transform: rotate(360deg);\n }\n"])));
|
|
281
281
|
var float = keyframes(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n\t0% {\n\t\ttransform: translatey(0px);\n\t}\n\t50% {\n\t\ttransform: translatey(10px);\n\t}\n\t100% {\n\t\ttransform: translatey(0px);\n\t}\n"], ["\n\t0% {\n\t\ttransform: translatey(0px);\n\t}\n\t50% {\n\t\ttransform: translatey(10px);\n\t}\n\t100% {\n\t\ttransform: translatey(0px);\n\t}\n"])));
|
|
282
|
-
var Container$1 = styled.div(templateObject_3$
|
|
283
|
-
styled(Icon$2d)(templateObject_4$
|
|
282
|
+
var Container$1 = styled.div(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
|
|
283
|
+
styled(Icon$2d)(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n animation: ", " 2s linear infinite;\n transform: translate3d(0, 0, 0);\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n animation: ", " 2s linear infinite;\n transform: translate3d(0, 0, 0);\n"])), rotate);
|
|
284
284
|
styled(Icon$2e)(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n animation: ", " 6s ease-in-out infinite;\n transform: translate3d(0, 0, 0);\n"], ["\n animation: ", " 6s ease-in-out infinite;\n transform: translate3d(0, 0, 0);\n"])), float);
|
|
285
285
|
var Spinner = function (_a) {
|
|
286
286
|
var _b = _a.size, size = _b === void 0 ? 75 : _b, _c = _a.color, color = _c === void 0 ? "#448aff" : _c;
|
|
287
287
|
return (React__default.createElement(Container$1, null,
|
|
288
288
|
React__default.createElement(Animate, { size: size, color: color })));
|
|
289
289
|
};
|
|
290
|
-
var templateObject_1$17, templateObject_2$y, templateObject_3$
|
|
290
|
+
var templateObject_1$17, templateObject_2$y, templateObject_3$f, templateObject_4$c, templateObject_5$5;
|
|
291
291
|
|
|
292
292
|
var StyleSpinner = styled.div(templateObject_1$16 || (templateObject_1$16 = __makeTemplateObject(["\n margin: 0 10px 0 0;\n"], ["\n margin: 0 10px 0 0;\n"])));
|
|
293
293
|
var Button = function (props) {
|
|
@@ -1705,8 +1705,8 @@ var Details = styled.div(templateObject_2$x || (templateObject_2$x = __makeTempl
|
|
|
1705
1705
|
var hasHandler = _a.hasHandler;
|
|
1706
1706
|
return (hasHandler ? "".concat(withHandlerSpacing, "px") : "12px");
|
|
1707
1707
|
});
|
|
1708
|
-
var CloseHandler = styled.div(templateObject_3$
|
|
1709
|
-
var StyledAlert = styled(Flex)(templateObject_4$
|
|
1708
|
+
var CloseHandler = styled.div(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n border-radius: 0 16px 16px 0;\n right: 8px;\n position: absolute;\n top: 8px;\n"], ["\n border-radius: 0 16px 16px 0;\n right: 8px;\n position: absolute;\n top: 8px;\n"])));
|
|
1709
|
+
var StyledAlert = styled(Flex)(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n position: relative;\n background-color: ", ";\n border-radius: 16px;\n box-shadow: 0px 20px 36px -8px rgba(14, 14, 44, 0.1), 0px 1px 1px rgba(0, 0, 0, 0.05);\n"], ["\n position: relative;\n background-color: ", ";\n border-radius: 16px;\n box-shadow: 0px 20px 36px -8px rgba(14, 14, 44, 0.1), 0px 1px 1px rgba(0, 0, 0, 0.05);\n"])), function (_a) {
|
|
1710
1710
|
var theme = _a.theme;
|
|
1711
1711
|
return theme.alert.background;
|
|
1712
1712
|
});
|
|
@@ -1723,7 +1723,7 @@ var Alert = function (_a) {
|
|
|
1723
1723
|
React__default.createElement(IconButton, { scale: "sm", variant: "text", onClick: onClick },
|
|
1724
1724
|
React__default.createElement(Icon$1K, { width: "24px", color: "currentColor" }))))));
|
|
1725
1725
|
};
|
|
1726
|
-
var templateObject_1$12, templateObject_2$x, templateObject_3$
|
|
1726
|
+
var templateObject_1$12, templateObject_2$x, templateObject_3$e, templateObject_4$b;
|
|
1727
1727
|
|
|
1728
1728
|
var Grid = styled(Box)(templateObject_1$11 || (templateObject_1$11 = __makeTemplateObject(["\n display: grid;\n ", "\n ", "\n"], ["\n display: grid;\n ", "\n ", "\n"])), flexbox, grid);
|
|
1729
1729
|
var templateObject_1$11;
|
|
@@ -1793,7 +1793,7 @@ var UnitContainer = styled(Text)(templateObject_2$w || (templateObject_2$w = __m
|
|
|
1793
1793
|
var theme = _a.theme;
|
|
1794
1794
|
return theme.colors.textSubtle;
|
|
1795
1795
|
});
|
|
1796
|
-
var StyledBalanceInput = styled(Box)(templateObject_3$
|
|
1796
|
+
var StyledBalanceInput = styled(Box)(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 16px;\n box-shadow: ", ";\n padding: 8px 16px;\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 16px;\n box-shadow: ", ";\n padding: 8px 16px;\n"])), function (_a) {
|
|
1797
1797
|
var theme = _a.theme;
|
|
1798
1798
|
return theme.colors.input;
|
|
1799
1799
|
}, function (_a) {
|
|
@@ -1803,14 +1803,14 @@ var StyledBalanceInput = styled(Box)(templateObject_3$c || (templateObject_3$c =
|
|
|
1803
1803
|
var theme = _a.theme, isWarning = _a.isWarning;
|
|
1804
1804
|
return theme.shadows[isWarning ? "warning" : "inset"];
|
|
1805
1805
|
});
|
|
1806
|
-
var StyledInput$1 = styled(Input$1)(templateObject_4$
|
|
1806
|
+
var StyledInput$1 = styled(Input$1)(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n background: transparent;\n border-radius: 0;\n box-shadow: none;\n padding-left: 0;\n padding-right: 0;\n text-align: ", ";\n border: none;\n\n ::placeholder {\n color: ", ";\n }\n\n &:focus:not(:disabled) {\n box-shadow: none;\n }\n"], ["\n background: transparent;\n border-radius: 0;\n box-shadow: none;\n padding-left: 0;\n padding-right: 0;\n text-align: ", ";\n border: none;\n\n ::placeholder {\n color: ", ";\n }\n\n &:focus:not(:disabled) {\n box-shadow: none;\n }\n"])), function (_a) {
|
|
1807
1807
|
var _b = _a.textAlign, textAlign = _b === void 0 ? "right" : _b;
|
|
1808
1808
|
return textAlign;
|
|
1809
1809
|
}, function (_a) {
|
|
1810
1810
|
var theme = _a.theme;
|
|
1811
1811
|
return theme.colors.textSubtle;
|
|
1812
1812
|
});
|
|
1813
|
-
var templateObject_1$$, templateObject_2$w, templateObject_3$
|
|
1813
|
+
var templateObject_1$$, templateObject_2$w, templateObject_3$d, templateObject_4$a;
|
|
1814
1814
|
|
|
1815
1815
|
var BalanceInput = function (_a) {
|
|
1816
1816
|
var value = _a.value, _b = _a.placeholder, placeholder = _b === void 0 ? "0.0" : _b, onUserInput = _a.onUserInput, currencyValue = _a.currencyValue, inputProps = _a.inputProps, innerRef = _a.innerRef, _c = _a.isWarning, isWarning = _c === void 0 ? false : _c, _d = _a.decimals, decimals = _d === void 0 ? 18 : _d, unit = _a.unit, switchEditingUnits = _a.switchEditingUnits, props = __rest(_a, ["value", "placeholder", "onUserInput", "currencyValue", "inputProps", "innerRef", "isWarning", "decimals", "unit", "switchEditingUnits"]);
|
|
@@ -1949,7 +1949,7 @@ var getBorderColor = function (_a) {
|
|
|
1949
1949
|
}
|
|
1950
1950
|
return theme.colors.cardBorder;
|
|
1951
1951
|
};
|
|
1952
|
-
var StyledCard = styled.div(templateObject_3$
|
|
1952
|
+
var StyledCard = styled.div(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n background: ", ";\n border-radius: ", ";\n color: ", ";\n overflow: hidden;\n position: relative;\n\n ", "\n\n padding: 1px 1px 3px 1px;\n\n ", "\n"], ["\n background: ", ";\n border-radius: ", ";\n color: ", ";\n overflow: hidden;\n position: relative;\n\n ", "\n\n padding: 1px 1px 3px 1px;\n\n ", "\n"])), getBorderColor, function (_a) {
|
|
1953
1953
|
var theme = _a.theme;
|
|
1954
1954
|
return theme.radii.card;
|
|
1955
1955
|
}, function (_a) {
|
|
@@ -1959,7 +1959,7 @@ var StyledCard = styled.div(templateObject_3$b || (templateObject_3$b = __makeTe
|
|
|
1959
1959
|
var isActive = _a.isActive;
|
|
1960
1960
|
return isActive && css(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n animation: ", " 3s ease infinite;\n background-size: 400% 400%;\n "], ["\n animation: ", " 3s ease infinite;\n background-size: 400% 400%;\n "])), PromotedGradient);
|
|
1961
1961
|
}, space);
|
|
1962
|
-
var StyledCardInner = styled(Box)(templateObject_4$
|
|
1962
|
+
var StyledCardInner = styled(Box)(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n overflow: ", ";\n background: ", ";\n border-radius: ", ";\n"], ["\n width: 100%;\n height: 100%;\n overflow: ", ";\n background: ", ";\n border-radius: ", ";\n"])), function (_a) {
|
|
1963
1963
|
var hasCustomBorder = _a.hasCustomBorder;
|
|
1964
1964
|
return (hasCustomBorder ? "initial" : "inherit");
|
|
1965
1965
|
}, function (_a) {
|
|
@@ -1975,7 +1975,7 @@ StyledCard.defaultProps = {
|
|
|
1975
1975
|
isWarning: false,
|
|
1976
1976
|
isDisabled: false,
|
|
1977
1977
|
};
|
|
1978
|
-
var templateObject_1$X, templateObject_2$u, templateObject_3$
|
|
1978
|
+
var templateObject_1$X, templateObject_2$u, templateObject_3$c, templateObject_4$9;
|
|
1979
1979
|
|
|
1980
1980
|
var Card = function (_a) {
|
|
1981
1981
|
var ribbon = _a.ribbon, children = _a.children, background = _a.background, props = __rest(_a, ["ribbon", "children", "background"]);
|
|
@@ -2048,14 +2048,14 @@ var variant = {
|
|
|
2048
2048
|
|
|
2049
2049
|
var waves = keyframes(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n from {\n left: -150px;\n }\n to {\n left: 100%;\n }\n"], ["\n from {\n left: -150px;\n }\n to {\n left: 100%;\n }\n"])));
|
|
2050
2050
|
var pulse = keyframes(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.4;\n }\n 100% {\n opacity: 1;\n }\n"], ["\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.4;\n }\n 100% {\n opacity: 1;\n }\n"])));
|
|
2051
|
-
var Root = styled.div(templateObject_3$
|
|
2051
|
+
var Root = styled.div(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n min-height: 20px;\n display: block;\n background-color: ", ";\n border-radius: ", ";\n\n ", "\n ", "\n"], ["\n min-height: 20px;\n display: block;\n background-color: ", ";\n border-radius: ", ";\n\n ", "\n ", "\n"])), function (_a) {
|
|
2052
2052
|
var theme = _a.theme;
|
|
2053
2053
|
return theme.colors.backgroundDisabled;
|
|
2054
2054
|
}, function (_a) {
|
|
2055
2055
|
var variant$1 = _a.variant, theme = _a.theme;
|
|
2056
2056
|
return (variant$1 === variant.CIRCLE ? theme.radii.circle : theme.radii.small);
|
|
2057
2057
|
}, layout, space);
|
|
2058
|
-
var Pulse = styled(Root)(templateObject_4$
|
|
2058
|
+
var Pulse = styled(Root)(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n animation: ", " 2s infinite ease-out;\n transform: translate3d(0, 0, 0);\n"], ["\n animation: ", " 2s infinite ease-out;\n transform: translate3d(0, 0, 0);\n"])), pulse);
|
|
2059
2059
|
var Waves = styled(Root)(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n position: relative;\n overflow: hidden;\n transform: translate3d(0, 0, 0);\n &:before {\n content: \"\";\n position: absolute;\n background-image: linear-gradient(90deg, transparent, rgba(243, 243, 243, 0.5), transparent);\n top: 0;\n left: -150px;\n height: 100%;\n width: 150px;\n animation: ", " 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;\n }\n"], ["\n position: relative;\n overflow: hidden;\n transform: translate3d(0, 0, 0);\n &:before {\n content: \"\";\n position: absolute;\n background-image: linear-gradient(90deg, transparent, rgba(243, 243, 243, 0.5), transparent);\n top: 0;\n left: -150px;\n height: 100%;\n width: 150px;\n animation: ", " 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;\n }\n"])), waves);
|
|
2060
2060
|
var Skeleton = function (_a) {
|
|
2061
2061
|
var _b = _a.variant, variant$1 = _b === void 0 ? variant.RECT : _b, _c = _a.animation, animation$1 = _c === void 0 ? animation.PULSE : _c, props = __rest(_a, ["variant", "animation"]);
|
|
@@ -2064,7 +2064,7 @@ var Skeleton = function (_a) {
|
|
|
2064
2064
|
}
|
|
2065
2065
|
return React__default.createElement(Pulse, __assign({ variant: variant$1 }, props));
|
|
2066
2066
|
};
|
|
2067
|
-
var templateObject_1$S, templateObject_2$t, templateObject_3$
|
|
2067
|
+
var templateObject_1$S, templateObject_2$t, templateObject_3$b, templateObject_4$8, templateObject_5$4;
|
|
2068
2068
|
|
|
2069
2069
|
var PriceLink = styled.a(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n display: flex;\n align-items: center;\n svg {\n transition: transform 0.3s;\n }\n :hover {\n svg {\n transform: scale(1.2);\n }\n }\n"], ["\n display: flex;\n align-items: center;\n svg {\n transition: transform 0.3s;\n }\n :hover {\n svg {\n transform: scale(1.2);\n }\n }\n"])));
|
|
2070
2070
|
var CakePrice = function (_a) {
|
|
@@ -2496,7 +2496,7 @@ var Message = function (_a) {
|
|
|
2496
2496
|
var templateObject_1$B;
|
|
2497
2497
|
|
|
2498
2498
|
var NotificationDotRoot = styled.span(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n display: inline-flex;\n position: relative;\n"], ["\n display: inline-flex;\n position: relative;\n"])));
|
|
2499
|
-
var Dot = styled.span(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n display: ", ";\n position: absolute;\n top: 0;\n right: 0;\n width: 10px;\n height: 10px;\n pointer-events: none;\n border: 2px solid ", ";\n border-radius: 50%;\n background-color: ", ";\n"], ["\n display: ", ";\n position: absolute;\n top: 0;\n right: 0;\n width: 10px;\n height: 10px;\n pointer-events: none;\n border: 2px solid ", ";\n border-radius: 50%;\n background-color: ", ";\n"])), function (_a) {
|
|
2499
|
+
var Dot$1 = styled.span(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n display: ", ";\n position: absolute;\n top: 0;\n right: 0;\n width: 10px;\n height: 10px;\n pointer-events: none;\n border: 2px solid ", ";\n border-radius: 50%;\n background-color: ", ";\n"], ["\n display: ", ";\n position: absolute;\n top: 0;\n right: 0;\n width: 10px;\n height: 10px;\n pointer-events: none;\n border: 2px solid ", ";\n border-radius: 50%;\n background-color: ", ";\n"])), function (_a) {
|
|
2500
2500
|
var show = _a.show;
|
|
2501
2501
|
return (show ? "inline-flex" : "none");
|
|
2502
2502
|
}, function (_a) {
|
|
@@ -2510,7 +2510,7 @@ var NotificationDot = function (_a) {
|
|
|
2510
2510
|
var _b = _a.show, show = _b === void 0 ? false : _b, _c = _a.color, color = _c === void 0 ? "failure" : _c, children = _a.children, props = __rest(_a, ["show", "color", "children"]);
|
|
2511
2511
|
return (React__default.createElement(NotificationDotRoot, null,
|
|
2512
2512
|
Children.map(children, function (child) { return cloneElement(child, props); }),
|
|
2513
|
-
React__default.createElement(Dot, { show: show, color: color })));
|
|
2513
|
+
React__default.createElement(Dot$1, { show: show, color: color })));
|
|
2514
2514
|
};
|
|
2515
2515
|
var templateObject_1$A, templateObject_2$n;
|
|
2516
2516
|
|
|
@@ -2615,14 +2615,14 @@ var PancakeInput = styled.input(templateObject_2$m || (templateObject_2$m = __ma
|
|
|
2615
2615
|
var theme = _a.theme;
|
|
2616
2616
|
return theme.shadows.focus;
|
|
2617
2617
|
}, getScale$2("travelDistance"), getScale$2("pancakeThickness"), getScale$2("pancakeThickness"));
|
|
2618
|
-
var PancakeLabel = styled.label(templateObject_3$
|
|
2618
|
+
var PancakeLabel = styled.label(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n background: ", ";\n box-shadow: ", ";\n display: inline-block;\n border-radius: 50px;\n position: relative;\n transition: all 0.3s ease;\n transform-origin: 20% center;\n cursor: pointer;\n"], ["\n width: ", ";\n height: ", ";\n background: ", ";\n box-shadow: ", ";\n display: inline-block;\n border-radius: 50px;\n position: relative;\n transition: all 0.3s ease;\n transform-origin: 20% center;\n cursor: pointer;\n"])), getScale$2("toggleWidth"), getScale$2("toggleHeight"), function (_a) {
|
|
2619
2619
|
var theme = _a.theme, checked = _a.checked;
|
|
2620
2620
|
return theme.colors[checked ? "success" : "input"];
|
|
2621
2621
|
}, function (_a) {
|
|
2622
2622
|
var theme = _a.theme;
|
|
2623
2623
|
return theme.shadows.inset;
|
|
2624
2624
|
});
|
|
2625
|
-
var templateObject_1$y, templateObject_2$m, templateObject_3$
|
|
2625
|
+
var templateObject_1$y, templateObject_2$m, templateObject_3$a;
|
|
2626
2626
|
|
|
2627
2627
|
var PancakeToggle = function (_a) {
|
|
2628
2628
|
var checked = _a.checked, _b = _a.scale, scale = _b === void 0 ? scales$4.LG : _b, props = __rest(_a, ["checked", "scale"]);
|
|
@@ -2959,11 +2959,11 @@ var SliderLabel = styled(Text)(templateObject_2$k || (templateObject_2$k = __mak
|
|
|
2959
2959
|
var progress = _a.progress;
|
|
2960
2960
|
return progress;
|
|
2961
2961
|
});
|
|
2962
|
-
var BunnyButt = styled.div(templateObject_3$
|
|
2962
|
+
var BunnyButt = styled.div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n background: url(", ") no-repeat;\n height: 32px;\n filter: ", ";\n position: absolute;\n width: 15px;\n"], ["\n background: url(", ") no-repeat;\n height: 32px;\n filter: ", ";\n position: absolute;\n width: 15px;\n"])), bunnyButt, function (_a) {
|
|
2963
2963
|
var disabled = _a.disabled;
|
|
2964
2964
|
return (disabled ? "grayscale(100%)" : "none");
|
|
2965
2965
|
});
|
|
2966
|
-
var BunnySlider = styled.div(templateObject_4$
|
|
2966
|
+
var BunnySlider = styled.div(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n position: absolute;\n left: 14px;\n width: calc(100% - 14px);\n"], ["\n position: absolute;\n left: 14px;\n width: calc(100% - 14px);\n"])));
|
|
2967
2967
|
var StyledInput = styled.input(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n cursor: ", ";\n height: 32px;\n position: relative;\n\n ::-webkit-slider-thumb {\n ", "\n }\n\n ::-moz-range-thumb {\n ", "\n }\n\n ::-ms-thumb {\n ", "\n }\n"], ["\n cursor: ", ";\n height: 32px;\n position: relative;\n\n ::-webkit-slider-thumb {\n ", "\n }\n\n ::-moz-range-thumb {\n ", "\n }\n\n ::-ms-thumb {\n ", "\n }\n"])), getCursorStyle, getBaseThumbStyles, getBaseThumbStyles, getBaseThumbStyles);
|
|
2968
2968
|
var BarBackground = styled.div(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject(["\n background-color: ", ";\n height: 2px;\n position: absolute;\n top: 18px;\n width: 100%;\n"], ["\n background-color: ", ";\n height: 2px;\n position: absolute;\n top: 18px;\n width: 100%;\n"])), function (_a) {
|
|
2969
2969
|
var theme = _a.theme, disabled = _a.disabled;
|
|
@@ -2976,7 +2976,7 @@ var BarProgress = styled.div(templateObject_7$2 || (templateObject_7$2 = __makeT
|
|
|
2976
2976
|
var disabled = _a.disabled;
|
|
2977
2977
|
return (disabled ? "grayscale(100%)" : "none");
|
|
2978
2978
|
});
|
|
2979
|
-
var templateObject_1$u, templateObject_2$k, templateObject_3$
|
|
2979
|
+
var templateObject_1$u, templateObject_2$k, templateObject_3$9, templateObject_4$7, templateObject_5$3, templateObject_6$2, templateObject_7$2;
|
|
2980
2980
|
|
|
2981
2981
|
var Slider = function (_a) {
|
|
2982
2982
|
var name = _a.name, min = _a.min, max = _a.max, value = _a.value, onValueChanged = _a.onValueChanged, valueLabel = _a.valueLabel, _b = _a.step, step = _b === void 0 ? "any" : _b, _c = _a.disabled, disabled = _c === void 0 ? false : _c, props = __rest(_a, ["name", "min", "max", "value", "onValueChanged", "valueLabel", "step", "disabled"]);
|
|
@@ -3049,14 +3049,14 @@ var Connector = styled.div(templateObject_2$j || (templateObject_2$j = __makeTem
|
|
|
3049
3049
|
var theme = _a.theme, status = _a.status;
|
|
3050
3050
|
return theme.colors[status === "past" || status === "current" ? "success" : "textDisabled"];
|
|
3051
3051
|
});
|
|
3052
|
-
var ChildrenWrapper = styled(Box)(templateObject_3$
|
|
3052
|
+
var ChildrenWrapper = styled(Box)(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n ", " {\n visibility: ", ";\n }\n"], ["\n ", " {\n visibility: ", ";\n }\n"])), function (_a) {
|
|
3053
3053
|
var theme = _a.theme;
|
|
3054
3054
|
return theme.mediaQueries.md;
|
|
3055
3055
|
}, function (_a) {
|
|
3056
3056
|
var isVisible = _a.isVisible;
|
|
3057
3057
|
return (isVisible ? "visible" : "hidden");
|
|
3058
3058
|
});
|
|
3059
|
-
var ChildrenLeftWrapper = styled(ChildrenWrapper)(templateObject_4$
|
|
3059
|
+
var ChildrenLeftWrapper = styled(ChildrenWrapper)(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n display: none;\n ", " {\n display: block;\n margin-right: 16px;\n }\n"], ["\n display: none;\n ", " {\n display: block;\n margin-right: 16px;\n }\n"])), function (_a) {
|
|
3060
3060
|
var theme = _a.theme;
|
|
3061
3061
|
return theme.mediaQueries.md;
|
|
3062
3062
|
});
|
|
@@ -3095,7 +3095,7 @@ var Step = function (_a) {
|
|
|
3095
3095
|
!isFirst && !isLast && React__default.createElement(Connector, { "$isFirstStep": isFirst, "$isLastStep": isLast, status: statusSecondPart })),
|
|
3096
3096
|
React__default.createElement(ChildrenRightWrapper, { isVisible: isIndexPair }, children)));
|
|
3097
3097
|
};
|
|
3098
|
-
var templateObject_1$s, templateObject_2$j, templateObject_3$
|
|
3098
|
+
var templateObject_1$s, templateObject_2$j, templateObject_3$8, templateObject_4$6, templateObject_5$2, templateObject_6$1, templateObject_7$1;
|
|
3099
3099
|
|
|
3100
3100
|
var InlineMenuContainer = styled(Box)(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n background-color: ", ";\n border-radius: ", ";\n box-shadow: ", ";\n"], ["\n background-color: ", ";\n border-radius: ", ";\n box-shadow: ", ";\n"])), function (_a) {
|
|
3101
3101
|
var theme = _a.theme;
|
|
@@ -3117,15 +3117,15 @@ var SubMenuContainer = styled(Flex)(templateObject_2$i || (templateObject_2$i =
|
|
|
3117
3117
|
var theme = _a.theme;
|
|
3118
3118
|
return "1px solid ".concat(theme.colors.inputSecondary);
|
|
3119
3119
|
});
|
|
3120
|
-
var ClickableElementContainer = styled.div(templateObject_3$
|
|
3121
|
-
var SubMenuItem = styled.button(templateObject_4$
|
|
3120
|
+
var ClickableElementContainer = styled.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n cursor: pointer;\n display: inline-flex;\n"], ["\n cursor: pointer;\n display: inline-flex;\n"])));
|
|
3121
|
+
var SubMenuItem = styled.button(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n border: 0;\n outline: 0;\n cursor: pointer;\n background: transparent;\n padding: 8px 16px;\n color: ", ";\n width: 100%;\n font-size: 16px;\n text-align: left;\n\n &:hover {\n background-color: ", ";\n text-decoration: none;\n }\n"], ["\n border: 0;\n outline: 0;\n cursor: pointer;\n background: transparent;\n padding: 8px 16px;\n color: ", ";\n width: 100%;\n font-size: 16px;\n text-align: left;\n\n &:hover {\n background-color: ", ";\n text-decoration: none;\n }\n"])), function (_a) {
|
|
3122
3122
|
var theme = _a.theme;
|
|
3123
3123
|
return theme.colors.text;
|
|
3124
3124
|
}, function (_a) {
|
|
3125
3125
|
var theme = _a.theme;
|
|
3126
3126
|
return theme.colors.inputSecondary;
|
|
3127
3127
|
});
|
|
3128
|
-
var templateObject_1$r, templateObject_2$i, templateObject_3$
|
|
3128
|
+
var templateObject_1$r, templateObject_2$i, templateObject_3$7, templateObject_4$5;
|
|
3129
3129
|
|
|
3130
3130
|
var portalRoot$1 = document.getElementById("portal-root");
|
|
3131
3131
|
var BaseMenu = function (_a) {
|
|
@@ -3652,14 +3652,14 @@ var Input = styled.input(templateObject_2$f || (templateObject_2$f = __makeTempl
|
|
|
3652
3652
|
var theme = _a.theme;
|
|
3653
3653
|
return theme.shadows.focus;
|
|
3654
3654
|
});
|
|
3655
|
-
var StyledToggle = styled.div(templateObject_3$
|
|
3655
|
+
var StyledToggle = styled.div(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border-radius: 24px;\n box-shadow: ", ";\n cursor: pointer;\n display: inline-flex;\n height: ", ";\n position: relative;\n transition: background-color 200ms;\n width: ", ";\n"], ["\n align-items: center;\n background-color: ", ";\n border-radius: 24px;\n box-shadow: ", ";\n cursor: pointer;\n display: inline-flex;\n height: ", ";\n position: relative;\n transition: background-color 200ms;\n width: ", ";\n"])), function (_a) {
|
|
3656
3656
|
var theme = _a.theme, $checked = _a.$checked, $checkedColor = _a.$checkedColor, $defaultColor = _a.$defaultColor;
|
|
3657
3657
|
return theme.colors[$checked ? $checkedColor : $defaultColor];
|
|
3658
3658
|
}, function (_a) {
|
|
3659
3659
|
var theme = _a.theme;
|
|
3660
3660
|
return theme.shadows.inset;
|
|
3661
3661
|
}, getScale("toggleHeight"), getScale("toggleWidth"));
|
|
3662
|
-
var templateObject_1$m, templateObject_2$f, templateObject_3$
|
|
3662
|
+
var templateObject_1$m, templateObject_2$f, templateObject_3$6;
|
|
3663
3663
|
|
|
3664
3664
|
var Toggle = function (_a) {
|
|
3665
3665
|
var checked = _a.checked, _b = _a.defaultColor, defaultColor = _b === void 0 ? "input" : _b, _c = _a.checkedColor, checkedColor = _c === void 0 ? "success" : _c, _d = _a.scale, scale = _d === void 0 ? scales$1.LG : _d, startIcon = _a.startIcon, endIcon = _a.endIcon, props = __rest(_a, ["checked", "defaultColor", "checkedColor", "scale", "startIcon", "endIcon"]);
|
|
@@ -4242,7 +4242,7 @@ var ModalHeader = styled.div(templateObject_1$g || (templateObject_1$g = __makeT
|
|
|
4242
4242
|
return theme.colors.cardBorder;
|
|
4243
4243
|
});
|
|
4244
4244
|
var ModalTitle = styled(Flex)(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n align-items: center;\n flex: 1;\n"], ["\n align-items: center;\n flex: 1;\n"])));
|
|
4245
|
-
var ModalBody = styled(Flex)(templateObject_3$
|
|
4245
|
+
var ModalBody = styled(Flex)(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n flex-direction: column;\n max-height: 90vh;\n overflow-y: auto;\n"], ["\n flex-direction: column;\n max-height: 90vh;\n overflow-y: auto;\n"])));
|
|
4246
4246
|
var ModalCloseButton = function (_a) {
|
|
4247
4247
|
var onDismiss = _a.onDismiss;
|
|
4248
4248
|
return (React__default.createElement(IconButton, { variant: "text", onClick: onDismiss, "aria-label": "Close the dialog" },
|
|
@@ -4253,7 +4253,7 @@ var ModalBackButton = function (_a) {
|
|
|
4253
4253
|
return (React__default.createElement(IconButton, { variant: "text", onClick: onBack, "area-label": "go back", mr: "8px" },
|
|
4254
4254
|
React__default.createElement(Icon$29, { color: "primary" })));
|
|
4255
4255
|
};
|
|
4256
|
-
var ModalContainer = styled(Box)(templateObject_4$
|
|
4256
|
+
var ModalContainer = styled(Box)(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n overflow: hidden;\n background: ", ";\n box-shadow: 0px 20px 36px -8px rgba(14, 14, 44, 0.1), 0px 1px 1px rgba(0, 0, 0, 0.05);\n border: 1px solid ", ";\n border-radius: 32px;\n width: 100%;\n max-height: 100vh;\n z-index: ", ";\n\n ", " {\n width: auto;\n min-width: ", ";\n max-width: 100%;\n }\n"], ["\n overflow: hidden;\n background: ", ";\n box-shadow: 0px 20px 36px -8px rgba(14, 14, 44, 0.1), 0px 1px 1px rgba(0, 0, 0, 0.05);\n border: 1px solid ", ";\n border-radius: 32px;\n width: 100%;\n max-height: 100vh;\n z-index: ", ";\n\n ", " {\n width: auto;\n min-width: ", ";\n max-width: 100%;\n }\n"])), function (_a) {
|
|
4257
4257
|
var theme = _a.theme;
|
|
4258
4258
|
return theme.modal.background;
|
|
4259
4259
|
}, function (_a) {
|
|
@@ -4269,7 +4269,7 @@ var ModalContainer = styled(Box)(templateObject_4$3 || (templateObject_4$3 = __m
|
|
|
4269
4269
|
var minWidth = _a.minWidth;
|
|
4270
4270
|
return minWidth;
|
|
4271
4271
|
});
|
|
4272
|
-
var templateObject_1$g, templateObject_2$b, templateObject_3$
|
|
4272
|
+
var templateObject_1$g, templateObject_2$b, templateObject_3$5, templateObject_4$4;
|
|
4273
4273
|
|
|
4274
4274
|
var Modal = function (_a) {
|
|
4275
4275
|
var title = _a.title, onDismiss = _a.onDismiss, onBack = _a.onBack, children = _a.children, _b = _a.hideCloseButton, hideCloseButton = _b === void 0 ? false : _b, _c = _a.bodyPadding, bodyPadding = _c === void 0 ? "24px" : _c, _d = _a.headerBackground, headerBackground = _d === void 0 ? "transparent" : _d, _e = _a.minWidth, minWidth = _e === void 0 ? "320px" : _e, props = __rest(_a, ["title", "onDismiss", "onBack", "children", "hideCloseButton", "bodyPadding", "headerBackground", "minWidth"]);
|
|
@@ -4466,11 +4466,11 @@ var DropdownMenuItem = styled.button(templateObject_1$b || (templateObject_1$b =
|
|
|
4466
4466
|
return theme.colors.tertiary;
|
|
4467
4467
|
});
|
|
4468
4468
|
var StyledDropdownMenuItemContainer = styled.div(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n &:first-child > ", " {\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n }\n\n &:last-child > ", " {\n border-bottom-left-radius: 8px;\n border-bottom-right-radius: 8px;\n }\n"], ["\n &:first-child > ", " {\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n }\n\n &:last-child > ", " {\n border-bottom-left-radius: 8px;\n border-bottom-right-radius: 8px;\n }\n"])), DropdownMenuItem, DropdownMenuItem);
|
|
4469
|
-
var DropdownMenuDivider = styled.hr(templateObject_3$
|
|
4469
|
+
var DropdownMenuDivider = styled.hr(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n border-color: ", ";\n border-style: solid;\n border-width: 1px 0 0;\n margin: 4px 0;\n"], ["\n border-color: ", ";\n border-style: solid;\n border-width: 1px 0 0;\n margin: 4px 0;\n"])), function (_a) {
|
|
4470
4470
|
var theme = _a.theme;
|
|
4471
4471
|
return theme.colors.cardBorder;
|
|
4472
4472
|
});
|
|
4473
|
-
var StyledDropdownMenu = styled.div(templateObject_4$
|
|
4473
|
+
var StyledDropdownMenu = styled.div(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject(["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 16px;\n padding-bottom: 4px;\n padding-top: 4px;\n pointer-events: auto;\n width: ", ";\n visibility: visible;\n z-index: 1001;\n\n ", "\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 16px;\n padding-bottom: 4px;\n padding-top: 4px;\n pointer-events: auto;\n width: ", ";\n visibility: visible;\n z-index: 1001;\n\n ", "\n"])), function (_a) {
|
|
4474
4474
|
var theme = _a.theme;
|
|
4475
4475
|
return theme.card.background;
|
|
4476
4476
|
}, function (_a) {
|
|
@@ -4494,7 +4494,7 @@ var LinkStatus = styled(Text)(templateObject_5$1 || (templateObject_5$1 = __make
|
|
|
4494
4494
|
var theme = _a.theme, color = _a.color;
|
|
4495
4495
|
return theme.colors[color];
|
|
4496
4496
|
});
|
|
4497
|
-
var templateObject_1$b, templateObject_2$7, templateObject_3$
|
|
4497
|
+
var templateObject_1$b, templateObject_2$7, templateObject_3$4, templateObject_4$3, templateObject_5$1;
|
|
4498
4498
|
|
|
4499
4499
|
var DropdownMenuItemType;
|
|
4500
4500
|
(function (DropdownMenuItemType) {
|
|
@@ -4837,8 +4837,8 @@ styled.ul(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n
|
|
|
4837
4837
|
var theme = _a.theme;
|
|
4838
4838
|
return theme.mediaQueries.md;
|
|
4839
4839
|
});
|
|
4840
|
-
styled.li(templateObject_3$
|
|
4841
|
-
styled(Box)(templateObject_4$
|
|
4840
|
+
styled.li(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n font-size: 16px;\n margin-bottom: 8px;\n text-transform: capitalize;\n\n &:first-child {\n color: ", ";\n font-weight: 600;\n text-transform: uppercase;\n }\n"], ["\n font-size: 16px;\n margin-bottom: 8px;\n text-transform: capitalize;\n\n &:first-child {\n color: ", ";\n font-weight: 600;\n text-transform: uppercase;\n }\n"])), darkColors.secondary);
|
|
4841
|
+
styled(Box)(templateObject_4$2 || (templateObject_4$2 = __makeTemplateObject(["\n margin-bottom: 24px;\n"], ["\n margin-bottom: 24px;\n"])));
|
|
4842
4842
|
var StyledToolsContainer = styled(Flex)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n border-top: 1px solid ", ";\n padding: 42px 0;\n"], ["\n border-top: 1px solid ", ";\n padding: 42px 0;\n"])), lightColors.cardBorder);
|
|
4843
4843
|
var StyledSocialLinks = styled(SocialLinks$1)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n border-bottom: 1px solid ", ";\n"], ["\n border-bottom: 1px solid ", ";\n"])), darkColors.cardBorder);
|
|
4844
4844
|
var StyledPrivacyLinks = styled(PrivacyLinks$1)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n border-bottom: 1px solid ", ";\n"], ["\n border-bottom: 1px solid ", ";\n"])), darkColors.cardBorder);
|
|
@@ -4847,7 +4847,7 @@ var StyledFooterMenuLinks = styled(FooterMenuLinks$1)(templateObject_8 || (templ
|
|
|
4847
4847
|
return (theme.devicesQueries.mobile ? "30px" : 0);
|
|
4848
4848
|
});
|
|
4849
4849
|
styled.span(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n color: ", ";\n"], ["\n color: ", ";\n"])), darkColors.text);
|
|
4850
|
-
var templateObject_1$a, templateObject_2$6, templateObject_3$
|
|
4850
|
+
var templateObject_1$a, templateObject_2$6, templateObject_3$3, templateObject_4$2, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;
|
|
4851
4851
|
|
|
4852
4852
|
var MenuItem = function (_a) {
|
|
4853
4853
|
var items = _a.items, props = __rest(_a, ["items"]);
|
|
@@ -5089,8 +5089,8 @@ var StyledNav = styled.nav(templateObject_2$4 || (templateObject_2$4 = __makeTem
|
|
|
5089
5089
|
var theme = _a.theme;
|
|
5090
5090
|
return theme.colors.cardBorder;
|
|
5091
5091
|
});
|
|
5092
|
-
var BodyWrapper = styled(Box)(templateObject_3$
|
|
5093
|
-
var Inner = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n flex-grow: 1;\n transition: margin-top 0.2s, margin-left 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n transform: translate3d(0, 0, 0);\n max-width: 100%;\n"], ["\n flex-grow: 1;\n transition: margin-top 0.2s, margin-left 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n transform: translate3d(0, 0, 0);\n max-width: 100%;\n"])));
|
|
5092
|
+
var BodyWrapper = styled(Box)(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n position: relative;\n display: flex;\n"], ["\n position: relative;\n display: flex;\n"])));
|
|
5093
|
+
var Inner = styled.div(templateObject_4$1 || (templateObject_4$1 = __makeTemplateObject(["\n flex-grow: 1;\n transition: margin-top 0.2s, margin-left 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n transform: translate3d(0, 0, 0);\n max-width: 100%;\n"], ["\n flex-grow: 1;\n transition: margin-top 0.2s, margin-left 0.2s cubic-bezier(0.4, 0, 0.2, 1);\n transform: translate3d(0, 0, 0);\n max-width: 100%;\n"])));
|
|
5094
5094
|
var Menu$1 = function (_a) {
|
|
5095
5095
|
var _b;
|
|
5096
5096
|
var userMenu = _a.userMenu, globalMenu = _a.globalMenu, isDark = _a.isDark, toggleTheme = _a.toggleTheme, currentLang = _a.currentLang, setLang = _a.setLang, cakePriceUsd = _a.cakePriceUsd, links = _a.links, subLinks = _a.subLinks, footerLinks = _a.footerLinks, activeItem = _a.activeItem, activeSubItem = _a.activeSubItem, langs = _a.langs, buyCakeLabel = _a.buyCakeLabel, children = _a.children;
|
|
@@ -5145,13 +5145,14 @@ var Menu$1 = function (_a) {
|
|
|
5145
5145
|
React__default.createElement(MenuItem, { items: footerLinks, isDark: isDark, toggleTheme: toggleTheme, langs: langs, setLang: setLang, currentLang: currentLang, cakePriceUsd: cakePriceUsd, buyCakeLabel: buyCakeLabel, mb: ["".concat(MOBILE_MENU_HEIGHT, "px"), null, "0px"] }))),
|
|
5146
5146
|
isMobile && React__default.createElement(BottomNav, { items: links, activeItem: activeItem, activeSubItem: activeSubItem })));
|
|
5147
5147
|
};
|
|
5148
|
-
var templateObject_1$7, templateObject_2$4, templateObject_3$
|
|
5148
|
+
var templateObject_1$7, templateObject_2$4, templateObject_3$2, templateObject_4$1;
|
|
5149
5149
|
|
|
5150
5150
|
var variants = {
|
|
5151
5151
|
DEFAULT: "default",
|
|
5152
5152
|
WARNING: "warning",
|
|
5153
5153
|
DANGER: "danger",
|
|
5154
5154
|
PENDING: "pending",
|
|
5155
|
+
SUCCESS: "success",
|
|
5155
5156
|
};
|
|
5156
5157
|
|
|
5157
5158
|
var MenuIconWrapper = styled.div(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject(["\n align-items: center;\n background-color: ", ";\n border-color: ", ";\n border-radius: 50%;\n border-style: solid;\n border-width: 2px;\n display: flex;\n height: 40px;\n justify-content: center;\n left: 0;\n position: absolute;\n top: -4px;\n width: 40px;\n z-index: 102;\n"], ["\n align-items: center;\n background-color: ", ";\n border-color: ", ";\n border-radius: 50%;\n border-style: solid;\n border-width: 2px;\n display: flex;\n height: 40px;\n justify-content: center;\n left: 0;\n position: absolute;\n top: -4px;\n width: 40px;\n z-index: 102;\n"])), function (_a) {
|
|
@@ -5162,31 +5163,40 @@ var MenuIconWrapper = styled.div(templateObject_1$6 || (templateObject_1$6 = __m
|
|
|
5162
5163
|
return theme.colors[borderColor];
|
|
5163
5164
|
});
|
|
5164
5165
|
var ProfileIcon = styled(Image)(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n left: 0;\n position: absolute;\n top: -4px;\n z-index: 102;\n\n & > img {\n border-radius: 50%;\n }\n"], ["\n left: 0;\n position: absolute;\n top: -4px;\n z-index: 102;\n\n & > img {\n border-radius: 50%;\n }\n"])));
|
|
5165
|
-
var
|
|
5166
|
-
|
|
5166
|
+
var DotWrapper = styled.span(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
|
|
5167
|
+
var Dot = styled.span(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n align-items: center;\n background: rgba(255,54,54,.4);\n border-radius: 100%;\n display: block;\n display: flex;\n height: 8px;\n justify-content: center;\n position: absolute;\n right: -5px;\n top: 0;\n width: 8px;\n &:after{\n background: #ff3636;\n border-radius: 100%;\n content: \" \";\n display: block;\n height: 4px;\n width: 4px;\n }\n"], ["\n align-items: center;\n background: rgba(255,54,54,.4);\n border-radius: 100%;\n display: block;\n display: flex;\n height: 8px;\n justify-content: center;\n position: absolute;\n right: -5px;\n top: 0;\n width: 8px;\n &:after{\n background: #ff3636;\n border-radius: 100%;\n content: \" \";\n display: block;\n height: 4px;\n width: 4px;\n }\n"])));
|
|
5168
|
+
var NoProfileMenuIcon = function (_a) {
|
|
5169
|
+
var isWarning = _a.isWarning;
|
|
5170
|
+
return (React__default.createElement(MenuIconWrapper, { borderColor: "primary" }, isWarning ? React__default.createElement(DotWrapper, null,
|
|
5171
|
+
React__default.createElement(Icon$k, { color: "primary", width: "24px" }),
|
|
5172
|
+
React__default.createElement(Dot, null)) : React__default.createElement(Icon$k, { color: "primary", width: "24px" })));
|
|
5173
|
+
};
|
|
5167
5174
|
var PendingMenuIcon = function () { return (React__default.createElement(MenuIconWrapper, { borderColor: "secondary" },
|
|
5168
5175
|
React__default.createElement(Icon$V, { color: "secondary", width: "24px", spin: true }))); };
|
|
5169
|
-
var WarningMenuIcon = function () { return (React__default.createElement(MenuIconWrapper, { borderColor: "warning" },
|
|
5170
|
-
React__default.createElement(Icon$n, { color: "warning", width: "24px" }))); };
|
|
5171
5176
|
var DangerMenuIcon = function () { return (React__default.createElement(MenuIconWrapper, { borderColor: "failure" },
|
|
5172
5177
|
React__default.createElement(Icon$n, { color: "failure", width: "24px" }))); };
|
|
5178
|
+
var SuccessMenuIcon = function () { return (React__default.createElement(MenuIconWrapper, { borderColor: "primary" },
|
|
5179
|
+
React__default.createElement(Icon$1Q, { color: "success", width: "24px" }))); };
|
|
5173
5180
|
var MenuIcon = function (_a) {
|
|
5174
5181
|
var avatarSrc = _a.avatarSrc, variant = _a.variant;
|
|
5175
5182
|
if (variant === variants.DANGER) {
|
|
5176
5183
|
return React__default.createElement(DangerMenuIcon, null);
|
|
5177
5184
|
}
|
|
5178
5185
|
if (variant === variants.WARNING) {
|
|
5179
|
-
return React__default.createElement(
|
|
5186
|
+
return React__default.createElement(NoProfileMenuIcon, { isWarning: true });
|
|
5180
5187
|
}
|
|
5181
5188
|
if (variant === variants.PENDING) {
|
|
5182
5189
|
return React__default.createElement(PendingMenuIcon, null);
|
|
5183
5190
|
}
|
|
5191
|
+
if (variant === variants.SUCCESS) {
|
|
5192
|
+
return React__default.createElement(SuccessMenuIcon, null);
|
|
5193
|
+
}
|
|
5184
5194
|
if (!avatarSrc) {
|
|
5185
5195
|
return React__default.createElement(NoProfileMenuIcon, null);
|
|
5186
5196
|
}
|
|
5187
5197
|
return React__default.createElement(ProfileIcon, { src: avatarSrc, height: 40, width: 40 });
|
|
5188
5198
|
};
|
|
5189
|
-
var templateObject_1$6, templateObject_2$3;
|
|
5199
|
+
var templateObject_1$6, templateObject_2$3, templateObject_3$1, templateObject_4;
|
|
5190
5200
|
|
|
5191
5201
|
var UserMenuDivider = styled.hr(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n border-color: ", ";\n border-style: solid;\n border-width: 1px 0 0;\n margin: 4px 0;\n"], ["\n border-color: ", ";\n border-style: solid;\n border-width: 1px 0 0;\n margin: 4px 0;\n"])), function (_a) {
|
|
5192
5202
|
var theme = _a.theme;
|
|
@@ -1,9 +1,12 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { Variant } from "./types";
|
|
3
|
-
export declare const NoProfileMenuIcon: React.FC
|
|
3
|
+
export declare const NoProfileMenuIcon: React.FC<{
|
|
4
|
+
isWarning?: boolean;
|
|
5
|
+
}>;
|
|
4
6
|
export declare const PendingMenuIcon: React.FC;
|
|
5
7
|
export declare const WarningMenuIcon: React.FC;
|
|
6
8
|
export declare const DangerMenuIcon: React.FC;
|
|
9
|
+
export declare const SuccessMenuIcon: React.FC;
|
|
7
10
|
declare const MenuIcon: React.FC<{
|
|
8
11
|
avatarSrc?: string;
|
|
9
12
|
variant: Variant;
|
|
@@ -4,6 +4,7 @@ export declare const variants: {
|
|
|
4
4
|
readonly WARNING: "warning";
|
|
5
5
|
readonly DANGER: "danger";
|
|
6
6
|
readonly PENDING: "pending";
|
|
7
|
+
readonly SUCCESS: "success";
|
|
7
8
|
};
|
|
8
9
|
export declare type Variant = typeof variants[keyof typeof variants];
|
|
9
10
|
export interface UserMenuProps extends FlexProps {
|