@typeolymp/ui-components 1.14.3 → 1.15.0
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/build/components/atoms/Icon/index.d.ts +1 -1
- package/build/components/organisms/Transfer/index.d.ts +13 -0
- package/build/components/organisms/Transfer/stories.d.ts +19 -0
- package/build/components/organisms/Transfer/styles.d.ts +3 -0
- package/build/index.d.ts +2 -1
- package/build/index.es.js +252 -182
- package/build/index.es.js.map +1 -1
- package/build/index.js +252 -181
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.js
CHANGED
|
@@ -3408,14 +3408,14 @@ Object.defineProperty(BeatLoader, "__esModule", { value: true });
|
|
|
3408
3408
|
var React$2 = __importStar$2(React__default["default"]);
|
|
3409
3409
|
var react_1 = require$$1;
|
|
3410
3410
|
var helpers_1 = helpers$1;
|
|
3411
|
-
var beat = react_1.keyframes(templateObject_1$
|
|
3411
|
+
var beat = react_1.keyframes(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n 50% {transform: scale(0.75);opacity: 0.2}\n 100% {transform: scale(1);opacity: 1}\n"], ["\n 50% {transform: scale(0.75);opacity: 0.2}\n 100% {transform: scale(1);opacity: 1}\n"])));
|
|
3412
3412
|
var Loader = /** @class */ (function (_super) {
|
|
3413
3413
|
__extends$1(Loader, _super);
|
|
3414
3414
|
function Loader() {
|
|
3415
3415
|
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
3416
3416
|
_this.style = function (i) {
|
|
3417
3417
|
var _a = _this.props, color = _a.color, size = _a.size, margin = _a.margin, speedMultiplier = _a.speedMultiplier;
|
|
3418
|
-
return react_1.css(templateObject_2$
|
|
3418
|
+
return react_1.css(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n display: inline-block;\n background-color: ", ";\n width: ", ";\n height: ", ";\n margin: ", ";\n border-radius: 100%;\n animation: ", " ", "s ", "\n infinite linear;\n animation-fill-mode: both;\n "], ["\n display: inline-block;\n background-color: ", ";\n width: ", ";\n height: ", ";\n margin: ", ";\n border-radius: 100%;\n animation: ", " ", "s ", "\n infinite linear;\n animation-fill-mode: both;\n "])), color, helpers_1.cssValue(size), helpers_1.cssValue(size), helpers_1.cssValue(margin), beat, 0.7 / speedMultiplier, i % 2 ? "0s" : 0.35 / speedMultiplier + "s");
|
|
3419
3419
|
};
|
|
3420
3420
|
return _this;
|
|
3421
3421
|
}
|
|
@@ -3430,9 +3430,9 @@ var Loader = /** @class */ (function (_super) {
|
|
|
3430
3430
|
return Loader;
|
|
3431
3431
|
}(React$2.PureComponent));
|
|
3432
3432
|
var _default = BeatLoader.default = Loader;
|
|
3433
|
-
var templateObject_1$
|
|
3433
|
+
var templateObject_1$T, templateObject_2$z;
|
|
3434
3434
|
|
|
3435
|
-
var StyledButton = styled__default["default"].button(templateObject_1$
|
|
3435
|
+
var StyledButton = styled__default["default"].button(templateObject_1$S || (templateObject_1$S = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 13px 20px 16px;\n background-color: ", ";\n box-shadow: ", ";\n\n border: ", ";\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n cursor: pointer;\n\n span {\n color: ", ";\n font-family: ", ";\n font-style: normal;\n font-weight: bold;\n font-size: ", ";\n }\n\n :hover {\n opacity: 0.85;\n }\n\n :active {\n box-shadow: none;\n margin-top: ", ";\n height: ", ";\n }\n"], ["\n width: ", ";\n height: ", ";\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 13px 20px 16px;\n background-color: ", ";\n box-shadow: ", ";\n\n border: ", ";\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n cursor: pointer;\n\n span {\n color: ", ";\n font-family: ", ";\n font-style: normal;\n font-weight: bold;\n font-size: ", ";\n }\n\n :hover {\n opacity: 0.85;\n }\n\n :active {\n box-shadow: none;\n margin-top: ", ";\n height: ", ";\n }\n"])), function (_a) {
|
|
3436
3436
|
var fluid = _a.fluid;
|
|
3437
3437
|
return (fluid ? "100%" : "fit-content");
|
|
3438
3438
|
}, function (_a) {
|
|
@@ -3486,11 +3486,11 @@ var StyledButton = styled__default["default"].button(templateObject_1$R || (temp
|
|
|
3486
3486
|
? theme.button.medium.heightActive
|
|
3487
3487
|
: theme.button[size].heightActive;
|
|
3488
3488
|
});
|
|
3489
|
-
var DisabledButton = styled__default["default"](StyledButton)(templateObject_2$
|
|
3489
|
+
var DisabledButton = styled__default["default"](StyledButton)(templateObject_2$y || (templateObject_2$y = __makeTemplateObject$1(["\n background-color: ", ";\n border: 1px solid ", ";\n box-shadow: none;\n padding: 16px 20px;\n cursor: not-allowed;\n\n span {\n color: ", ";\n }\n\n :active {\n margin-top: 0;\n height: ", ";\n }\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n box-shadow: none;\n padding: 16px 20px;\n cursor: not-allowed;\n\n span {\n color: ", ";\n }\n\n :active {\n margin-top: 0;\n height: ", ";\n }\n"])), theme.colors.lightGray.dark, theme.colors.lightGray.darker, theme.colors.lightGray.darker, function (_a) {
|
|
3490
3490
|
var size = _a.size;
|
|
3491
3491
|
return !size ? theme.button.medium.height : theme.button[size].height;
|
|
3492
3492
|
});
|
|
3493
|
-
var GhostButton = styled__default["default"](StyledButton)(templateObject_3$
|
|
3493
|
+
var GhostButton = styled__default["default"](StyledButton)(templateObject_3$c || (templateObject_3$c = __makeTemplateObject$1(["\n height: ", ";\n padding: 16px 18px;\n\n :active {\n box-shadow: none;\n height: ", ";\n margin-top: ", ";\n margin-bottom: -2.5px;\n }\n"], ["\n height: ", ";\n padding: 16px 18px;\n\n :active {\n box-shadow: none;\n height: ", ";\n margin-top: ", ";\n margin-bottom: -2.5px;\n }\n"])), function (_a) {
|
|
3494
3494
|
var size = _a.size;
|
|
3495
3495
|
return !size
|
|
3496
3496
|
? "calc(".concat(theme.button.medium.height, " - 2.5px)")
|
|
@@ -3513,7 +3513,7 @@ var LoaderWrapper = styled__default["default"].div(templateObject_4$8 || (templa
|
|
|
3513
3513
|
var size = _a.size;
|
|
3514
3514
|
return (size === "small" ? "3px" : "");
|
|
3515
3515
|
});
|
|
3516
|
-
var templateObject_1$
|
|
3516
|
+
var templateObject_1$S, templateObject_2$y, templateObject_3$c, templateObject_4$8;
|
|
3517
3517
|
|
|
3518
3518
|
var Button = React$3.forwardRef(function (_a, ref) {
|
|
3519
3519
|
var label = _a.label, color = _a.color, size = _a.size, fluid = _a.fluid, disabled = _a.disabled, type = _a.type, tabIndex = _a.tabIndex, href = _a.href, asAnchor = _a.asAnchor, props = __rest(_a, ["label", "color", "size", "fluid", "disabled", "type", "tabIndex", "href", "asAnchor"]);
|
|
@@ -3549,7 +3549,7 @@ var Button = React$3.forwardRef(function (_a, ref) {
|
|
|
3549
3549
|
return (jsxRuntime.jsx(StyledButton, __assign$2({ color: color, size: size, fluid: fluid, type: type, tabIndex: tabIndex, as: as, href: href, ref: ref ? ref : buttonRef, onClick: onClick }, { children: isLoading ? jsxRuntime.jsx(Loader, {}) : jsxRuntime.jsx("span", { children: label }) })));
|
|
3550
3550
|
});
|
|
3551
3551
|
|
|
3552
|
-
var StyledCheckbox = styled__default["default"].div(templateObject_1$
|
|
3552
|
+
var StyledCheckbox = styled__default["default"].div(templateObject_1$R || (templateObject_1$R = __makeTemplateObject$1(["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
|
|
3553
3553
|
var checked = _a.checked, disabled = _a.disabled;
|
|
3554
3554
|
if (disabled)
|
|
3555
3555
|
return theme.colors.lightGray.darker;
|
|
@@ -3570,7 +3570,7 @@ var StyledCheckbox = styled__default["default"].div(templateObject_1$Q || (templ
|
|
|
3570
3570
|
return theme.colors.green.base;
|
|
3571
3571
|
return theme.colors.lightGray.darker;
|
|
3572
3572
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
3573
|
-
var templateObject_1$
|
|
3573
|
+
var templateObject_1$R;
|
|
3574
3574
|
|
|
3575
3575
|
var Checkbox = function (props) {
|
|
3576
3576
|
var _a;
|
|
@@ -3603,7 +3603,7 @@ var Checkbox = function (props) {
|
|
|
3603
3603
|
return (jsxRuntime.jsxs(StyledCheckbox, __assign$2({ checked: checked, disabled: props.disabled, tabIndex: 0, onClick: toggle, onBlur: props.onBlur, onKeyPress: function (e) { return (e.key === "Enter" ? toggle() : null); }, ref: wrapperRef }, { children: [checked && (jsxRuntime.jsx("svg", __assign$2({ width: 16, height: 12, viewBox: "0 0 16 12", fill: "none" }, { children: jsxRuntime.jsx("path", { d: "M12.61.563l-6.585 6.6L3.439 4.57a1.997 1.997 0 00-3.374.885c-.183.7.026 1.446.546 1.949l4 4.008a1.997 1.997 0 002.828 0l8-8.017a2.007 2.007 0 00-.025-2.809 1.997 1.997 0 00-2.803-.024z" }) }))), jsxRuntime.jsx("input", { type: "checkbox", disabled: !!props.disabled, id: props.id, name: props.name, value: props.value, ref: inputRef })] })));
|
|
3604
3604
|
};
|
|
3605
3605
|
|
|
3606
|
-
var Wrapper$a = styled__default["default"].div(templateObject_1$
|
|
3606
|
+
var Wrapper$a = styled__default["default"].div(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
|
|
3607
3607
|
var size = _a.size;
|
|
3608
3608
|
switch (size) {
|
|
3609
3609
|
case "small":
|
|
@@ -3626,7 +3626,7 @@ var Wrapper$a = styled__default["default"].div(templateObject_1$P || (templateOb
|
|
|
3626
3626
|
return "27px";
|
|
3627
3627
|
}
|
|
3628
3628
|
});
|
|
3629
|
-
var templateObject_1$
|
|
3629
|
+
var templateObject_1$Q;
|
|
3630
3630
|
|
|
3631
3631
|
var parsers = {};
|
|
3632
3632
|
|
|
@@ -3894,7 +3894,7 @@ var flags = {
|
|
|
3894
3894
|
};
|
|
3895
3895
|
var Flag = function (props) { return (jsxRuntime.jsx(Wrapper$a, __assign$2({}, props, { children: flags[getCountryCodeByLocale_1(props.locale)] }))); };
|
|
3896
3896
|
|
|
3897
|
-
var StyledHeading = styled__default["default"].span(templateObject_1$
|
|
3897
|
+
var StyledHeading = styled__default["default"].span(templateObject_1$P || (templateObject_1$P = __makeTemplateObject$1(["\n font-family: ", ";\n font-size: ", ";\n font-weight: 700;\n font-style: normal;\n line-height: ", ";\n letter-spacing: ", ";\n margin: 0;\n color: ", ";\n text-align: ", ";\n"], ["\n font-family: ", ";\n font-size: ", ";\n font-weight: 700;\n font-style: normal;\n line-height: ", ";\n letter-spacing: ", ";\n margin: 0;\n color: ", ";\n text-align: ", ";\n"])), theme.fonts.heading, function (_a) {
|
|
3898
3898
|
var type = _a.type;
|
|
3899
3899
|
return theme.heading[type].fontSize;
|
|
3900
3900
|
}, function (_a) {
|
|
@@ -3918,14 +3918,14 @@ var StyledHeading = styled__default["default"].span(templateObject_1$O || (templ
|
|
|
3918
3918
|
var align = _a.align;
|
|
3919
3919
|
return align;
|
|
3920
3920
|
});
|
|
3921
|
-
var templateObject_1$
|
|
3921
|
+
var templateObject_1$P;
|
|
3922
3922
|
|
|
3923
3923
|
var Heading = function (props) {
|
|
3924
3924
|
var element = !!props.as ? props.as : props.type;
|
|
3925
3925
|
return (jsxRuntime.jsx(StyledHeading, __assign$2({}, props, { as: element }, { children: props.children })));
|
|
3926
3926
|
};
|
|
3927
3927
|
|
|
3928
|
-
var Wrapper$9 = styled__default["default"].div(templateObject_1$
|
|
3928
|
+
var Wrapper$9 = styled__default["default"].div(templateObject_1$O || (templateObject_1$O = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n }\n"], ["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n }\n"])), function (_a) {
|
|
3929
3929
|
var size = _a.size;
|
|
3930
3930
|
return theme.icon[size] || theme.icon.medium;
|
|
3931
3931
|
}, function (_a) {
|
|
@@ -3955,7 +3955,7 @@ var Wrapper$9 = styled__default["default"].div(templateObject_1$N || (templateOb
|
|
|
3955
3955
|
return theme.colors.lightGray.light;
|
|
3956
3956
|
}
|
|
3957
3957
|
});
|
|
3958
|
-
var templateObject_1$
|
|
3958
|
+
var templateObject_1$O;
|
|
3959
3959
|
|
|
3960
3960
|
var icons = {
|
|
3961
3961
|
check: (jsxRuntime.jsx("path", { d: "M16.6107 6.5626L10.0247 13.1623L7.43866 10.5709C6.9365 10.0499 6.19289 9.841 5.49363 10.0244C4.79436 10.2078 4.24826 10.7551 4.06523 11.4558C3.8822 12.1565 4.09071 12.9017 4.61063 13.4049L8.61067 17.4132C9.39168 18.1956 10.6577 18.1956 11.4387 17.4132L19.4388 9.3965C20.1967 8.6101 20.1859 7.36009 19.4144 6.58701C18.6429 5.81393 17.3955 5.80307 16.6107 6.5626Z" })),
|
|
@@ -3972,7 +3972,7 @@ var icons = {
|
|
|
3972
3972
|
cross: (jsxRuntime.jsx("path", { d: "M4.58585 4.58579C5.36689 3.80474 6.63322 3.80474 7.41427 4.58579L12 9.17153L16.5858 4.58579C17.3668 3.80474 18.6331 3.80474 19.4142 4.58579C20.1952 5.36683 20.1952 6.63316 19.4142 7.41421L14.7615 12.0669L19.3934 16.5652C20.1858 17.3347 20.2043 18.6009 19.4348 19.3933C18.6652 20.1857 17.3991 20.2042 16.6067 19.4347L12 14.9609L7.39337 19.4347C6.60098 20.2042 5.33478 20.1857 4.56525 19.3933C3.79571 18.6009 3.81424 17.3347 4.60663 16.5652L9.23853 12.0669L4.58585 7.41421C3.8048 6.63316 3.8048 5.36683 4.58585 4.58579Z" })),
|
|
3973
3973
|
bulb: (jsxRuntime.jsx("path", { d: "M16.9999 9.03553C16.9967 7.88562 16.6951 6.75388 16.1213 5.73887C15.5475 4.72386 14.719 3.85637 13.7079 3.21192C12.6967 2.56746 11.5337 2.1656 10.3199 2.04132C9.10621 1.91704 7.87864 2.07411 6.74411 2.49886C5.61082 2.92007 4.60229 3.59282 3.80424 4.45988C3.00515 5.32808 2.44858 6.3703 2.18491 7.49217C1.91452 8.61242 1.94102 9.77811 2.2621 10.8864C2.58317 11.9948 3.18891 13.0116 4.02592 13.8473C4.27491 14.1044 4.50062 14.3808 4.70066 14.6734C4.46084 14.9466 4.28577 15.2649 4.18718 15.6069C4.08858 15.949 4.06875 16.3069 4.12899 16.6568C4.18923 17.0067 4.32815 17.3404 4.53646 17.6356C4.74477 17.9308 5.01763 18.1807 5.3368 18.3684C5.12981 18.7505 5.03079 19.1763 5.04929 19.6048C5.0678 20.0334 5.20322 20.4502 5.44246 20.8151C5.68171 21.18 6.01673 21.4808 6.41524 21.6883C6.81374 21.8958 7.2623 22.0031 7.71765 21.9999H11.2744C11.9809 21.9999 12.6585 21.7362 13.159 21.2666C13.6594 20.7969 13.9418 20.1596 13.9444 19.4942C13.9436 19.1085 13.8445 18.7287 13.6552 18.3866C14.0375 18.1632 14.3532 17.8517 14.5724 17.4817C14.7916 17.1116 14.9072 16.695 14.9082 16.2713C14.9084 15.7054 14.7007 15.1569 14.3203 14.7188C14.5467 14.3744 14.8047 14.0494 15.0914 13.7474C16.327 12.4547 17.0074 10.7749 16.9999 9.03553ZM12.2383 15.554C12.4351 15.554 12.6239 15.6277 12.7631 15.7588C12.9023 15.8899 12.9805 16.0677 12.9805 16.2531C12.9805 16.3445 12.9612 16.435 12.9238 16.5193C12.8864 16.6036 12.8316 16.68 12.7626 16.7442C12.6935 16.8084 12.6116 16.8591 12.5216 16.8932C12.4316 16.9273 12.3353 16.9443 12.2383 16.9431H6.75375C6.55947 16.9431 6.37313 16.8704 6.23574 16.741C6.09836 16.6116 6.02119 16.4361 6.02119 16.2531C6.02117 16.0693 6.09804 15.8928 6.23516 15.762C6.37227 15.6311 6.55859 15.5564 6.75375 15.554H12.2383ZM11.2744 20.166H7.71765C7.52336 20.166 7.33702 20.0933 7.19964 19.964C7.06226 19.8346 6.98508 19.659 6.98508 19.476C6.98506 19.2922 7.06194 19.1158 7.19905 18.9849C7.33616 18.8541 7.52248 18.7794 7.71765 18.777H11.2744C11.4713 18.777 11.66 18.8506 11.7992 18.9817C11.9384 19.1128 12.0166 19.2906 12.0166 19.476C12.0166 19.5674 11.9973 19.6579 11.9599 19.7422C11.9225 19.8265 11.8677 19.903 11.7987 19.9672C11.7296 20.0314 11.6477 20.082 11.5577 20.1161C11.4677 20.1503 11.3714 20.1672 11.2744 20.166ZM14.4841 10.6788C14.2574 11.2921 13.9036 11.8568 13.4432 12.3402C13.0264 12.7745 12.6551 13.2458 12.3347 13.7474H6.70557C6.39922 13.2738 6.04404 12.8299 5.64525 12.4219C4.97469 11.7557 4.51703 10.925 4.32473 10.0251C4.12802 9.12397 4.2045 8.18889 4.5454 7.32676C4.88631 6.46463 5.47789 5.71024 6.25251 5.14984C7.0192 4.57901 7.94129 4.22343 8.91286 4.12394C9.65469 4.04111 10.4067 4.10608 11.1202 4.31462C11.8317 4.53062 12.4881 4.88299 13.0479 5.34957C13.5623 5.78316 13.9815 6.30752 14.2818 6.89297C14.585 7.47727 14.7588 8.11359 14.7926 8.76318C14.8258 9.41467 14.721 10.0659 14.4841 10.6788Z" })),
|
|
3974
3974
|
star: (jsxRuntime.jsx("path", { d: "M2.52642 11.0247L6.42532 13.9834C6.87081 14.3213 7.05746 14.9203 6.88764 15.4672L5.39751 20.2558C5.01734 21.479 6.35757 22.4963 7.35438 21.7405L11.2533 18.7814C11.6988 18.443 12.3015 18.443 12.7469 18.7814L16.6458 21.7405C17.6422 22.4963 18.9829 21.479 18.6027 20.2558L17.1132 15.4672C16.9425 14.9203 17.1292 14.3213 17.5751 13.9834L21.4736 11.0247C22.4695 10.2684 21.9583 8.62247 20.7267 8.62247H15.9074C15.357 8.62247 14.8679 8.25197 14.6983 7.705L13.2093 2.9181C12.8286 1.69397 11.172 1.69397 10.791 2.9181L9.30106 7.70524C9.13146 8.2522 8.64412 8.6227 8.0928 8.6227H3.27326C2.04175 8.6227 1.5305 10.2687 2.52642 11.0247Z" })),
|
|
3975
|
-
setting: (jsxRuntime.jsx("path", { d: "
|
|
3975
|
+
setting: (jsxRuntime.jsx("path", { d: "M11.9 0c-.8 0-1.4.3-1.9.7-.4.4-.6 1-.8 1.5-.4.9-.7 1.8-1.6 2.4s-1.8.3-2.8.1c-.5-.1-1.1-.2-1.7 0-.6.2-1.1.6-1.5 1.3s-.5 1.4-.3 2c.2.6.5 1 .8 1.5.7.8 1.3 1.5 1.3 2.5s-.6 1.7-1.3 2.5c-.3.5-.7.9-.8 1.5-.2.6-.1 1.3.3 2s.9 1.1 1.5 1.3c.6.2 1.1.1 1.7 0 1-.2 1.9-.4 2.8.2.9.5 1.2 1.4 1.5 2.4.2.5.4 1 .8 1.5.4.4 1.1.7 1.9.7.8 0 1.4-.3 1.9-.7.4-.4.6-1 .8-1.5.4-1 .6-1.9 1.5-2.4s1.8-.3 2.8-.2c.5.1 1.1.2 1.7 0 .6-.2 1.1-.6 1.5-1.3.4-.7.5-1.4.3-2s-.5-1-.8-1.5c-.7-.8-1.3-1.5-1.3-2.5s.6-1.7 1.3-2.5c.5-.5.8-.9 1-1.5.2-.6.1-1.3-.3-2s-.9-1.1-1.5-1.3c-.6-.2-1.1-.1-1.7 0-1 .2-1.9.4-2.8-.2-.9-.5-1.2-1.4-1.5-2.4-.2-.5-.4-1-.8-1.5-.6-.3-1.3-.6-2-.6zm0 8c2.2 0 4 1.8 4 4s-1.8 4-4 4-4-1.8-4-4 1.8-4 4-4z" })),
|
|
3976
3976
|
reload: (jsxRuntime.jsx("path", { d: "M20.6354 11.2888C20.4446 11.2757 20.253 11.2998 20.0716 11.3597C19.8903 11.4195 19.7226 11.514 19.5783 11.6377C19.434 11.7614 19.3158 11.9119 19.2306 12.0806C19.1453 12.2493 19.0947 12.4329 19.0815 12.6209C18.9739 14.1387 18.3662 15.5804 17.3506 16.7268C16.335 17.8732 14.9672 18.6615 13.4551 18.9718C11.943 19.2821 10.3695 19.0975 8.97365 18.446C7.57786 17.7945 6.43622 16.7118 5.72234 15.3626C5.00847 14.0133 4.76142 12.4713 5.01877 10.971C5.27612 9.47075 6.02378 8.09431 7.14805 7.05103C8.27233 6.00774 9.71171 5.35469 11.2473 5.19118C12.7829 5.02767 14.3307 5.36264 15.6553 6.14516L15.0687 6.1882C14.8324 6.20792 14.6055 6.28802 14.4104 6.42057C14.2152 6.55313 14.0585 6.73355 13.9558 6.94402C13.853 7.15449 13.8078 7.38773 13.8246 7.62068C13.8414 7.85363 13.9196 8.07824 14.0514 8.27231C14.1758 8.45551 14.3442 8.60561 14.5416 8.70929C14.739 8.81296 14.9594 8.867 15.1831 8.8666H15.2601L19.2729 8.58175C19.4513 8.56929 19.6255 8.52227 19.7855 8.44339C19.9455 8.36452 20.0881 8.25533 20.2052 8.12209C20.3223 7.98884 20.4116 7.83415 20.4679 7.66688C20.5242 7.4996 20.5465 7.32303 20.5335 7.14726L20.2527 3.20036C20.2154 2.85494 20.0436 2.53721 19.7735 2.31395C19.5033 2.0907 19.1558 1.9793 18.8041 2.00318C18.4523 2.02706 18.1236 2.18436 17.8871 2.44201C17.6506 2.69966 17.5247 3.0376 17.5359 3.38479L17.5754 3.9422C15.7452 2.7363 13.5624 2.1585 11.3651 2.29828C9.16781 2.43806 7.07861 3.28763 5.42104 4.71541C3.76347 6.1432 2.63001 8.06953 2.19621 10.1961C1.7624 12.3226 2.05246 14.5308 3.02144 16.4785C3.99043 18.4263 5.58428 20.0049 7.55618 20.9701C9.52807 21.9352 11.768 22.2329 13.929 21.8171C16.09 21.4013 18.0516 20.2953 19.51 18.6702C20.9683 17.0451 21.8421 14.9916 21.9959 12.8278C22.0103 12.6386 21.9865 12.4483 21.9257 12.2682C21.865 12.088 21.7685 11.9216 21.642 11.7784C21.5154 11.6353 21.3613 11.5183 21.1885 11.4342C21.0157 11.3502 20.8277 11.3008 20.6354 11.2888Z" })),
|
|
3977
3977
|
expand: (jsxRuntime.jsx("path", { d: "M13.1519 2.65848C12.2656 2.65848 11.5471 3.37694 11.5471 4.26321C11.5471 5.14947 12.2656 5.86793 13.1519 5.86793L15.8968 5.86793L5.82737 15.9374L5.8678 13.1752C5.88077 12.2891 5.1729 11.5602 4.28672 11.5472C3.40055 11.5342 2.67166 12.2421 2.65869 13.1283L2.56131 19.7822C2.55612 20.1373 2.66667 20.4671 2.85807 20.7358C3.13154 21.2301 3.65827 21.5648 4.26318 21.5648L11.0715 21.5648C11.9577 21.5648 12.6762 20.8463 12.6762 19.9601C12.6762 19.0738 11.9577 18.3553 11.0715 18.3553L8.1374 18.3553L18.3988 8.09397L18.3555 11.048C18.3426 11.9342 19.0504 12.6631 19.9366 12.6761C20.8228 12.689 21.5517 11.9812 21.5646 11.095L21.662 4.44109C21.6672 4.08598 21.5567 3.75612 21.3653 3.48747C21.0918 2.99317 20.5651 2.65848 19.9602 2.65848L13.1519 2.65848Z" })),
|
|
3978
3978
|
calendar: (jsxRuntime.jsx("path", { d: "M21 3h-2V2c0-1.1-.9-2-2-2s-2 .9-2 2v1H9V2c0-1.1-.9-2-2-2S5 .9 5 2v1H3C1.3 3 0 4.3 0 6v14c0 1.7 1.3 3 3 3h18c1.7 0 3-1.3 3-3V6c0-1.7-1.3-3-3-3zM3 6h2v1c0 1.1.9 2 2 2s2-.9 2-2V6h6v1c0 1.1.9 2 2 2s2-.9 2-2V6h2v4H3V6zm0 14v-7h18v7H3z" })),
|
|
@@ -3985,10 +3985,11 @@ var icons = {
|
|
|
3985
3985
|
heart: (jsxRuntime.jsx("path", { d: "M22 3.5a6.64 6.64 0 00-9.4 0l-.6.6-.6-.6a6.64 6.64 0 00-9.4 0c-1.3 1.3-2 3-2 4.7s.6 3.4 2 4.7l.6.6 8.5 8.5c.5.5 1.4.5 1.9 0l9.1-9.1c1.3-1.3 2-3 2-4.7-.1-1.7-.7-3.4-2.1-4.7z" })),
|
|
3986
3986
|
thunder: (jsxRuntime.jsx("path", { d: "M20.3 8.7h-6.9l.6-7.6c0-.3-.1-.6-.3-.8-.2-.2-.5-.3-.7-.3-.3 0-.6.2-.7.4L2.9 13.6c-.1.2-.2.4-.2.7 0 .2.1.5.3.6.2.2.4.2.7.2h7.1l-.7 7.8c0 .2 0 .4.2.6.1.2.3.3.5.4l.2.1c.3 0 .6-.2.8-.5L21 10.2c.1-.2.2-.4.2-.7 0-.2-.1-.5-.3-.6-.1-.1-.4-.2-.6-.2z" })),
|
|
3987
3987
|
fire: (jsxRuntime.jsx("path", { d: "M17.3 9.2c-.7-.6-1.3-1.2-1.8-1.9C12.4 3.3 14 0 14 0 8.3 2.4 7 6.2 7 9c0 0 .1 1.7.8 3.5.2.6-.2 1.2-.8 1.3-.4.1-.8-.2-1-.6-.3-.7-.8-1.8-.6-2.6-.9 1.2-1.5 2.8-1.7 4.4-.3 4.2 2.6 8 6.7 8.8 4.8 1 9.3-2.3 10-7.1.3-2.9-.9-5.7-3.1-7.5z" })),
|
|
3988
|
+
control: (jsxRuntime.jsx("path", { d: "M1.4 5.3h2.4c.5 1.6 2 2.8 3.8 2.8 1.8 0 3.3-1.2 3.8-2.8h11.2c.7 0 1.2-.5 1.2-1.2s-.5-1.2-1.2-1.2H11.5C10.9 1.2 9.4 0 7.6 0 5.8 0 4.3 1.2 3.8 2.8H1.4C.7 2.8.2 3.3.2 4s.5 1.3 1.2 1.3zm6.2-2.8c.9 0 1.6.7 1.6 1.6s-.7 1.6-1.6 1.6S6 5 6 4.1c0-.9.7-1.6 1.6-1.6zM22.6 10.8h-2.4c-.5-1.6-2-2.8-3.8-2.8-1.8 0-3.3 1.2-3.8 2.8H1.4c-.7 0-1.2.5-1.2 1.2s.5 1.2 1.2 1.2h11.2c.5 1.6 2 2.8 3.8 2.8 1.8 0 3.3-1.2 3.8-2.8h2.4c.7 0 1.2-.5 1.2-1.2.1-.7-.5-1.2-1.2-1.2zm-6.2 2.8c-.9 0-1.6-.7-1.6-1.6 0-.9.7-1.6 1.6-1.6.9 0 1.6.7 1.6 1.6 0 .9-.7 1.6-1.6 1.6zM22.6 18.7H11.5c-.5-1.6-2-2.8-3.8-2.8-1.8 0-3.3 1.2-3.8 2.8H1.4c-.7 0-1.2.5-1.2 1.2s.5 1.2 1.2 1.2h2.4c.5 1.6 2 2.8 3.8 2.8 1.8 0 3.3-1.2 3.8-2.8h11.2c.7 0 1.2-.5 1.2-1.2s-.5-1.2-1.2-1.2zm-15 2.8c-.9 0-1.6-.7-1.6-1.6 0-.9.7-1.6 1.6-1.6.9 0 1.6.7 1.6 1.6 0 .9-.7 1.6-1.6 1.6z" })),
|
|
3988
3989
|
};
|
|
3989
3990
|
var Icon = function (props) { return (jsxRuntime.jsx(Wrapper$9, __assign$2({}, props, { children: jsxRuntime.jsx("svg", __assign$2({ viewBox: "0 0 24 24", fill: "none" }, { children: icons[props.type] })) }))); };
|
|
3990
3991
|
|
|
3991
|
-
var Wrapper$8 = styled__default["default"].div(templateObject_1$
|
|
3992
|
+
var Wrapper$8 = styled__default["default"].div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject$1(["\n > svg {\n height: ", ";\n }\n"], ["\n > svg {\n height: ", ";\n }\n"])), function (_a) {
|
|
3992
3993
|
var size = _a.size;
|
|
3993
3994
|
switch (size) {
|
|
3994
3995
|
case "tiny":
|
|
@@ -4002,7 +4003,7 @@ var Wrapper$8 = styled__default["default"].div(templateObject_1$M || (templateOb
|
|
|
4002
4003
|
return "118px";
|
|
4003
4004
|
}
|
|
4004
4005
|
});
|
|
4005
|
-
var templateObject_1$
|
|
4006
|
+
var templateObject_1$N;
|
|
4006
4007
|
|
|
4007
4008
|
var illustrations = {
|
|
4008
4009
|
keyboard: (jsxRuntime.jsxs("svg", __assign$2({ viewBox: "0 0 32.9 20.8" }, { children: [jsxRuntime.jsx("path", { d: "M31.5 1H1.4C.6 1 0 1.6 0 2.4v17.1c0 .8.6 1.4 1.4 1.4h30.1c.8 0 1.4-.6 1.4-1.4V2.4c0-.8-.6-1.4-1.4-1.4z", fill: "#829190" }), jsxRuntime.jsx("path", { d: "M31.5 0H1.4C.6 0 0 .6 0 1.4v17.1c0 .8.6 1.4 1.4 1.4h30.1c.8 0 1.4-.6 1.4-1.4V1.4c0-.8-.6-1.4-1.4-1.4z", fill: "#99adac" }), jsxRuntime.jsx("path", { d: "M27.1 14.2H5.7c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h21.4c.3 0 .5-.2.5-.5v-3.4c-.1-.3-.3-.5-.5-.5zM8.4 8.6H2.1c-.3 0-.5.2-.5.4v3.4c0 .3.2.5.5.5h6.3c.3 0 .5-.2.5-.5V9c0-.2-.2-.4-.5-.4zM13.8 8.6h-3.3c-.3 0-.5.2-.5.4v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V9c-.1-.2-.3-.4-.5-.4zM5.4 3.3H2.1c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c-.1-.3-.3-.5-.5-.5zM10.5 3.3H7.2c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c-.1-.3-.3-.5-.5-.5zM15.5 3.3h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c0-.3-.2-.5-.5-.5zM20.6 3.3h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c0-.3-.2-.5-.5-.5zM25.7 3.3h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c0-.3-.2-.5-.5-.5zM30.8 3.3h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c0-.3-.2-.5-.5-.5zM18.9 8.6h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V9c-.1-.2-.3-.4-.5-.4zM23.9 8.6h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V9.1c0-.3-.2-.5-.5-.5zM30.7 8.6h-4.9c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h4.9c.3 0 .5-.2.5-.5V9.1c0-.3-.2-.5-.5-.5z", fill: "#899a99" }), jsxRuntime.jsx("path", { d: "M27.1 13.7H5.7c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h21.4c.3 0 .5-.2.5-.5v-3.4c-.1-.3-.3-.5-.5-.5zM8.4 8.1H2.1c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h6.3c.3 0 .5-.2.5-.5V8.6c0-.3-.2-.5-.5-.5zM13.8 8.1h-3.3c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V8.6c-.1-.3-.3-.5-.5-.5z", fill: "#eeeded" }), jsxRuntime.jsx("path", { d: "M5.4 2.8H2.1c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c-.1-.3-.3-.5-.5-.5z", fill: "#e62944" }), jsxRuntime.jsx("path", { d: "M10.5 2.8H7.2c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c-.1-.3-.3-.5-.5-.5zM15.5 2.8h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c0-.3-.2-.5-.5-.5zM20.6 2.8h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c0-.3-.2-.5-.5-.5zM25.7 2.8h-3.3c-.2 0-.4.2-.4.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c-.1-.3-.3-.5-.6-.5zM30.8 2.8h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c0-.3-.2-.5-.5-.5zM18.9 8.1h-3.3c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V8.6c-.1-.3-.3-.5-.5-.5zM23.9 8.1h-3.3c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V8.6c0-.3-.2-.5-.5-.5zM30.7 8.1h-4.9c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h4.9c.3 0 .5-.2.5-.5V8.6c0-.3-.2-.5-.5-.5z", fill: "#eeeded" })] }))),
|
|
@@ -4023,7 +4024,7 @@ var illustrations = {
|
|
|
4023
4024
|
};
|
|
4024
4025
|
var Illustration = function (props) { return (jsxRuntime.jsx(Wrapper$8, __assign$2({}, props, { children: illustrations[props.type] }))); };
|
|
4025
4026
|
|
|
4026
|
-
var StyledParagraph = styled__default["default"].p(templateObject_1$
|
|
4027
|
+
var StyledParagraph = styled__default["default"].p(templateObject_1$M || (templateObject_1$M = __makeTemplateObject$1(["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n text-transform: ", ";\n"], ["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n text-transform: ", ";\n"])), theme.fonts.paragraph, function (_a) {
|
|
4027
4028
|
var size = _a.size;
|
|
4028
4029
|
return size ? theme.paragraph[size].fontSize : theme.paragraph.medium.fontSize;
|
|
4029
4030
|
}, function (_a) {
|
|
@@ -4058,17 +4059,17 @@ var StyledParagraph = styled__default["default"].p(templateObject_1$L || (templa
|
|
|
4058
4059
|
var transform = _a.transform;
|
|
4059
4060
|
return transform;
|
|
4060
4061
|
});
|
|
4061
|
-
var templateObject_1$
|
|
4062
|
+
var templateObject_1$M;
|
|
4062
4063
|
|
|
4063
|
-
var Container$
|
|
4064
|
-
var InputIconWrapper = styled__default["default"].div(templateObject_2$
|
|
4064
|
+
var Container$m = styled__default["default"].div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject$1(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
4065
|
+
var InputIconWrapper = styled__default["default"].div(templateObject_2$x || (templateObject_2$x = __makeTemplateObject$1(["\n position: relative;\n width: 100%;\n\n input {\n padding-right: 43px;\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"], ["\n position: relative;\n width: 100%;\n\n input {\n padding-right: 43px;\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"])), function (_a) {
|
|
4065
4066
|
var isChanged = _a.isChanged;
|
|
4066
4067
|
return !isChanged ? theme.colors.lightGray.darker : "";
|
|
4067
4068
|
}, function (_a) {
|
|
4068
4069
|
var disabled = _a.disabled;
|
|
4069
4070
|
return (disabled ? "not-allowed" : "pointer");
|
|
4070
4071
|
});
|
|
4071
|
-
var StyledInput = styled__default["default"].input(templateObject_3$
|
|
4072
|
+
var StyledInput = styled__default["default"].input(templateObject_3$b || (templateObject_3$b = __makeTemplateObject$1(["\n width: 100%;\n min-width: 228px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 100%;\n min-width: 228px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
|
|
4072
4073
|
var disabled = _a.disabled;
|
|
4073
4074
|
return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
4074
4075
|
}, function (_a) {
|
|
@@ -4087,7 +4088,7 @@ var Helper = styled__default["default"](StyledParagraph)(templateObject_6$3 || (
|
|
|
4087
4088
|
var isOk = _a.isOk;
|
|
4088
4089
|
return isOk ? theme.colors.green.base : theme.colors.darkGray.light;
|
|
4089
4090
|
}, fadeIn);
|
|
4090
|
-
var templateObject_1$
|
|
4091
|
+
var templateObject_1$L, templateObject_2$x, templateObject_3$b, templateObject_4$7, templateObject_5$3, templateObject_6$3;
|
|
4091
4092
|
|
|
4092
4093
|
var expressions = {};
|
|
4093
4094
|
|
|
@@ -4185,7 +4186,7 @@ var PasswordInput = function (props) {
|
|
|
4185
4186
|
if (props.onKeyPress)
|
|
4186
4187
|
props.onKeyPress(e);
|
|
4187
4188
|
};
|
|
4188
|
-
return (jsxRuntime.jsxs(Container$
|
|
4189
|
+
return (jsxRuntime.jsxs(Container$m, { children: [jsxRuntime.jsxs(InputIconWrapper, __assign$2({ disabled: props.disabled }, { children: [jsxRuntime.jsx(Icon, { type: isVisible ? "eyeInvisible" : "eye", color: "gray", size: "small", onClick: toggle }), jsxRuntime.jsx(StyledInput, __assign$2({ type: isVisible ? "text" : "password" }, props, { onChange: onChange, onKeyPress: onKeyPress }))] })), props.helperLocale && value.length ? (jsxRuntime.jsxs(HelperContainer, { children: [jsxRuntime.jsxs(Helper, __assign$2({ isOk: expressions.hasCapitalLetter(value) }, { children: ["\u2022 ", translations[props.helperLocale].capitalLetter] })), jsxRuntime.jsxs(Helper, __assign$2({ isOk: expressions.hasNumber(value) }, { children: ["\u2022 ", translations[props.helperLocale].number] })), jsxRuntime.jsxs(Helper, __assign$2({ isOk: expressions.hasSpecialCharacter(value) }, { children: ["\u2022 ", translations[props.helperLocale].specialCharacter] })), jsxRuntime.jsxs(Helper, __assign$2({ isOk: value.length >= 8 }, { children: ["\u2022 ", translations[props.helperLocale].length] }))] })) : null] }));
|
|
4189
4190
|
};
|
|
4190
4191
|
|
|
4191
4192
|
function requiredArgs(required, args) {
|
|
@@ -4519,7 +4520,7 @@ Input.Date = DateInput;
|
|
|
4519
4520
|
|
|
4520
4521
|
var Logo = function (props) { return (jsxRuntime.jsxs("svg", __assign$2({ width: 396, height: 66, viewBox: "0 0 662.8 118.1", fill: "none", xmlSpace: "preserve" }, props, { children: [jsxRuntime.jsxs("g", { children: [jsxRuntime.jsx("path", { d: "M61.6 23.5c-.4-.5-.9-1.1-1.3-1.5l-4.9-4.8L42 4c-1.3-1.3-2.8-2.3-4.5-3-1.7-.7-3.5-1-5.3-1-1.8 0-3.6.4-5.3 1-1.7.7-3.2 1.7-4.5 3L4.1 22C1.5 24.6 0 28 0 31.7c0 3.6 1.5 7.1 4.1 9.7l18.3 18c2.6 2.6 6.2 4 9.8 4 3.7 0 7.2-1.4 9.8-4l13.4-13.2-4.9-4.8c-.5-.5-.9-1-1.3-1.5L35.7 53.1c-.5.5-1 .8-1.6 1.1-.6.2-1.3.4-1.9.4-.7 0-1.3-.1-1.9-.4-.6-.2-1.2-.6-1.6-1.1l-18.3-18c-.9-.9-1.5-2.2-1.5-3.5 0-1.3.5-2.5 1.5-3.5l18.3-18c.5-.5 1-.8 1.6-1.1.6-.2 1.3-.4 1.9-.4.7 0 1.3.1 1.9.4.6.2 1.2.6 1.6 1.1l13.5 13.3 4.8 4.7c.5.4.8 1 1.1 1.6.2.6.4 1.2.4 1.9v.1c0 1.3.5 2.5 1.5 3.4l4.8 4.7c1.8-2.4 2.7-5.2 2.7-8.1-.1-3-1.1-5.8-2.9-8.2z", fill: "#e62743" }), jsxRuntime.jsx("path", { d: "M153.3 22L135 4c-1.3-1.3-2.8-2.3-4.5-3-1.7-.7-3.5-1-5.3-1-1.8 0-3.6.4-5.3 1-1.7.7-3.2 1.7-4.5 3L102 17.2 97.1 22c-.5.5-.9 1-1.3 1.5-1.8 2.4-2.8 5.2-2.8 8.2 0 2.9 1 5.8 2.7 8.1l4.8-4.7c.9-.9 1.4-2.1 1.5-3.4 0-.6.1-1.3.4-1.9.2-.6.6-1.1 1.1-1.6l4.8-4.7 13.5-13.3c.5-.5 1-.8 1.6-1.1.6-.2 1.2-.4 1.9-.4s1.3.1 1.9.4c.6.2 1.1.6 1.6 1.1l18.3 18c.5.5.8 1 1.1 1.6.3.6.4 1.2.4 1.9 0 .6-.1 1.3-.4 1.9-.3.6-.6 1.1-1.1 1.6l-18.3 18c-.5.5-1 .8-1.6 1.1-.6.2-1.2.4-1.9.4s-1.3-.1-1.9-.4c-.6-.2-1.1-.6-1.6-1.1l-13.5-13.3c-.4.5-.8 1.1-1.3 1.5l-4.9 4.8 13.4 13.2c1.3 1.3 2.8 2.3 4.5 3 1.7.7 3.5 1 5.3 1 1.8 0 3.6-.4 5.3-1 1.7-.7 3.2-1.7 4.5-3l18.3-18c1.3-1.3 2.3-2.8 3-4.5.7-1.7 1.1-3.5 1.1-5.3 0-1.8-.4-3.6-1.1-5.3-.8-1.5-1.8-3-3.1-4.3z", fill: "#53b476" }), jsxRuntime.jsx("path", { d: "M61.9 23.3l-.3.3c-.4-.5-.9-1.1-1.3-1.5l-4.9-4.8L68.8 4c1.3-1.3 2.8-2.3 4.5-3 1.7-.7 3.5-1 5.3-1s3.6.4 5.3 1c1.7.7 3.2 1.7 4.5 3l13.4 13.1-4.7 4.9c-.5.5-.9 1-1.3 1.5L82.2 10.2c-.5-.5-1-.8-1.6-1.1-.6-.2-1.3-.4-1.9-.4-.7 0-1.3.1-1.9.4-.6.2-1.2.6-1.6 1.1L61.9 23.3zm41.5 4.9l4.8-4.7c1.8 2.4 2.7 5.2 2.7 8.2 0 2.9-1 5.8-2.7 8.2-.4.5-.8 1.1-1.3 1.5l-4.9 4.8-13.5 13.2c-2.6 2.6-6.2 4-9.8 4s-7.2-1.4-9.8-4L55.4 46.1l-4.9-4.8c-.5-.5-.9-1-1.3-1.5-1.8-2.4-2.7-5.2-2.7-8.1 0-2.9 1-5.8 2.7-8.1l4.8 4.7c.5.4.8 1 1.1 1.6.2.6.4 1.2.4 1.9v.1c0 1.3.5 2.5 1.5 3.4l4.8 4.7 13.5 13.3c.5.5 1 .8 1.6 1.1s1.3.4 1.9.4 1.3-.1 1.9-.4 1.2-.6 1.6-1.1L95.8 40l4.8-4.7c.9-.9 1.4-2.1 1.5-3.4 0-.6.1-1.3.4-1.9 0-.8.4-1.3.9-1.8z", fillRule: "evenodd", clipRule: "evenodd", fill: "#ffd800" }), jsxRuntime.jsx("path", { d: "M130 76.6l-18.3-18c-2.6-2.6-6.2-4-9.8-4-3.7 0-7.2 1.4-9.8 4L78.7 71.9l-4.9 4.8c-.5.5-.9 1-1.3 1.5-1.8 2.4-2.7 5.2-2.7 8.1 0 2.9 1 5.8 2.7 8.1l4.8-4.7c.9-.9 1.4-2.1 1.5-3.4 0-1.3.5-2.5 1.5-3.4l4.8-4.7 13.5-13.3c.9-.9 2.2-1.4 3.5-1.4 1.3 0 2.6.5 3.5 1.4l18.3 18c.9.9 1.5 2.2 1.5 3.5 0 1.3-.5 2.5-1.5 3.5l-18.3 18c-.9.9-2.2 1.4-3.5 1.4-1.3 0-2.6-.5-3.5-1.4L84.9 94.5c-.4.6-.8 1.1-1.3 1.5l-4.9 4.8L92.1 114c2.6 2.6 6.2 4 9.8 4 3.7 0 7.2-1.4 9.8-4L130 96c1.3-1.3 2.3-2.8 3-4.5.7-1.7 1.1-3.5 1.1-5.3 0-1.8-.4-3.6-1.1-5.3-.6-1.5-1.7-3-3-4.3z", fill: "#8c5ca2" }), jsxRuntime.jsx("path", { d: "M84.9 78.2l-4.8 4.7c-.9.9-1.4 2.1-1.5 3.4 0 1.3-.5 2.5-1.5 3.4l-4.8 4.7-13.5 13.3c-.9.9-2.2 1.4-3.5 1.4s-2.6-.5-3.5-1.4l-18.3-18c-.9-.9-1.4-2.2-1.4-3.5s.5-2.5 1.4-3.5l18.3-18c.9-.9 2.2-1.4 3.5-1.4s2.6.5 3.5 1.4L72.3 78c.4-.5.8-1.1 1.3-1.5l4.9-4.8-13.3-13c-2.6-2.6-6.2-4-9.8-4-3.7 0-7.2 1.4-9.8 4l-18.3 18c-2.6 2.6-4.1 6.1-4.1 9.7s1.5 7.1 4.1 9.7l18.3 18c2.6 2.6 6.2 4 9.8 4 3.7 0 7.2-1.4 9.8-4l13.4-13.2 4.9-4.8c.5-.5.9-1 1.3-1.5 1.8-2.4 2.7-5.2 2.7-8.1.1-3.1-.9-5.9-2.6-8.3z", fill: "#3da9e1" })] }), jsxRuntime.jsxs("g", __assign$2({ fill: "#23292f" }, { children: [jsxRuntime.jsx("path", { d: "M236.6 21.5c-1.1-1-2.4-1.5-3.9-1.5h-40.2c-1.6 0-2.9.5-3.9 1.4-1.1.9-1.6 2.2-1.6 3.8 0 1.6.5 2.8 1.6 3.8s2.4 1.5 3.9 1.5h14.2V78c0 1.6.5 2.9 1.6 3.9 1.1 1.1 2.5 1.6 4.2 1.6 1.8 0 3.2-.5 4.3-1.6 1.1-1.1 1.7-2.4 1.7-3.9V30.4h14.2c1.6 0 2.9-.5 3.9-1.4 1.1-.9 1.6-2.2 1.6-3.8 0-1.5-.5-2.8-1.6-3.7z" }), jsxRuntime.jsx("path", { d: "M270.6 36.6c-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9v23.2c0 2.3-.4 4.2-1.2 5.8-.8 1.6-1.9 2.8-3.4 3.6-1.5.8-3.2 1.2-5.3 1.2-3.1 0-5.5-.8-7.2-2.4-1.7-1.6-2.6-4.4-2.6-8.3V40.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9V67c0 3.4.7 6.4 2 9 1.3 2.6 3.2 4.7 5.6 6.2 2.4 1.5 5.2 2.2 8.4 2.2 2.7 0 5.1-.3 7.3-1 2.1-.7 3.9-1.6 5.5-2.9.7-.6 1.3-1.3 1.9-2v1c0 3.1-.5 5.5-1.4 7.3-.9 1.8-2.3 3.1-4.2 3.8-1.8.8-4.2 1.1-6.9 1.1-2.1 0-3.9-.3-5.4-1-1.6-.6-2.8-1.1-3.8-1.4-1.3-.5-2.6-.4-3.8.2-1.2.6-2.1 1.8-2.6 3.6-.4 1.3-.3 2.6.4 3.8.7 1.2 1.9 2.2 3.8 2.9 1.4.6 3.2 1.1 5.3 1.4 2.2.3 4.2.5 6.2.5 4.4 0 8.3-.7 11.8-2.2 3.5-1.4 6.3-3.8 8.4-7.1 2.1-3.3 3.1-7.7 3.1-13.3V40.5c-.3-1.6-.8-2.9-1.8-3.9zM327.5 46.1c-2-3.7-4.6-6.7-8-8.8-3.4-2.1-7.1-3.2-11.4-3.2-2.1 0-4.1.4-6 1.1-1.9.7-3.6 1.6-5 2.8-1.3 1-2.4 2-3.2 3.1v-.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9v55.6c0 1.6.5 3 1.5 4s2.3 1.5 3.9 1.5 2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V78.3c.6.6 1.4 1.3 2.2 1.9 1.6 1.2 3.5 2.2 5.6 3 2.1.8 4.4 1.2 6.8 1.2 4.1 0 7.8-1.1 11.1-3.2s5.9-5.1 7.9-8.9c2-3.8 2.9-8.1 2.9-13.1s-1-9.3-2.9-13.1zm-9.2 20.8c-1.1 2.3-2.7 4.2-4.6 5.5-2 1.3-4.3 2-6.9 2s-5-.7-7-2-3.6-3.2-4.7-5.5-1.7-4.9-1.7-7.8c0-2.9.6-5.5 1.7-7.8s2.7-4.1 4.7-5.4c2-1.3 4.3-2 7-2s5 .7 6.9 2c2 1.3 3.5 3.1 4.6 5.4 1.1 2.3 1.7 4.8 1.7 7.8 0 2.9-.6 5.5-1.7 7.8zM380.4 61.6c1.1-.9 1.7-2.1 1.7-3.5 0-3.3-.6-6.3-1.9-9.2-1.2-2.9-2.9-5.5-5-7.7s-4.5-3.9-7.3-5.2c-2.8-1.3-5.7-1.9-8.7-1.9-4 0-7.8 1-11.3 3.1-3.6 2.1-6.5 5-8.7 8.8-2.2 3.8-3.3 8.5-3.3 13.9 0 4.7 1 8.8 3 12.5 2 3.7 4.9 6.6 8.7 8.7 3.8 2.1 8.2 3.2 13.4 3.2 3 0 6-.5 8.8-1.5 2.8-1 5-2.2 6.6-3.5 1.7-1.3 2.5-2.8 2.5-4.4 0-1.2-.4-2.3-1.3-3.2-.9-.9-2-1.4-3.3-1.4-1 0-2 .3-3.1.8-.7.4-1.4.8-2.2 1.3-.8.5-1.9 1-3.2 1.3-1.3.4-3.1.5-5.3.5-2.4 0-4.7-.6-6.8-1.8-2.1-1.2-3.9-2.9-5.3-5.2-.8-1.3-1.3-2.8-1.7-4.5h29.9c1.4.3 2.7-.2 3.8-1.1zM350 47.2c1.1-1.1 2.5-2 4.1-2.4 1.6-.5 3.3-.7 5.1-.7 1.9 0 3.6.4 5.3 1.2 1.7.8 3.1 1.9 4.2 3.3s1.7 3 1.9 4.7v.6h-23.7c.1-.7.3-1.5.5-2.1.5-1.9 1.5-3.4 2.6-4.6zM447.3 39.1c-1.5-3.9-3.6-7.4-6.4-10.4-2.8-3-6-5.3-9.8-7-3.8-1.7-7.9-2.5-12.4-2.5s-8.6.8-12.3 2.5c-3.7 1.7-7 4-9.7 7-2.8 3-4.9 6.5-6.4 10.4-1.5 3.9-2.3 8.2-2.3 12.7s.8 8.8 2.3 12.7c1.5 3.9 3.6 7.4 6.4 10.4 2.7 3 6 5.3 9.7 7 3.7 1.7 7.9 2.5 12.3 2.5 4.5 0 8.6-.8 12.4-2.5 3.8-1.7 7-4 9.8-7 2.8-3 4.9-6.5 6.4-10.4 1.5-3.9 2.3-8.2 2.3-12.7-.1-4.6-.8-8.8-2.3-12.7zm-12 23.7c-1.6 3.3-3.9 5.9-6.7 7.8-2.8 1.9-6.1 2.9-9.9 2.9-3.7 0-7-1-9.9-2.9-2.8-1.9-5.1-4.5-6.7-7.8-1.6-3.3-2.4-7-2.4-11 0-4.1.8-7.8 2.4-11.1 1.6-3.3 3.8-5.9 6.7-7.8 2.8-1.9 6.1-2.9 9.9-2.9 3.7 0 7 1 9.9 2.9 2.8 1.9 5.1 4.5 6.7 7.8 1.6 3.3 2.4 7 2.4 11 .1 4.1-.8 7.8-2.4 11.1zM468.4 18c-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6c-1.1 1.1-1.6 2.4-1.6 3.9v56c0 1.6.5 2.9 1.5 3.9 1 1.1 2.3 1.6 3.8 1.6 1.6 0 2.9-.5 3.9-1.6 1.1-1.1 1.6-2.4 1.6-3.9v-56c.1-1.5-.4-2.9-1.4-3.9zM520.2 36.6c-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9v23.2c0 2.3-.4 4.2-1.2 5.8-.8 1.6-1.9 2.8-3.4 3.6-1.4.8-3.2 1.2-5.3 1.2-3.1 0-5.5-.8-7.2-2.4-1.7-1.6-2.6-4.4-2.6-8.3V40.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9V67c0 3.4.7 6.4 2 9 1.3 2.6 3.2 4.7 5.6 6.2 2.4 1.5 5.2 2.2 8.4 2.2 2.7 0 5.1-.3 7.3-1 2.1-.7 3.9-1.6 5.5-2.9.7-.6 1.3-1.3 1.9-2v1c0 3.1-.5 5.5-1.4 7.3-.9 1.8-2.3 3.1-4.2 3.8-1.8.8-4.2 1.1-6.9 1.1-2.1 0-3.9-.3-5.4-1-1.6-.6-2.8-1.1-3.8-1.4-1.3-.5-2.6-.4-3.8.2-1.2.6-2.1 1.8-2.6 3.6-.4 1.3-.3 2.6.4 3.8.7 1.2 1.9 2.2 3.8 2.9 1.4.6 3.2 1.1 5.3 1.4 2.2.3 4.2.5 6.2.5 4.4 0 8.3-.7 11.8-2.2 3.5-1.4 6.3-3.8 8.4-7.1 2.1-3.3 3.1-7.7 3.1-13.3V40.5c-.2-1.6-.7-2.9-1.8-3.9zM603.2 44.4c-.8-3.1-2.4-5.6-4.7-7.5s-5.6-2.8-9.9-2.8c-2.7 0-5.1.6-7.2 1.7-2.1 1.1-4 2.5-5.5 4.1-1.4 1.5-2.5 2.9-3.2 4.2-.8-2.6-2.1-4.7-3.9-6.5-2.3-2.3-5.9-3.5-10.7-3.5-2 0-3.8.3-5.5 1-1.7.6-3.2 1.5-4.6 2.5-1.4 1-2.6 2.1-3.5 3.3l-.9 1.2v-1.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9V78c0 1.6.5 2.9 1.5 3.9 1 1.1 2.3 1.6 3.9 1.6s2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V54.7c0-2 .4-3.8 1.2-5.4.8-1.6 2-2.9 3.7-3.9 1.6-1 3.6-1.4 5.9-1.4 2.4 0 4.2.5 5.4 1.4 1.3 1 2.1 2.3 2.6 3.9s.7 3.4.7 5.4v23.2c0 1.6.5 2.9 1.5 3.9 1 1.1 2.3 1.6 3.9 1.6s2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V54.7c0-2 .4-3.8 1.2-5.4.8-1.6 2-2.9 3.7-3.9 1.6-1 3.6-1.4 5.9-1.4 2.4 0 4.2.5 5.4 1.4 1.3 1 2.1 2.3 2.6 3.9s.7 3.4.7 5.4v23.2c0 1.6.5 2.9 1.5 3.9 1 1.1 2.3 1.6 3.9 1.6s2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V54.7c.3-3.8-.2-7.2-1-10.3zM659.8 46.1c-2-3.7-4.6-6.7-8-8.8-3.4-2.1-7.1-3.2-11.4-3.2-2.1 0-4.1.4-6 1.1-1.9.7-3.6 1.6-5 2.8-1.3 1-2.4 2-3.2 3.1v-.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9v55.6c0 1.6.5 3 1.5 4s2.3 1.5 3.9 1.5 2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V78.3c.6.6 1.4 1.3 2.2 1.9 1.6 1.2 3.5 2.2 5.6 3s4.4 1.2 6.8 1.2c4.1 0 7.8-1.1 11.1-3.2s5.9-5.1 7.9-8.9c2-3.8 2.9-8.1 2.9-13.1.1-5-.9-9.3-2.9-13.1zm-9.1 20.8c-1.1 2.3-2.7 4.2-4.6 5.5-2 1.3-4.3 2-6.9 2s-5-.7-7-2-3.5-3.2-4.7-5.5c-1.1-2.3-1.7-4.9-1.7-7.8 0-2.9.6-5.5 1.7-7.8s2.7-4.1 4.7-5.4c2-1.3 4.3-2 7-2s5 .7 6.9 2c2 1.3 3.5 3.1 4.6 5.4 1.1 2.3 1.7 4.8 1.7 7.8-.1 2.9-.6 5.5-1.7 7.8z" })] }))] }))); };
|
|
4521
4522
|
|
|
4522
|
-
var Wrapper$7 = styled__default["default"].div(templateObject_1$
|
|
4523
|
+
var Wrapper$7 = styled__default["default"].div(templateObject_1$K || (templateObject_1$K = __makeTemplateObject$1(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
|
|
4523
4524
|
var size = _a.size;
|
|
4524
4525
|
switch (size) {
|
|
4525
4526
|
default:
|
|
@@ -4529,7 +4530,7 @@ var Wrapper$7 = styled__default["default"].div(templateObject_1$J || (templateOb
|
|
|
4529
4530
|
return "116px";
|
|
4530
4531
|
}
|
|
4531
4532
|
});
|
|
4532
|
-
var templateObject_1$
|
|
4533
|
+
var templateObject_1$K;
|
|
4533
4534
|
|
|
4534
4535
|
var medals = {
|
|
4535
4536
|
small: {
|
|
@@ -4545,11 +4546,11 @@ var medals = {
|
|
|
4545
4546
|
};
|
|
4546
4547
|
var Medal = function (props) { return (jsxRuntime.jsx(Wrapper$7, __assign$2({}, props, { children: medals[props.size || "small"][props.type] }))); };
|
|
4547
4548
|
|
|
4548
|
-
var Wrapper$6 = styled__default["default"].div(templateObject_1$
|
|
4549
|
+
var Wrapper$6 = styled__default["default"].div(templateObject_1$J || (templateObject_1$J = __makeTemplateObject$1(["\n width: fit-content;\n display: flex;\n\n button:first-child {\n border-radius: 6px 0 0 6px;\n border-width: 2px 1px 2px 2px;\n }\n\n button:last-child {\n border-radius: 0 6px 6px 0;\n border-width: 2px 2px 2px 1px;\n }\n\n button {\n width: ", ";\n }\n"], ["\n width: fit-content;\n display: flex;\n\n button:first-child {\n border-radius: 6px 0 0 6px;\n border-width: 2px 1px 2px 2px;\n }\n\n button:last-child {\n border-radius: 0 6px 6px 0;\n border-width: 2px 2px 2px 1px;\n }\n\n button {\n width: ", ";\n }\n"])), function (_a) {
|
|
4549
4550
|
var disabled = _a.disabled;
|
|
4550
4551
|
return (disabled ? "49.5px" : "");
|
|
4551
4552
|
});
|
|
4552
|
-
var StyledInputNumber = styled__default["default"].input(templateObject_2$
|
|
4553
|
+
var StyledInputNumber = styled__default["default"].input(templateObject_2$w || (templateObject_2$w = __makeTemplateObject$1(["\n width: 50px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n text-align: center;\n -moz-appearance: textfield;\n\n ::-webkit-inner-spin-button {\n -webkit-appearance: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 50px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n text-align: center;\n -moz-appearance: textfield;\n\n ::-webkit-inner-spin-button {\n -webkit-appearance: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
|
|
4553
4554
|
var disabled = _a.disabled;
|
|
4554
4555
|
return disabled ? theme.colors.lightGray.base : theme.colors.lightGray.light;
|
|
4555
4556
|
}, function (_a) {
|
|
@@ -4562,7 +4563,7 @@ var StyledInputNumber = styled__default["default"].input(templateObject_2$v || (
|
|
|
4562
4563
|
var disabled = _a.disabled;
|
|
4563
4564
|
return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
|
|
4564
4565
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
4565
|
-
var templateObject_1$
|
|
4566
|
+
var templateObject_1$J, templateObject_2$w;
|
|
4566
4567
|
|
|
4567
4568
|
var Number$1 = function (props) {
|
|
4568
4569
|
var inputRef = React$3.useRef(null);
|
|
@@ -4601,7 +4602,7 @@ var Number$1 = function (props) {
|
|
|
4601
4602
|
|
|
4602
4603
|
var Paragraph = function (props) { return (jsxRuntime.jsx(StyledParagraph, __assign$2({}, props, { children: props.children }))); };
|
|
4603
4604
|
|
|
4604
|
-
var StyledRadio = styled__default["default"].div(templateObject_1$
|
|
4605
|
+
var StyledRadio = styled__default["default"].div(templateObject_1$I || (templateObject_1$I = __makeTemplateObject$1(["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 14px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :after {\n content: \"\";\n width: 15px;\n height: 15px;\n border-radius: 50%;\n background-color: ", ";\n position: absolute;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 14px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :after {\n content: \"\";\n width: 15px;\n height: 15px;\n border-radius: 50%;\n background-color: ", ";\n position: absolute;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
|
|
4605
4606
|
var checked = _a.checked, disabled = _a.disabled;
|
|
4606
4607
|
if (disabled)
|
|
4607
4608
|
return theme.colors.lightGray.darker;
|
|
@@ -4629,7 +4630,7 @@ var StyledRadio = styled__default["default"].div(templateObject_1$H || (template
|
|
|
4629
4630
|
return theme.colors.green.base;
|
|
4630
4631
|
return "";
|
|
4631
4632
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
4632
|
-
var templateObject_1$
|
|
4633
|
+
var templateObject_1$I;
|
|
4633
4634
|
|
|
4634
4635
|
var Radio = function (props) {
|
|
4635
4636
|
var _a, _b;
|
|
@@ -4661,7 +4662,7 @@ var Radio = function (props) {
|
|
|
4661
4662
|
return (jsxRuntime.jsx(StyledRadio, __assign$2({ checked: checked, disabled: props.disabled, tabIndex: 0, onClick: toggle, onBlur: props.onBlur, onKeyPress: function (e) { return (e.key === "Enter" ? toggle() : null); }, ref: wrapperRef }, { children: jsxRuntime.jsx("input", { type: "radio", disabled: !!props.disabled, id: props.id, name: props.name, value: props.value, ref: inputRef }) })));
|
|
4662
4663
|
};
|
|
4663
4664
|
|
|
4664
|
-
var StyledRange = styled__default["default"].div(templateObject_1$
|
|
4665
|
+
var StyledRange = styled__default["default"].div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject$1(["\n input {\n appearance: none;\n width: 100%;\n height: 11px;\n border: ", ";\n border-radius: 8px;\n position: relative;\n background: ", ";\n\n ::-webkit-slider-thumb {\n appearance: none;\n width: 24px;\n height: 24px;\n background-color: ", ";\n border: ", ";\n border-radius: 50%;\n cursor: ", ";\n }\n }\n"], ["\n input {\n appearance: none;\n width: 100%;\n height: 11px;\n border: ", ";\n border-radius: 8px;\n position: relative;\n background: ", ";\n\n ::-webkit-slider-thumb {\n appearance: none;\n width: 24px;\n height: 24px;\n background-color: ", ";\n border: ", ";\n border-radius: 50%;\n cursor: ", ";\n }\n }\n"])), function () { return "2px solid ".concat(theme.colors.lightGray.dark); }, function (_a) {
|
|
4665
4666
|
var value = _a.value, disabled = _a.disabled;
|
|
4666
4667
|
return "linear-gradient(90deg,\n ".concat(disabled ? theme.colors.lightGray.darker : theme.colors.green.base, " 0%,\n ").concat(disabled ? theme.colors.lightGray.darker : theme.colors.green.base, " ").concat(value, "%,\n ").concat(theme.colors.lightGray.dark, " ").concat(value, "%,\n ").concat(theme.colors.lightGray.dark, " 100%\n )");
|
|
4667
4668
|
}, function () { return theme.colors.lightGray.light; }, function (_a) {
|
|
@@ -4671,7 +4672,7 @@ var StyledRange = styled__default["default"].div(templateObject_1$G || (template
|
|
|
4671
4672
|
var disabled = _a.disabled;
|
|
4672
4673
|
return disabled ? "not-allowed" : "pointer";
|
|
4673
4674
|
});
|
|
4674
|
-
var templateObject_1$
|
|
4675
|
+
var templateObject_1$H;
|
|
4675
4676
|
|
|
4676
4677
|
var Range = function (props) {
|
|
4677
4678
|
var _a;
|
|
@@ -4700,11 +4701,11 @@ var Range = function (props) {
|
|
|
4700
4701
|
return (jsxRuntime.jsx(StyledRange, __assign$2({ value: value, disabled: props.disabled }, { children: jsxRuntime.jsx("input", { type: "range", disabled: !!props.disabled, id: props.id, min: props.min || 0, max: props.max || 100, ref: rangeRef, defaultValue: props.defaultValue, onChange: onChange, onBlur: props.onBlur }) })));
|
|
4701
4702
|
};
|
|
4702
4703
|
|
|
4703
|
-
var Wrapper$5 = styled__default["default"].div(templateObject_1$
|
|
4704
|
+
var Wrapper$5 = styled__default["default"].div(templateObject_1$G || (templateObject_1$G = __makeTemplateObject$1(["\n position: relative;\n\n div {\n pointer-events: none;\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"], ["\n position: relative;\n\n div {\n pointer-events: none;\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"])), function (_a) {
|
|
4704
4705
|
var disabled = _a.disabled;
|
|
4705
4706
|
return (disabled ? "not-allowed" : "pointer");
|
|
4706
4707
|
});
|
|
4707
|
-
var StyledSelect = styled__default["default"].select(templateObject_2$
|
|
4708
|
+
var StyledSelect = styled__default["default"].select(templateObject_2$v || (templateObject_2$v = __makeTemplateObject$1(["\n width: 100%;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 43px 15px 13px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n appearance: none;\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 100%;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 43px 15px 13px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n appearance: none;\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
|
|
4708
4709
|
var disabled = _a.disabled;
|
|
4709
4710
|
return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
4710
4711
|
}, function (_a) {
|
|
@@ -4717,7 +4718,7 @@ var StyledSelect = styled__default["default"].select(templateObject_2$u || (temp
|
|
|
4717
4718
|
var isChanged = _a.isChanged;
|
|
4718
4719
|
return isChanged ? theme.colors.darkGray.base : theme.colors.lightGray.darker;
|
|
4719
4720
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
4720
|
-
var templateObject_1$
|
|
4721
|
+
var templateObject_1$G, templateObject_2$v;
|
|
4721
4722
|
|
|
4722
4723
|
var Select = function (props) {
|
|
4723
4724
|
var _a;
|
|
@@ -4739,18 +4740,18 @@ var Select = function (props) {
|
|
|
4739
4740
|
return (jsxRuntime.jsxs(Wrapper$5, { children: [jsxRuntime.jsx(Icon, { type: "chevronDown", color: "gray", size: "small" }), jsxRuntime.jsxs(StyledSelect, __assign$2({}, props, { onChange: onChange, isChanged: isChanged || props.defaultValue, ref: inputRef }, { children: [props.placeholder && jsxRuntime.jsx("option", __assign$2({ hidden: true }, { children: props.placeholder })), props.children] }))] }));
|
|
4740
4741
|
};
|
|
4741
4742
|
|
|
4742
|
-
var StyledSpacer = styled__default["default"].div(templateObject_1$
|
|
4743
|
+
var StyledSpacer = styled__default["default"].div(templateObject_1$F || (templateObject_1$F = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
|
|
4743
4744
|
var horizontal = _a.horizontal;
|
|
4744
4745
|
return (horizontal ? "".concat(horizontal, "px") : "");
|
|
4745
4746
|
}, function (_a) {
|
|
4746
4747
|
var vertical = _a.vertical;
|
|
4747
4748
|
return (vertical ? "".concat(vertical, "px") : "");
|
|
4748
4749
|
});
|
|
4749
|
-
var templateObject_1$
|
|
4750
|
+
var templateObject_1$F;
|
|
4750
4751
|
|
|
4751
4752
|
var Spacer = function (props) { return (jsxRuntime.jsx(StyledSpacer, __assign$2({}, props))); };
|
|
4752
4753
|
|
|
4753
|
-
var StyledSubheading = styled__default["default"].p(templateObject_1$
|
|
4754
|
+
var StyledSubheading = styled__default["default"].p(templateObject_1$E || (templateObject_1$E = __makeTemplateObject$1(["\n font-family: ", ";\n font-style: normal;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n text-align: ", ";\n margin: 0;\n color: ", ";\n"], ["\n font-family: ", ";\n font-style: normal;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n text-align: ", ";\n margin: 0;\n color: ", ";\n"])), theme.fonts.paragraph, function (_a) {
|
|
4754
4755
|
var size = _a.size;
|
|
4755
4756
|
return size ? theme.subheading[size].fontSize : theme.subheading.medium.fontSize;
|
|
4756
4757
|
}, function (_a) {
|
|
@@ -4778,18 +4779,18 @@ var StyledSubheading = styled__default["default"].p(templateObject_1$D || (templ
|
|
|
4778
4779
|
return theme.colors.darkGray.dark;
|
|
4779
4780
|
}
|
|
4780
4781
|
});
|
|
4781
|
-
var templateObject_1$
|
|
4782
|
+
var templateObject_1$E;
|
|
4782
4783
|
|
|
4783
4784
|
var Subheading = function (props) { return (jsxRuntime.jsx(StyledSubheading, __assign$2({}, props, { children: props.children }))); };
|
|
4784
4785
|
|
|
4785
|
-
var Container$
|
|
4786
|
-
var templateObject_1$
|
|
4786
|
+
var Container$l = styled__default["default"].div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject$1(["\n padding: 7px 10px;\n background-color: ", ";\n box-shadow: 0 2px 0 ", ";\n border: 1px solid ", ";\n border-radius: 4px;\n box-sizing: border-box;\n text-decoration: none;\n\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n color: ", ";\n"], ["\n padding: 7px 10px;\n background-color: ", ";\n box-shadow: 0 2px 0 ", ";\n border: 1px solid ", ";\n border-radius: 4px;\n box-sizing: border-box;\n text-decoration: none;\n\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n color: ", ";\n"])), theme.colors.lightGray.base, theme.colors.lightGray.darker, theme.colors.lightGray.darker, theme.fonts.paragraph, theme.subheading.small.fontSize, theme.subheading.small.fontWeight, theme.colors.darkGray.light);
|
|
4787
|
+
var templateObject_1$D;
|
|
4787
4788
|
|
|
4788
4789
|
var Tag = function (props) {
|
|
4789
|
-
return jsxRuntime.jsx(Container$
|
|
4790
|
+
return jsxRuntime.jsx(Container$l, { children: props.children });
|
|
4790
4791
|
};
|
|
4791
4792
|
|
|
4792
|
-
var Container$
|
|
4793
|
+
var Container$k = styled__default["default"].div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject$1(["\n width: 46px;\n min-width: 46px;\n max-width: 46px;\n height: 27px;\n min-height: 27px;\n max-height: 27px;\n border-radius: 14px;\n cursor: ", ";\n position: relative;\n background-color: ", ";\n\n :after {\n content: \"\";\n width: 21px;\n height: 21px;\n border-radius: 50%;\n position: absolute;\n top: 3px;\n right: ", ";\n left: ", ";\n background-color: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 46px;\n min-width: 46px;\n max-width: 46px;\n height: 27px;\n min-height: 27px;\n max-height: 27px;\n border-radius: 14px;\n cursor: ", ";\n position: relative;\n background-color: ", ";\n\n :after {\n content: \"\";\n width: 21px;\n height: 21px;\n border-radius: 50%;\n position: absolute;\n top: 3px;\n right: ", ";\n left: ", ";\n background-color: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
|
|
4793
4794
|
var disabled = _a.disabled;
|
|
4794
4795
|
return (disabled ? "not-allowed" : "pointer");
|
|
4795
4796
|
}, function (_a) {
|
|
@@ -4807,7 +4808,7 @@ var Container$j = styled__default["default"].div(templateObject_1$B || (template
|
|
|
4807
4808
|
var disabled = _a.disabled;
|
|
4808
4809
|
return disabled ? theme.colors.lightGray.darker : theme.colors.lightGray.light;
|
|
4809
4810
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
4810
|
-
var templateObject_1$
|
|
4811
|
+
var templateObject_1$C;
|
|
4811
4812
|
|
|
4812
4813
|
var Toggle = function (props) {
|
|
4813
4814
|
var _a;
|
|
@@ -4835,10 +4836,10 @@ var Toggle = function (props) {
|
|
|
4835
4836
|
props.onChange(newValue);
|
|
4836
4837
|
}
|
|
4837
4838
|
};
|
|
4838
|
-
return (jsxRuntime.jsx(Container$
|
|
4839
|
+
return (jsxRuntime.jsx(Container$k, __assign$2({ checked: checked, disabled: props.disabled, tabIndex: 0, onClick: toggle, onBlur: props.onBlur, onKeyPress: function (e) { return (e.key === "Enter" ? toggle() : null); }, ref: containerRef }, { children: jsxRuntime.jsx("input", { type: "checkbox", disabled: !!props.disabled, id: props.id, name: props.name, ref: inputRef }) })));
|
|
4839
4840
|
};
|
|
4840
4841
|
|
|
4841
|
-
var Wrapper$4 = styled__default["default"].div(templateObject_1$
|
|
4842
|
+
var Wrapper$4 = styled__default["default"].div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject$1(["\n display: flex;\n align-items: flex-end;\n\n > svg {\n height: ", ";\n }\n"], ["\n display: flex;\n align-items: flex-end;\n\n > svg {\n height: ", ";\n }\n"])), function (_a) {
|
|
4842
4843
|
var level = _a.level;
|
|
4843
4844
|
switch (level) {
|
|
4844
4845
|
case 1:
|
|
@@ -4849,7 +4850,7 @@ var Wrapper$4 = styled__default["default"].div(templateObject_1$A || (templateOb
|
|
|
4849
4850
|
return "70px";
|
|
4850
4851
|
}
|
|
4851
4852
|
});
|
|
4852
|
-
var templateObject_1$
|
|
4853
|
+
var templateObject_1$B;
|
|
4853
4854
|
|
|
4854
4855
|
var trophies = {
|
|
4855
4856
|
1: {
|
|
@@ -4885,7 +4886,7 @@ var trophies = {
|
|
|
4885
4886
|
};
|
|
4886
4887
|
var Trophy = function (props) { return (jsxRuntime.jsx(Wrapper$4, __assign$2({}, props, { children: trophies[props.variant][props.level] }))); };
|
|
4887
4888
|
|
|
4888
|
-
var Container$
|
|
4889
|
+
var Container$j = styled__default["default"].div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject$1(["\n min-height: 44px;\n padding: 10px;\n background-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n display: flex;\n align-items: center;\n gap: 10px;\n\n > div:first-child {\n min-width: 24px;\n min-height: 24px;\n }\n\n p {\n color: ", ";\n }\n"], ["\n min-height: 44px;\n padding: 10px;\n background-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n display: flex;\n align-items: center;\n gap: 10px;\n\n > div:first-child {\n min-width: 24px;\n min-height: 24px;\n }\n\n p {\n color: ", ";\n }\n"])), function (_a) {
|
|
4889
4890
|
var type = _a.type;
|
|
4890
4891
|
switch (type) {
|
|
4891
4892
|
case "success":
|
|
@@ -4902,11 +4903,11 @@ var Container$i = styled__default["default"].div(templateObject_1$z || (template
|
|
|
4902
4903
|
return theme.colors.red.base;
|
|
4903
4904
|
}
|
|
4904
4905
|
});
|
|
4905
|
-
var templateObject_1$
|
|
4906
|
+
var templateObject_1$A;
|
|
4906
4907
|
|
|
4907
|
-
var Alert = function (props) { return (jsxRuntime.jsxs(Container$
|
|
4908
|
+
var Alert = function (props) { return (jsxRuntime.jsxs(Container$j, __assign$2({}, props, { children: [jsxRuntime.jsx(Icon, { size: "small", type: props.type === "success" ? "check" : "warning", color: props.type === "success" ? "green" : "red" }), jsxRuntime.jsx(Paragraph, { children: props.message })] }))); };
|
|
4908
4909
|
|
|
4909
|
-
var StyledCard = styled__default["default"].div(templateObject_1$
|
|
4910
|
+
var StyledCard = styled__default["default"].div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject$1(["\n background-color: ", ";\n border: ", ";\n box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n border-radius: 6px;\n overflow: hidden;\n position: relative;\n\n ", "\n"], ["\n background-color: ", ";\n border: ", ";\n box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n border-radius: 6px;\n overflow: hidden;\n position: relative;\n\n ", "\n"])), theme.colors.lightGray.light, function (_a) {
|
|
4910
4911
|
var bordered = _a.bordered;
|
|
4911
4912
|
return bordered ? "1px solid ".concat(theme.colors.lightGray.dark) : "none";
|
|
4912
4913
|
}, function (_a) {
|
|
@@ -4918,23 +4919,23 @@ var StyledCard = styled__default["default"].div(templateObject_1$y || (templateO
|
|
|
4918
4919
|
}, ";\n\n > div:first-child {\n width: 175%;\n padding-bottom: 175%;\n top: -25%;\n right: -25%;\n }\n }")
|
|
4919
4920
|
: "";
|
|
4920
4921
|
});
|
|
4921
|
-
var Ellipse = styled__default["default"].div(templateObject_2$
|
|
4922
|
+
var Ellipse = styled__default["default"].div(templateObject_2$u || (templateObject_2$u = __makeTemplateObject$1(["\n width: 85%;\n height: 0;\n padding-bottom: 85%;\n border-radius: 50%;\n background-color: ", ";\n opacity: 0.3;\n position: absolute;\n top: -20%;\n right: -20%;\n transition: width 0.75s, padding-bottom 0.75s, top 0.75s, right 0.75s;\n"], ["\n width: 85%;\n height: 0;\n padding-bottom: 85%;\n border-radius: 50%;\n background-color: ", ";\n opacity: 0.3;\n position: absolute;\n top: -20%;\n right: -20%;\n transition: width 0.75s, padding-bottom 0.75s, top 0.75s, right 0.75s;\n"])), function (_a) {
|
|
4922
4923
|
var color = _a.color;
|
|
4923
4924
|
return color ? theme.colors[color].light : "";
|
|
4924
4925
|
});
|
|
4925
|
-
var Content = styled__default["default"].div(templateObject_3$
|
|
4926
|
-
var templateObject_1$
|
|
4926
|
+
var Content = styled__default["default"].div(templateObject_3$a || (templateObject_3$a = __makeTemplateObject$1(["\n height: 100%;\n padding: 15px;\n position: inherit;\n top: 0;\n left: 0;\n"], ["\n height: 100%;\n padding: 15px;\n position: inherit;\n top: 0;\n left: 0;\n"])));
|
|
4927
|
+
var templateObject_1$z, templateObject_2$u, templateObject_3$a;
|
|
4927
4928
|
|
|
4928
4929
|
var Card = function (props) { return (jsxRuntime.jsxs(StyledCard, __assign$2({}, props, { children: [props.ellipse && jsxRuntime.jsx(Ellipse, { color: props.ellipse }), jsxRuntime.jsx(Content, { children: props.children })] }))); };
|
|
4929
4930
|
|
|
4930
|
-
var Fieldset$1 = styled__default["default"].fieldset(templateObject_1$
|
|
4931
|
-
var CheckboxContainer = styled__default["default"].div(templateObject_2$
|
|
4932
|
-
var CheckboxWrapper = styled__default["default"].div(templateObject_3$
|
|
4931
|
+
var Fieldset$1 = styled__default["default"].fieldset(templateObject_1$y || (templateObject_1$y = __makeTemplateObject$1(["\n border: 0;\n margin: 0;\n padding: 0;\n"], ["\n border: 0;\n margin: 0;\n padding: 0;\n"])));
|
|
4932
|
+
var CheckboxContainer = styled__default["default"].div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
|
|
4933
|
+
var CheckboxWrapper = styled__default["default"].div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject$1(["\n display: flex;\n align-items: center;\n\n > div:first-child {\n margin-right: 10px;\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"], ["\n display: flex;\n align-items: center;\n\n > div:first-child {\n margin-right: 10px;\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"])));
|
|
4933
4934
|
var Label$9 = styled__default["default"](StyledParagraph)(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject$1(["\n font-weight: ", ";\n color: ", ";\n display: flex;\n align-items: center;\n cursor: pointer;\n\n a {\n color: ", ";\n }\n"], ["\n font-weight: ", ";\n color: ", ";\n display: flex;\n align-items: center;\n cursor: pointer;\n\n a {\n color: ", ";\n }\n"])), function (_a) {
|
|
4934
4935
|
var weight = _a.weight;
|
|
4935
4936
|
return weight || 500;
|
|
4936
4937
|
}, theme.colors.darkGray.base, theme.colors.blue.base);
|
|
4937
|
-
var templateObject_1$
|
|
4938
|
+
var templateObject_1$y, templateObject_2$t, templateObject_3$9, templateObject_4$6;
|
|
4938
4939
|
|
|
4939
4940
|
var Checkboxes = function (props) {
|
|
4940
4941
|
var _a = React$3.useState(props.defaultValue || []), values = _a[0], setValues = _a[1];
|
|
@@ -4957,12 +4958,12 @@ var Checkboxes = function (props) {
|
|
|
4957
4958
|
}) })] }));
|
|
4958
4959
|
};
|
|
4959
4960
|
|
|
4960
|
-
var Container$
|
|
4961
|
-
var Item = styled__default["default"].div(templateObject_2$
|
|
4961
|
+
var Container$i = styled__default["default"].div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject$1(["\n width: 100%;\n background-color: ", ";\n box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n border-radius: 6px;\n padding: 10px 20px;\n"], ["\n width: 100%;\n background-color: ", ";\n box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n border-radius: 6px;\n padding: 10px 20px;\n"])), theme.colors.lightGray.light);
|
|
4962
|
+
var Item = styled__default["default"].div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject$1(["\n padding: 10px 0;\n cursor: pointer;\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 5px;\n }\n\n p {\n display: ", ";\n }\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n"], ["\n padding: 10px 0;\n cursor: pointer;\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 5px;\n }\n\n p {\n display: ", ";\n }\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n"])), function (_a) {
|
|
4962
4963
|
var isOpen = _a.isOpen;
|
|
4963
4964
|
return (isOpen ? "" : "none");
|
|
4964
4965
|
}, theme.colors.lightGray.dark);
|
|
4965
|
-
var templateObject_1$
|
|
4966
|
+
var templateObject_1$x, templateObject_2$s;
|
|
4966
4967
|
|
|
4967
4968
|
var Collapse = function (props) {
|
|
4968
4969
|
var _a = React$3.useState([]), openItems = _a[0], setOpenItems = _a[1];
|
|
@@ -4974,18 +4975,18 @@ var Collapse = function (props) {
|
|
|
4974
4975
|
setOpenItems(function (prevState) { return __spreadArray(__spreadArray([], prevState, true), [index], false); });
|
|
4975
4976
|
}
|
|
4976
4977
|
};
|
|
4977
|
-
return (jsxRuntime.jsx(Container$
|
|
4978
|
+
return (jsxRuntime.jsx(Container$i, __assign$2({}, props, { children: props.items.map(function (item, index) {
|
|
4978
4979
|
var isOpen = openItems.includes(index);
|
|
4979
4980
|
return (jsxRuntime.jsxs(Item, __assign$2({ isOpen: isOpen, onClick: function () { return onClickItem(index, isOpen); } }, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: item.title })), jsxRuntime.jsx(Icon, { type: isOpen ? "chevronUp" : "chevronDown", color: "blue" })] }), jsxRuntime.jsx(Paragraph, __assign$2({ weight: "regular" }, { children: item.content }))] }), "".concat(item.title, "-").concat(index)));
|
|
4980
4981
|
}) })));
|
|
4981
4982
|
};
|
|
4982
4983
|
|
|
4983
|
-
var Wrapper$3 = styled__default["default"].div(templateObject_1$
|
|
4984
|
-
var Value = styled__default["default"].div(templateObject_2$
|
|
4984
|
+
var Wrapper$3 = styled__default["default"].div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject$1(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
4985
|
+
var Value = styled__default["default"].div(templateObject_2$r || (templateObject_2$r = __makeTemplateObject$1(["\n width: 40px;\n height: 32px;\n background-color: ", ";\n border-radius: 6px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 0 6px;\n\n h5 {\n color: ", ";\n }\n\n :first-child {\n margin-left: 0;\n }\n"], ["\n width: 40px;\n height: 32px;\n background-color: ", ";\n border-radius: 6px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 0 6px;\n\n h5 {\n color: ", ";\n }\n\n :first-child {\n margin-left: 0;\n }\n"])), function (_a) {
|
|
4985
4986
|
var contrast = _a.contrast;
|
|
4986
4987
|
return contrast ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
4987
4988
|
}, theme.colors.darkGray.base);
|
|
4988
|
-
var templateObject_1$
|
|
4989
|
+
var templateObject_1$w, templateObject_2$r;
|
|
4989
4990
|
|
|
4990
4991
|
var Countdown = function (_a) {
|
|
4991
4992
|
var till = _a.till, contrast = _a.contrast;
|
|
@@ -5012,9 +5013,9 @@ var Countdown = function (_a) {
|
|
|
5012
5013
|
return (jsxRuntime.jsxs(Wrapper$3, { children: [jsxRuntime.jsx(Value, __assign$2({ contrast: contrast }, { children: jsxRuntime.jsx(Heading, __assign$2({ type: "h5" }, { children: HH })) })), jsxRuntime.jsx(Heading, __assign$2({ type: "h5", color: color }, { children: ":" })), jsxRuntime.jsx(Value, __assign$2({ contrast: contrast }, { children: jsxRuntime.jsx(Heading, __assign$2({ type: "h5" }, { children: MM })) })), jsxRuntime.jsx(Heading, __assign$2({ type: "h5", color: color }, { children: ":" })), jsxRuntime.jsx(Value, __assign$2({ contrast: contrast }, { children: jsxRuntime.jsx(Heading, __assign$2({ type: "h5" }, { children: SS })) }))] }));
|
|
5013
5014
|
};
|
|
5014
5015
|
|
|
5015
|
-
var Container$
|
|
5016
|
-
var Label$8 = styled__default["default"](StyledParagraph)(templateObject_2$
|
|
5017
|
-
var templateObject_1$
|
|
5016
|
+
var Container$h = styled__default["default"].div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
|
|
5017
|
+
var Label$8 = styled__default["default"](StyledParagraph)(templateObject_2$q || (templateObject_2$q = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
5018
|
+
var templateObject_1$v, templateObject_2$q;
|
|
5018
5019
|
|
|
5019
5020
|
var DateInputField = function (props) {
|
|
5020
5021
|
var onChange = function (value) {
|
|
@@ -5025,10 +5026,10 @@ var DateInputField = function (props) {
|
|
|
5025
5026
|
if (props.onBlur)
|
|
5026
5027
|
props.onBlur(props.name);
|
|
5027
5028
|
};
|
|
5028
|
-
return (jsxRuntime.jsxs(Container$
|
|
5029
|
+
return (jsxRuntime.jsxs(Container$h, { children: [jsxRuntime.jsx(Label$8, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Input.Date, { defaultValue: props.defaultValue, min: props.min, max: props.max, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, id: props.name, onChange: onChange, onBlur: onBlur })] }));
|
|
5029
5030
|
};
|
|
5030
5031
|
|
|
5031
|
-
var StyledIconButton = styled__default["default"](StyledButton)(templateObject_1$
|
|
5032
|
+
var StyledIconButton = styled__default["default"](StyledButton)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject$1(["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n > div:first-child {\n margin-top: -2px;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"], ["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n > div:first-child {\n margin-top: -2px;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"])), function (_a) {
|
|
5032
5033
|
var size = _a.size;
|
|
5033
5034
|
return (size === "small" ? "30px" : "40px");
|
|
5034
5035
|
}, function (_a) {
|
|
@@ -5047,7 +5048,7 @@ var StyledIconButton = styled__default["default"](StyledButton)(templateObject_1
|
|
|
5047
5048
|
var size = _a.size;
|
|
5048
5049
|
return (size === "small" ? "28px" : "38px");
|
|
5049
5050
|
});
|
|
5050
|
-
var GhostIconButton = styled__default["default"](GhostButton)(templateObject_2$
|
|
5051
|
+
var GhostIconButton = styled__default["default"](GhostButton)(templateObject_2$p || (templateObject_2$p = __makeTemplateObject$1(["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"], ["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"])), function (_a) {
|
|
5051
5052
|
var size = _a.size;
|
|
5052
5053
|
return (size === "small" ? "30px" : "40px");
|
|
5053
5054
|
}, function (_a) {
|
|
@@ -5066,7 +5067,7 @@ var GhostIconButton = styled__default["default"](GhostButton)(templateObject_2$o
|
|
|
5066
5067
|
var size = _a.size;
|
|
5067
5068
|
return (size === "small" ? "32px" : "40px");
|
|
5068
5069
|
});
|
|
5069
|
-
var templateObject_1$
|
|
5070
|
+
var templateObject_1$u, templateObject_2$p;
|
|
5070
5071
|
|
|
5071
5072
|
var IconButton = function (props) {
|
|
5072
5073
|
if (props.color === "white")
|
|
@@ -5074,9 +5075,9 @@ var IconButton = function (props) {
|
|
|
5074
5075
|
return (jsxRuntime.jsx(StyledIconButton, __assign$2({}, props, { children: jsxRuntime.jsx(Icon, { type: props.icon, size: props.size === "small" ? "tiny" : "small", color: "white" }) })));
|
|
5075
5076
|
};
|
|
5076
5077
|
|
|
5077
|
-
var Container$
|
|
5078
|
-
var Label$7 = styled__default["default"](StyledParagraph)(templateObject_2$
|
|
5079
|
-
var templateObject_1$
|
|
5078
|
+
var Container$g = styled__default["default"].div(templateObject_1$t || (templateObject_1$t = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
|
|
5079
|
+
var Label$7 = styled__default["default"](StyledParagraph)(templateObject_2$o || (templateObject_2$o = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
5080
|
+
var templateObject_1$t, templateObject_2$o;
|
|
5080
5081
|
|
|
5081
5082
|
var InputField = function (props) {
|
|
5082
5083
|
var onChange = function (value) {
|
|
@@ -5087,10 +5088,10 @@ var InputField = function (props) {
|
|
|
5087
5088
|
if (props.onBlur)
|
|
5088
5089
|
props.onBlur(props.name);
|
|
5089
5090
|
};
|
|
5090
|
-
return (jsxRuntime.jsxs(Container$
|
|
5091
|
+
return (jsxRuntime.jsxs(Container$g, { children: [jsxRuntime.jsx(Label$7, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Input, { defaultValue: props.defaultValue, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, placeholder: props.placeholder, id: props.name, onChange: onChange, onBlur: onBlur }), props.tips && (jsxRuntime.jsxs("div", __assign$2({ style: { marginLeft: "5px" } }, { children: [jsxRuntime.jsx(Spacer, { vertical: 5 }), props.tips.map(function (tip, index) { return (jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small", weight: "regular" }, { children: ["\u2022 ", tip] }), "".concat(tip, "-").concat(index))); })] })))] }));
|
|
5091
5092
|
};
|
|
5092
5093
|
|
|
5093
|
-
var Container$
|
|
5094
|
+
var Container$f = styled__default["default"].div(templateObject_1$s || (templateObject_1$s = __makeTemplateObject$1(["\n min-width: 74px;\n max-width: 74px;\n width: fit-content;\n height: 74px;\n background-color: ", ";\n box-sizing: border-box;\n\n border: 4px solid;\n border-radius: 6px;\n border-color: ", ";\n\n padding: 8px 24px;\n margin-right: 6px;\n margin-left: 6px;\n margin-bottom: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n position: relative;\n text-transform: uppercase;\n\n h1 {\n color: ", ";\n }\n\n > svg {\n fill: ", ";\n }\n"], ["\n min-width: 74px;\n max-width: 74px;\n width: fit-content;\n height: 74px;\n background-color: ", ";\n box-sizing: border-box;\n\n border: 4px solid;\n border-radius: 6px;\n border-color: ", ";\n\n padding: 8px 24px;\n margin-right: 6px;\n margin-left: 6px;\n margin-bottom: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n position: relative;\n text-transform: uppercase;\n\n h1 {\n color: ", ";\n }\n\n > svg {\n fill: ", ";\n }\n"])), function (_a) {
|
|
5094
5095
|
var status = _a.status, color = _a.color;
|
|
5095
5096
|
switch (status) {
|
|
5096
5097
|
case "passed":
|
|
@@ -5134,23 +5135,23 @@ var Container$e = styled__default["default"].div(templateObject_1$r || (template
|
|
|
5134
5135
|
return theme.colors.darkGray.light;
|
|
5135
5136
|
}
|
|
5136
5137
|
});
|
|
5137
|
-
var CheckIconWrapper = styled__default["default"].div(templateObject_2$
|
|
5138
|
-
var templateObject_1$
|
|
5138
|
+
var CheckIconWrapper = styled__default["default"].div(templateObject_2$n || (templateObject_2$n = __makeTemplateObject$1(["\n position: absolute;\n top: 0;\n right: 0;\n"], ["\n position: absolute;\n top: 0;\n right: 0;\n"])));
|
|
5139
|
+
var templateObject_1$s, templateObject_2$n;
|
|
5139
5140
|
|
|
5140
|
-
var Key$1 = function (props) { return (jsxRuntime.jsxs(Container$
|
|
5141
|
+
var Key$1 = function (props) { return (jsxRuntime.jsxs(Container$f, __assign$2({}, props, { children: [props.status === "passed" && (jsxRuntime.jsx(CheckIconWrapper, { children: jsxRuntime.jsx(Icon, { type: "check", color: "green", size: "small" }) })), props.char === " " ? (jsxRuntime.jsx("svg", __assign$2({ width: "28", height: "28", viewBox: "0 0 28 1", style: {
|
|
5141
5142
|
marginTop: "13px",
|
|
5142
5143
|
transform: "scale(2)",
|
|
5143
5144
|
} }, { children: jsxRuntime.jsx("path", { d: "M0 4.5V1C0 0.447715 0.447715 0 1 0H2C2.55228 0 3 0.447715 3 1V4H25V1C25 0.447715 25.4477 0 26 0H27C27.5523 0 28 0.447715 28 1V4.5C28 5.88071 26.8807 7 25.5 7H2.5C1.11929 7 0 5.88071 0 4.5Z" }) }))) : (jsxRuntime.jsx(Heading, __assign$2({ type: "h1" }, { children: props.char })))] }))); };
|
|
5144
5145
|
|
|
5145
|
-
var Wrapper$2 = styled__default["default"].a(templateObject_1$
|
|
5146
|
+
var Wrapper$2 = styled__default["default"].a(templateObject_1$r || (templateObject_1$r = __makeTemplateObject$1(["\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n\n > div {\n width: 19px;\n height: 19px;\n margin-right: ", ";\n margin-left: ", ";\n }\n"], ["\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n\n > div {\n width: 19px;\n height: 19px;\n margin-right: ", ";\n margin-left: ", ";\n }\n"])), function (_a) {
|
|
5146
5147
|
var chevron = _a.chevron;
|
|
5147
5148
|
return (chevron === "left" ? "4px" : "");
|
|
5148
5149
|
}, function (_a) {
|
|
5149
5150
|
var chevron = _a.chevron;
|
|
5150
5151
|
return (chevron === "right" ? "4px" : "");
|
|
5151
5152
|
});
|
|
5152
|
-
var StyledLink = styled__default["default"](StyledParagraph)(templateObject_2$
|
|
5153
|
-
var templateObject_1$
|
|
5153
|
+
var StyledLink = styled__default["default"](StyledParagraph)(templateObject_2$m || (templateObject_2$m = __makeTemplateObject$1(["\n color: ", ";\n\n :hover {\n text-decoration: underline;\n }\n"], ["\n color: ", ";\n\n :hover {\n text-decoration: underline;\n }\n"])), theme.colors.darkGray.dark);
|
|
5154
|
+
var templateObject_1$r, templateObject_2$m;
|
|
5154
5155
|
|
|
5155
5156
|
var Link = function (props) {
|
|
5156
5157
|
var onClick = function (e) {
|
|
@@ -5162,15 +5163,15 @@ var Link = function (props) {
|
|
|
5162
5163
|
return (jsxRuntime.jsxs(Wrapper$2, __assign$2({ chevron: props.chevron, href: props.href, onClick: onClick }, { children: [props.chevron === "left" && jsxRuntime.jsx(Icon, { type: "chevronLeft", color: "green" }), jsxRuntime.jsx(StyledLink, __assign$2({ size: "large" }, { children: props.children })), props.chevron !== "none" && props.chevron !== "left" && (jsxRuntime.jsx(Icon, { type: "chevronRight", color: "green" }))] })));
|
|
5163
5164
|
};
|
|
5164
5165
|
|
|
5165
|
-
var Container$
|
|
5166
|
+
var Container$e = styled__default["default"].div(templateObject_1$q || (templateObject_1$q = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: center;\n padding-top: ", ";\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n padding-top: ", ";\n"])), function (_a) {
|
|
5166
5167
|
var text = _a.text;
|
|
5167
5168
|
return (text ? "20px" : "");
|
|
5168
5169
|
});
|
|
5169
|
-
var templateObject_1$
|
|
5170
|
+
var templateObject_1$q;
|
|
5170
5171
|
|
|
5171
|
-
var Loading = function (props) { return (jsxRuntime.jsxs(Container$
|
|
5172
|
+
var Loading = function (props) { return (jsxRuntime.jsxs(Container$e, __assign$2({}, props, { children: [jsxRuntime.jsx(_default, { color: theme.colors[props.color].base, speedMultiplier: 0.5 }), props.text && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Spacer, { vertical: 20 }), jsxRuntime.jsx(Heading, __assign$2({ type: "h6", color: props.textColor || "black" }, { children: props.text }))] }))] }))); };
|
|
5172
5173
|
|
|
5173
|
-
var Container$
|
|
5174
|
+
var Container$d = styled__default["default"].div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject$1(["\n padding: 15px;\n background-color: ", ";\n border-radius: 6px 6px 0 0;\n position: relative;\n cursor: pointer;\n"], ["\n padding: 15px;\n background-color: ", ";\n border-radius: 6px 6px 0 0;\n position: relative;\n cursor: pointer;\n"])), function (_a) {
|
|
5174
5175
|
var dropdownIsVisible = _a.dropdownIsVisible, color = _a.color;
|
|
5175
5176
|
if (dropdownIsVisible) {
|
|
5176
5177
|
switch (color) {
|
|
@@ -5183,8 +5184,8 @@ var Container$c = styled__default["default"].div(templateObject_1$o || (template
|
|
|
5183
5184
|
}
|
|
5184
5185
|
return "";
|
|
5185
5186
|
});
|
|
5186
|
-
var SelectedLocaleWrapper = styled__default["default"].div(templateObject_2$
|
|
5187
|
-
var DropdownContainer = styled__default["default"].div(templateObject_3$
|
|
5187
|
+
var SelectedLocaleWrapper = styled__default["default"].div(templateObject_2$l || (templateObject_2$l = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n"])));
|
|
5188
|
+
var DropdownContainer = styled__default["default"].div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject$1(["\n min-width: 100%;\n background-color: ", ";\n overflow: hidden;\n border-radius: 6px 0 6px 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n position: absolute;\n top: 50px;\n right: 0;\n"], ["\n min-width: 100%;\n background-color: ", ";\n overflow: hidden;\n border-radius: 6px 0 6px 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n position: absolute;\n top: 50px;\n right: 0;\n"])), function (_a) {
|
|
5188
5189
|
var color = _a.color;
|
|
5189
5190
|
switch (color) {
|
|
5190
5191
|
default:
|
|
@@ -5195,7 +5196,7 @@ var DropdownContainer = styled__default["default"].div(templateObject_3$7 || (te
|
|
|
5195
5196
|
}
|
|
5196
5197
|
});
|
|
5197
5198
|
var LocaleWrapper = styled__default["default"].div(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 10px 15px;\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n\n p {\n white-space: nowrap;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n p {\n color: ", ";\n }\n svg {\n fill: ", ";\n }\n }\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 10px 15px;\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n\n p {\n white-space: nowrap;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n p {\n color: ", ";\n }\n svg {\n fill: ", ";\n }\n }\n"])), theme.colors.lightGray.darker, theme.colors.lightGray.base, theme.colors.blue.base, theme.colors.blue.base);
|
|
5198
|
-
var templateObject_1$
|
|
5199
|
+
var templateObject_1$p, templateObject_2$l, templateObject_3$8, templateObject_4$5;
|
|
5199
5200
|
|
|
5200
5201
|
var LocaleSelect = function (props) {
|
|
5201
5202
|
var _a = React$3.useState(false), dropdownIsVisible = _a[0], setDropdownIsVisible = _a[1];
|
|
@@ -5204,22 +5205,22 @@ var LocaleSelect = function (props) {
|
|
|
5204
5205
|
setLocale(locale);
|
|
5205
5206
|
props.onChange(locale);
|
|
5206
5207
|
};
|
|
5207
|
-
return (jsxRuntime.jsxs(Container$
|
|
5208
|
+
return (jsxRuntime.jsxs(Container$d, __assign$2({ color: props.color || "light", dropdownIsVisible: dropdownIsVisible, onClick: function () { return setDropdownIsVisible(!dropdownIsVisible); }, onMouseLeave: function () { return setDropdownIsVisible(false); } }, { children: [jsxRuntime.jsxs(SelectedLocaleWrapper, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Flag, { locale: locale }), jsxRuntime.jsx(Spacer, { horizontal: 10 }), jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: getNativeLanguageByLocale_1(locale) }))] }), dropdownIsVisible ? (jsxRuntime.jsx(Icon, { type: "chevronUp", size: "small", color: "darkGray" })) : (jsxRuntime.jsx(Icon, { type: "chevronDown", size: "small", color: "darkGray" }))] }), dropdownIsVisible && (jsxRuntime.jsx(DropdownContainer, __assign$2({ color: props.color || "light" }, { children: props.locales
|
|
5208
5209
|
.filter(function (l) { return l !== locale; })
|
|
5209
5210
|
.map(function (locale) { return (jsxRuntime.jsxs(LocaleWrapper, __assign$2({ onClick: function () { return onSelectLocale(locale); } }, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Flag, { locale: locale }), jsxRuntime.jsx(Spacer, { horizontal: 10 }), jsxRuntime.jsx(Paragraph, __assign$2({ size: "small", weight: "regular", color: "darkGray" }, { children: getNativeLanguageByLocale_1(locale) }))] }), jsxRuntime.jsx(Icon, { type: "chevronRight", size: "small", color: "darkGray" })] }), locale)); }) })))] })));
|
|
5210
5211
|
};
|
|
5211
5212
|
|
|
5212
|
-
var Wrapper$1 = styled__default["default"].div(templateObject_1$
|
|
5213
|
-
var templateObject_1$
|
|
5213
|
+
var Wrapper$1 = styled__default["default"].div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject$1(["\n width: 100%;\n min-width: 200px;\n display: flex;\n justify-content: space-between;\n\n > div {\n display: flex;\n align-items: center;\n }\n"], ["\n width: 100%;\n min-width: 200px;\n display: flex;\n justify-content: space-between;\n\n > div {\n display: flex;\n align-items: center;\n }\n"])));
|
|
5214
|
+
var templateObject_1$o;
|
|
5214
5215
|
|
|
5215
5216
|
var Medals = function (props) { return (jsxRuntime.jsxs(Wrapper$1, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Medal, { type: Medal$1.GOLD }), jsxRuntime.jsx(Spacer, { horizontal: 5 }), jsxRuntime.jsxs(Heading, __assign$2({ type: "h6" }, { children: ["x ", props.gold || 0] }))] }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Medal, { type: Medal$1.SILVER }), jsxRuntime.jsx(Spacer, { horizontal: 5 }), jsxRuntime.jsxs(Heading, __assign$2({ type: "h6" }, { children: ["x ", props.silver || 0] }))] }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Medal, { type: Medal$1.BRONZE }), jsxRuntime.jsx(Spacer, { horizontal: 5 }), jsxRuntime.jsxs(Heading, __assign$2({ type: "h6" }, { children: ["x ", props.bronze || 0] }))] })] })); };
|
|
5216
5217
|
|
|
5217
|
-
var NotificationContainer = styled__default["default"].div(templateObject_1$
|
|
5218
|
+
var NotificationContainer = styled__default["default"].div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject$1(["\n width: fit-content;\n max-width: 460px;\n padding: 15px;\n border-radius: 6px;\n background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 15px;\n }\n"], ["\n width: fit-content;\n max-width: 460px;\n padding: 15px;\n border-radius: 6px;\n background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 15px;\n }\n"])), function (_a) {
|
|
5218
5219
|
var contrast = _a.contrast;
|
|
5219
5220
|
return contrast ? theme.colors.lightGray.light : theme.colors.lightGray.base;
|
|
5220
5221
|
});
|
|
5221
|
-
var ButtonContainer = styled__default["default"].div(templateObject_2$
|
|
5222
|
-
var templateObject_1$
|
|
5222
|
+
var ButtonContainer = styled__default["default"].div(templateObject_2$k || (templateObject_2$k = __makeTemplateObject$1(["\n margin-top: 20px;\n display: flex;\n\n > *:first-child {\n margin-right: 10px;\n }\n"], ["\n margin-top: 20px;\n display: flex;\n\n > *:first-child {\n margin-right: 10px;\n }\n"])));
|
|
5223
|
+
var templateObject_1$n, templateObject_2$k;
|
|
5223
5224
|
|
|
5224
5225
|
var Notification = function (props) {
|
|
5225
5226
|
if (!props.isVisible)
|
|
@@ -5227,9 +5228,9 @@ var Notification = function (props) {
|
|
|
5227
5228
|
return (jsxRuntime.jsxs(NotificationContainer, __assign$2({ contrast: !!props.contrast }, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h4" }, { children: props.title })), props.onClose && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Spacer, { horizontal: 15 }), jsxRuntime.jsx(IconButton, { icon: "cross", color: "green", onClick: props.onClose })] }))] }), jsxRuntime.jsx(Paragraph, __assign$2({ size: "small", weight: "regular", color: "darkGray" }, { children: props.content })), props.buttons && (jsxRuntime.jsx(ButtonContainer, { children: props.buttons.map(function (button, index) { return (React$3.createElement(Button, __assign$2({}, button, { size: "small", color: index + 1 === props.buttons.length ? "blue" : "white", key: "button-".concat(index) }))); }) }))] })));
|
|
5228
5229
|
};
|
|
5229
5230
|
|
|
5230
|
-
var Container$
|
|
5231
|
-
var Label$6 = styled__default["default"](StyledParagraph)(templateObject_2$
|
|
5232
|
-
var templateObject_1$
|
|
5231
|
+
var Container$c = styled__default["default"].div(templateObject_1$m || (templateObject_1$m = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
|
|
5232
|
+
var Label$6 = styled__default["default"](StyledParagraph)(templateObject_2$j || (templateObject_2$j = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
5233
|
+
var templateObject_1$m, templateObject_2$j;
|
|
5233
5234
|
|
|
5234
5235
|
var NumberField = function (props) {
|
|
5235
5236
|
var onChange = function (value) {
|
|
@@ -5240,12 +5241,12 @@ var NumberField = function (props) {
|
|
|
5240
5241
|
if (props.onBlur)
|
|
5241
5242
|
props.onBlur(props.name);
|
|
5242
5243
|
};
|
|
5243
|
-
return (jsxRuntime.jsxs(Container$
|
|
5244
|
+
return (jsxRuntime.jsxs(Container$c, { children: [jsxRuntime.jsx(Label$6, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Number$1, { min: props.min, max: props.max, defaultValue: props.defaultValue, autoComplete: props.autoComplete, disabled: props.disabled, autoFocus: props.autoFocus, id: props.name, onChange: onChange, onBlur: onBlur })] }));
|
|
5244
5245
|
};
|
|
5245
5246
|
|
|
5246
|
-
var Container$
|
|
5247
|
-
var Label$5 = styled__default["default"](StyledParagraph)(templateObject_2$
|
|
5248
|
-
var templateObject_1$
|
|
5247
|
+
var Container$b = styled__default["default"].div(templateObject_1$l || (templateObject_1$l = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
|
|
5248
|
+
var Label$5 = styled__default["default"](StyledParagraph)(templateObject_2$i || (templateObject_2$i = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
5249
|
+
var templateObject_1$l, templateObject_2$i;
|
|
5249
5250
|
|
|
5250
5251
|
var PasswordInputField = function (props) {
|
|
5251
5252
|
var onChange = function (value) {
|
|
@@ -5261,7 +5262,7 @@ var PasswordInputField = function (props) {
|
|
|
5261
5262
|
if (props.onBlur)
|
|
5262
5263
|
props.onBlur(props.name);
|
|
5263
5264
|
};
|
|
5264
|
-
return (jsxRuntime.jsxs(Container$
|
|
5265
|
+
return (jsxRuntime.jsxs(Container$b, { children: [jsxRuntime.jsx(Label$5, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Input.Password, { defaultValue: props.defaultValue, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, placeholder: props.placeholder, helperLocale: props.helperLocale, id: props.name, onChange: onChange, onKeyPress: onKeyPress, onBlur: onBlur })] }));
|
|
5265
5266
|
};
|
|
5266
5267
|
|
|
5267
5268
|
var generateRandomString = function (length) {
|
|
@@ -5274,7 +5275,7 @@ var generateRandomString = function (length) {
|
|
|
5274
5275
|
return string;
|
|
5275
5276
|
};
|
|
5276
5277
|
|
|
5277
|
-
var PopupContainer = styled__default["default"].div(templateObject_1$
|
|
5278
|
+
var PopupContainer = styled__default["default"].div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject$1(["\n width: fit-content;\n max-width: 25vw;\n position: fixed;\n opacity: ", ";\n top: ", ";\n left: ", ";\n padding: 15px;\n margin-top: 10px;\n border-radius: 6px;\n border: ", ";\n background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n pointer-events: none;\n z-index: 9;\n"], ["\n width: fit-content;\n max-width: 25vw;\n position: fixed;\n opacity: ", ";\n top: ", ";\n left: ", ";\n padding: 15px;\n margin-top: 10px;\n border-radius: 6px;\n border: ", ";\n background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n pointer-events: none;\n z-index: 9;\n"])), function (_a) {
|
|
5278
5279
|
var isVisible = _a.isVisible;
|
|
5279
5280
|
return (isVisible ? "100%" : "0%");
|
|
5280
5281
|
}, function (_a) {
|
|
@@ -5287,7 +5288,7 @@ var PopupContainer = styled__default["default"].div(templateObject_1$j || (templ
|
|
|
5287
5288
|
var contrast = _a.contrast;
|
|
5288
5289
|
return contrast ? theme.colors.lightGray.light : theme.colors.lightGray.base;
|
|
5289
5290
|
});
|
|
5290
|
-
var templateObject_1$
|
|
5291
|
+
var templateObject_1$k;
|
|
5291
5292
|
|
|
5292
5293
|
var Popup = function (props) {
|
|
5293
5294
|
var popupRef = React$3.useRef(null);
|
|
@@ -5323,24 +5324,24 @@ var Popup = function (props) {
|
|
|
5323
5324
|
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [children, jsxRuntime.jsxs(PopupContainer, __assign$2({}, position, { isVisible: isVisible, ref: popupRef, contrast: props.contrast }, { children: [props.title && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: props.title })), jsxRuntime.jsx(Spacer, { vertical: 10 })] })), jsxRuntime.jsx(Paragraph, __assign$2({ size: "small", weight: "regular" }, { children: props.content }))] }))] }));
|
|
5324
5325
|
};
|
|
5325
5326
|
|
|
5326
|
-
var Wrapper = styled__default["default"].div(templateObject_1$
|
|
5327
|
-
var StyledProgressBar = styled__default["default"].div(templateObject_2$
|
|
5327
|
+
var Wrapper = styled__default["default"].div(templateObject_1$j || (templateObject_1$j = __makeTemplateObject$1(["\n width: 100%;\n display: flex;\n align-items: center;\n"], ["\n width: 100%;\n display: flex;\n align-items: center;\n"])));
|
|
5328
|
+
var StyledProgressBar = styled__default["default"].div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject$1(["\n width: 100%;\n height: 15px;\n position: relative;\n background-color: ", ";\n border-radius: 8px;\n margin-right: ", ";\n"], ["\n width: 100%;\n height: 15px;\n position: relative;\n background-color: ", ";\n border-radius: 8px;\n margin-right: ", ";\n"])), theme.colors.lightGray.dark, function (_a) {
|
|
5328
5329
|
var showInfo = _a.showInfo;
|
|
5329
5330
|
return (showInfo ? "10px" : "");
|
|
5330
5331
|
});
|
|
5331
|
-
var Indicator$1 = styled__default["default"].div(templateObject_3$
|
|
5332
|
+
var Indicator$1 = styled__default["default"].div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject$1(["\n width: ", ";\n max-width: calc(100% - 6px);\n height: 9px;\n position: relative;\n background-color: ", ";\n border-radius: 8px;\n top: 3px;\n left: 3px;\n"], ["\n width: ", ";\n max-width: calc(100% - 6px);\n height: 9px;\n position: relative;\n background-color: ", ";\n border-radius: 8px;\n top: 3px;\n left: 3px;\n"])), function (_a) {
|
|
5332
5333
|
var percent = _a.percent;
|
|
5333
5334
|
return "calc(".concat(percent, "% - 6px)");
|
|
5334
5335
|
}, function (_a) {
|
|
5335
5336
|
var color = _a.color;
|
|
5336
5337
|
return color ? theme.colors[color].base : theme.colors.green.base;
|
|
5337
5338
|
});
|
|
5338
|
-
var templateObject_1$
|
|
5339
|
+
var templateObject_1$j, templateObject_2$h, templateObject_3$7;
|
|
5339
5340
|
|
|
5340
5341
|
var ProgressBar = function (props) { return (jsxRuntime.jsxs(Wrapper, { children: [jsxRuntime.jsx(StyledProgressBar, __assign$2({}, props, { children: jsxRuntime.jsx(Indicator$1, __assign$2({}, props)) })), props.showInfo && (jsxRuntime.jsx(Paragraph, __assign$2({ size: "small" }, { children: props.info ? props.info : "".concat(props.percent, "%") })))] })); };
|
|
5341
5342
|
|
|
5342
|
-
var Container$
|
|
5343
|
-
var Step$1 = styled__default["default"].li(templateObject_2$
|
|
5343
|
+
var Container$a = styled__default["default"].ol(templateObject_1$i || (templateObject_1$i = __makeTemplateObject$1(["\n display: flex;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"], ["\n display: flex;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"])));
|
|
5344
|
+
var Step$1 = styled__default["default"].li(templateObject_2$g || (templateObject_2$g = __makeTemplateObject$1(["\n flex: 1;\n display: flex;\n flex-direction: column;\n text-align: center;\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin: 0 auto;\n cursor: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n border: 10px solid ", ";\n position: relative;\n z-index: 1;\n }\n\n > div h6 {\n color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :not(:last-child):after {\n content: \"\";\n height: 4px;\n position: relative;\n top: ", ";\n left: 50%;\n background-color: ", ";\n order: -1;\n }\n\n :last-child {\n margin-top: 4px;\n }\n"], ["\n flex: 1;\n display: flex;\n flex-direction: column;\n text-align: center;\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin: 0 auto;\n cursor: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n border: 10px solid ", ";\n position: relative;\n z-index: 1;\n }\n\n > div h6 {\n color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :not(:last-child):after {\n content: \"\";\n height: 4px;\n position: relative;\n top: ", ";\n left: 50%;\n background-color: ", ";\n order: -1;\n }\n\n :last-child {\n margin-top: 4px;\n }\n"])), function (_a) {
|
|
5344
5345
|
var status = _a.status;
|
|
5345
5346
|
return (!!status ? "pointer" : "not-allowed");
|
|
5346
5347
|
}, function (_a) {
|
|
@@ -5362,9 +5363,9 @@ var Step$1 = styled__default["default"].li(templateObject_2$f || (templateObject
|
|
|
5362
5363
|
var hasTitle = _a.hasTitle;
|
|
5363
5364
|
return (hasTitle ? "calc(50% - 12px)" : "50%");
|
|
5364
5365
|
}, theme.colors.lightGray.dark);
|
|
5365
|
-
var templateObject_1$
|
|
5366
|
+
var templateObject_1$i, templateObject_2$g;
|
|
5366
5367
|
|
|
5367
|
-
var Steps$2 = function (props) { return (jsxRuntime.jsx(Container$
|
|
5368
|
+
var Steps$2 = function (props) { return (jsxRuntime.jsx(Container$a, { children: props.steps.map(function (_a, index) {
|
|
5368
5369
|
var title = _a.title, onClick = _a.onClick;
|
|
5369
5370
|
var step = index + 1;
|
|
5370
5371
|
var status = props.current > step
|
|
@@ -5379,8 +5380,8 @@ var Steps$2 = function (props) { return (jsxRuntime.jsx(Container$9, { children:
|
|
|
5379
5380
|
return (jsxRuntime.jsxs(Step$1, __assign$2({ status: status, hasTitle: !!title }, { children: [jsxRuntime.jsx("div", __assign$2({ onClick: onClickStep }, { children: status === "passed" ? (jsxRuntime.jsx(Icon, { type: "check", size: "small", color: "white" })) : (jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: step }))) })), title && jsxRuntime.jsx(Paragraph, { children: title })] }), "".concat(title, "-").concat(step)));
|
|
5380
5381
|
}) })); };
|
|
5381
5382
|
|
|
5382
|
-
var Container$
|
|
5383
|
-
var Step = styled__default["default"].li(templateObject_2$
|
|
5383
|
+
var Container$9 = styled__default["default"].ol(templateObject_1$h || (templateObject_1$h = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"], ["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"])));
|
|
5384
|
+
var Step = styled__default["default"].li(templateObject_2$f || (templateObject_2$f = __makeTemplateObject$1(["\n display: flex;\n align-items: center;\n box-shadow: inset 0px -1px 0px ", ";\n padding: 20px 0 20px 20px;\n cursor: ", ";\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin-right: 10px;\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n }\n\n > div h6 {\n color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :hover {\n background-color: ", ";\n }\n"], ["\n display: flex;\n align-items: center;\n box-shadow: inset 0px -1px 0px ", ";\n padding: 20px 0 20px 20px;\n cursor: ", ";\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin-right: 10px;\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n }\n\n > div h6 {\n color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :hover {\n background-color: ", ";\n }\n"])), theme.colors.lightGray.dark, function (_a) {
|
|
5384
5385
|
var status = _a.status;
|
|
5385
5386
|
return (!!status ? "pointer" : "not-allowed");
|
|
5386
5387
|
}, function (_a) {
|
|
@@ -5399,9 +5400,9 @@ var Step = styled__default["default"].li(templateObject_2$e || (templateObject_2
|
|
|
5399
5400
|
? theme.colors.lightGray.light
|
|
5400
5401
|
: theme.colors.darkGray.light;
|
|
5401
5402
|
}, theme.colors.darkGray.base, theme.colors.lightGray.base);
|
|
5402
|
-
var templateObject_1$
|
|
5403
|
+
var templateObject_1$h, templateObject_2$f;
|
|
5403
5404
|
|
|
5404
|
-
var Steps$1 = function (props) { return (jsxRuntime.jsx(Container$
|
|
5405
|
+
var Steps$1 = function (props) { return (jsxRuntime.jsx(Container$9, { children: props.steps.map(function (_a, index) {
|
|
5405
5406
|
var title = _a.title, onClick = _a.onClick;
|
|
5406
5407
|
var step = index + 1;
|
|
5407
5408
|
var status = props.current > step
|
|
@@ -5420,15 +5421,15 @@ var Steps = function (props) {
|
|
|
5420
5421
|
return props.alignment === "vertical" ? (jsxRuntime.jsx(Steps$1, __assign$2({}, props))) : (jsxRuntime.jsx(Steps$2, __assign$2({}, props)));
|
|
5421
5422
|
};
|
|
5422
5423
|
|
|
5423
|
-
var TabsContainer$1 = styled__default["default"].div(templateObject_1$
|
|
5424
|
-
var Tab$1 = styled__default["default"].div(templateObject_2$
|
|
5424
|
+
var TabsContainer$1 = styled__default["default"].div(templateObject_1$g || (templateObject_1$g = __makeTemplateObject$1(["\n border-bottom: 1px solid ", ";\n display: flex;\n gap: 20px;\n padding: 0 30px;\n"], ["\n border-bottom: 1px solid ", ";\n display: flex;\n gap: 20px;\n padding: 0 30px;\n"])), theme.colors.lightGray.dark);
|
|
5425
|
+
var Tab$1 = styled__default["default"].div(templateObject_2$e || (templateObject_2$e = __makeTemplateObject$1(["\n height: 50px;\n display: flex;\n align-items: center;\n padding: 0 10px;\n cursor: pointer;\n border-bottom: ", ";\n\n p {\n color: ", ";\n }\n\n :hover p {\n color: ", ";\n }\n"], ["\n height: 50px;\n display: flex;\n align-items: center;\n padding: 0 10px;\n cursor: pointer;\n border-bottom: ", ";\n\n p {\n color: ", ";\n }\n\n :hover p {\n color: ", ";\n }\n"])), function (_a) {
|
|
5425
5426
|
var isActive = _a.isActive;
|
|
5426
5427
|
return isActive ? "3px solid ".concat(theme.colors.blue.base) : "";
|
|
5427
5428
|
}, function (_a) {
|
|
5428
5429
|
var isActive = _a.isActive;
|
|
5429
5430
|
return isActive ? theme.colors.blue.base : "";
|
|
5430
5431
|
}, theme.colors.blue.base);
|
|
5431
|
-
var templateObject_1$
|
|
5432
|
+
var templateObject_1$g, templateObject_2$e;
|
|
5432
5433
|
|
|
5433
5434
|
var Tabs$2 = function (props) {
|
|
5434
5435
|
var _a = React$3.useState(props.items[0].key), activeTab = _a[0], setActiveTab = _a[1];
|
|
@@ -5443,15 +5444,15 @@ var Tabs$2 = function (props) {
|
|
|
5443
5444
|
}) }));
|
|
5444
5445
|
};
|
|
5445
5446
|
|
|
5446
|
-
var TabsContainer = styled__default["default"].div(templateObject_1$
|
|
5447
|
-
var Tab = styled__default["default"].div(templateObject_2$
|
|
5447
|
+
var TabsContainer = styled__default["default"].div(templateObject_1$f || (templateObject_1$f = __makeTemplateObject$1(["\n width: fit-content;\n border-right: 1px solid ", ";\n display: flex;\n flex-direction: column;\n gap: 5px;\n padding: 30px 0 30px 30px;\n"], ["\n width: fit-content;\n border-right: 1px solid ", ";\n display: flex;\n flex-direction: column;\n gap: 5px;\n padding: 30px 0 30px 30px;\n"])), theme.colors.lightGray.dark);
|
|
5448
|
+
var Tab = styled__default["default"].div(templateObject_2$d || (templateObject_2$d = __makeTemplateObject$1(["\n height: 50px;\n display: flex;\n align-items: center;\n padding: 0 30px 0 10px;\n cursor: pointer;\n position: relative;\n\n :after {\n content: \"\";\n width: 3px;\n height: 100%;\n display: ", ";\n background-color: ", ";\n position: absolute;\n right: 0;\n }\n\n p {\n color: ", ";\n }\n\n :hover p {\n color: ", ";\n }\n"], ["\n height: 50px;\n display: flex;\n align-items: center;\n padding: 0 30px 0 10px;\n cursor: pointer;\n position: relative;\n\n :after {\n content: \"\";\n width: 3px;\n height: 100%;\n display: ", ";\n background-color: ", ";\n position: absolute;\n right: 0;\n }\n\n p {\n color: ", ";\n }\n\n :hover p {\n color: ", ";\n }\n"])), function (_a) {
|
|
5448
5449
|
var isActive = _a.isActive;
|
|
5449
5450
|
return (isActive ? "block" : "none");
|
|
5450
5451
|
}, theme.colors.blue.base, function (_a) {
|
|
5451
5452
|
var isActive = _a.isActive;
|
|
5452
5453
|
return isActive ? theme.colors.blue.base : "";
|
|
5453
5454
|
}, theme.colors.blue.base);
|
|
5454
|
-
var templateObject_1$
|
|
5455
|
+
var templateObject_1$f, templateObject_2$d;
|
|
5455
5456
|
|
|
5456
5457
|
var Tabs$1 = function (props) {
|
|
5457
5458
|
var _a = React$3.useState(props.items[0].key), activeTab = _a[0], setActiveTab = _a[1];
|
|
@@ -5470,14 +5471,14 @@ var Tabs = function (props) {
|
|
|
5470
5471
|
return props.alignment === "vertical" ? (jsxRuntime.jsx(Tabs$1, __assign$2({}, props))) : (jsxRuntime.jsx(Tabs$2, __assign$2({}, props)));
|
|
5471
5472
|
};
|
|
5472
5473
|
|
|
5473
|
-
var Fieldset = styled__default["default"].fieldset(templateObject_1$
|
|
5474
|
-
var RadioContainer = styled__default["default"].div(templateObject_2$
|
|
5475
|
-
var RadioWrapper = styled__default["default"].div(templateObject_3$
|
|
5474
|
+
var Fieldset = styled__default["default"].fieldset(templateObject_1$e || (templateObject_1$e = __makeTemplateObject$1(["\n border: 0;\n margin: 0;\n padding: 0;\n"], ["\n border: 0;\n margin: 0;\n padding: 0;\n"])));
|
|
5475
|
+
var RadioContainer = styled__default["default"].div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
|
|
5476
|
+
var RadioWrapper = styled__default["default"].div(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject$1(["\n display: flex;\n align-items: center;\n\n > div:first-child {\n margin-right: 10px;\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"], ["\n display: flex;\n align-items: center;\n\n > div:first-child {\n margin-right: 10px;\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"])));
|
|
5476
5477
|
var Label$4 = styled__default["default"](StyledParagraph)(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject$1(["\n font-weight: ", ";\n color: ", ";\n display: flex;\n align-items: center;\n cursor: pointer;\n"], ["\n font-weight: ", ";\n color: ", ";\n display: flex;\n align-items: center;\n cursor: pointer;\n"])), function (_a) {
|
|
5477
5478
|
var weight = _a.weight;
|
|
5478
5479
|
return weight || 500;
|
|
5479
5480
|
}, theme.colors.darkGray.base);
|
|
5480
|
-
var templateObject_1$
|
|
5481
|
+
var templateObject_1$e, templateObject_2$c, templateObject_3$6, templateObject_4$4;
|
|
5481
5482
|
|
|
5482
5483
|
var RadioGroup = function (props) {
|
|
5483
5484
|
var onChange = function (value) {
|
|
@@ -5494,9 +5495,9 @@ var RadioGroup = function (props) {
|
|
|
5494
5495
|
}) })] }));
|
|
5495
5496
|
};
|
|
5496
5497
|
|
|
5497
|
-
var Container$
|
|
5498
|
-
var Label$3 = styled__default["default"](StyledParagraph)(templateObject_2$
|
|
5499
|
-
var templateObject_1$
|
|
5498
|
+
var Container$8 = styled__default["default"].div(templateObject_1$d || (templateObject_1$d = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n"])));
|
|
5499
|
+
var Label$3 = styled__default["default"](StyledParagraph)(templateObject_2$b || (templateObject_2$b = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
5500
|
+
var templateObject_1$d, templateObject_2$b;
|
|
5500
5501
|
|
|
5501
5502
|
var SelectField = function (props) {
|
|
5502
5503
|
var onChange = function (value) {
|
|
@@ -5507,15 +5508,15 @@ var SelectField = function (props) {
|
|
|
5507
5508
|
if (props.onBlur)
|
|
5508
5509
|
props.onBlur(props.name);
|
|
5509
5510
|
};
|
|
5510
|
-
return (jsxRuntime.jsxs(Container$
|
|
5511
|
+
return (jsxRuntime.jsxs(Container$8, { children: [jsxRuntime.jsx(Label$3, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Select, __assign$2({ id: props.name, name: props.name, disabled: props.disabled, defaultValue: props.defaultValue, placeholder: props.placeholder, autoFocus: props.autoFocus, onChange: onChange, onBlur: onBlur }, { children: props.options.map(function (_a, index) {
|
|
5511
5512
|
var value = _a.value, label = _a.label;
|
|
5512
5513
|
return (jsxRuntime.jsx("option", __assign$2({ value: value }, { children: label }), "".concat(value, "-").concat(value)));
|
|
5513
5514
|
}) }))] }));
|
|
5514
5515
|
};
|
|
5515
5516
|
|
|
5516
|
-
var Container$
|
|
5517
|
-
var Label$2 = styled__default["default"](StyledParagraph)(templateObject_2$
|
|
5518
|
-
var templateObject_1$
|
|
5517
|
+
var Container$7 = styled__default["default"].div(templateObject_1$c || (templateObject_1$c = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n"])));
|
|
5518
|
+
var Label$2 = styled__default["default"](StyledParagraph)(templateObject_2$a || (templateObject_2$a = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
5519
|
+
var templateObject_1$c, templateObject_2$a;
|
|
5519
5520
|
|
|
5520
5521
|
var ToggleField = function (props) {
|
|
5521
5522
|
var onChange = function (value) {
|
|
@@ -5526,10 +5527,10 @@ var ToggleField = function (props) {
|
|
|
5526
5527
|
if (props.onBlur)
|
|
5527
5528
|
props.onBlur(props.name);
|
|
5528
5529
|
};
|
|
5529
|
-
return (jsxRuntime.jsxs(Container$
|
|
5530
|
+
return (jsxRuntime.jsxs(Container$7, { children: [jsxRuntime.jsx(Label$2, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Toggle, { id: props.name, name: props.name, disabled: props.disabled, autoFocus: props.autoFocus, defaultValue: props.defaultValue, onChange: onChange, onBlur: onBlur })] }));
|
|
5530
5531
|
};
|
|
5531
5532
|
|
|
5532
|
-
var TooltipContainer = styled__default["default"].div(templateObject_1$
|
|
5533
|
+
var TooltipContainer = styled__default["default"].div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject$1(["\n width: fit-content;\n position: fixed;\n opacity: ", ";\n top: ", ";\n left: ", ";\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-top: 5px;\n pointer-events: none;\n z-index: 9;\n"], ["\n width: fit-content;\n position: fixed;\n opacity: ", ";\n top: ", ";\n left: ", ";\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-top: 5px;\n pointer-events: none;\n z-index: 9;\n"])), function (_a) {
|
|
5533
5534
|
var isVisible = _a.isVisible;
|
|
5534
5535
|
return (isVisible ? "100%" : "0%");
|
|
5535
5536
|
}, function (_a) {
|
|
@@ -5539,7 +5540,7 @@ var TooltipContainer = styled__default["default"].div(templateObject_1$a || (tem
|
|
|
5539
5540
|
var x = _a.x;
|
|
5540
5541
|
return (x ? "".concat(x, "px") : "");
|
|
5541
5542
|
});
|
|
5542
|
-
var TooltipTitle = styled__default["default"].div(templateObject_2$
|
|
5543
|
+
var TooltipTitle = styled__default["default"].div(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject$1(["\n width: 100%;\n padding: 12px 16px;\n background-color: ", ";\n border-radius: 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n width: 100%;\n padding: 12px 16px;\n background-color: ", ";\n border-radius: 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n display: flex;\n align-items: center;\n justify-content: center;\n"])), function (_a) {
|
|
5543
5544
|
var color = _a.color;
|
|
5544
5545
|
switch (color) {
|
|
5545
5546
|
default:
|
|
@@ -5549,7 +5550,7 @@ var TooltipTitle = styled__default["default"].div(templateObject_2$8 || (templat
|
|
|
5549
5550
|
return theme.colors.lightGray.dark;
|
|
5550
5551
|
}
|
|
5551
5552
|
});
|
|
5552
|
-
var templateObject_1$
|
|
5553
|
+
var templateObject_1$b, templateObject_2$9;
|
|
5553
5554
|
|
|
5554
5555
|
var Tooltip = function (props) {
|
|
5555
5556
|
var tooltipRef = React$3.useRef(null);
|
|
@@ -11401,7 +11402,7 @@ HTMLReactParser$1.htmlToDOM;
|
|
|
11401
11402
|
HTMLReactParser$1.attributesToProps;
|
|
11402
11403
|
HTMLReactParser$1.Element;
|
|
11403
11404
|
|
|
11404
|
-
var StyledTextarea = styled__default["default"].textarea(templateObject_1$
|
|
11405
|
+
var StyledTextarea = styled__default["default"].textarea(templateObject_1$a || (templateObject_1$a = __makeTemplateObject$1(["\n width: 100%;\n min-width: 228px;\n min-height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n resize: vertical;\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 100%;\n min-width: 228px;\n min-height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n resize: vertical;\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
|
|
11405
11406
|
var disabled = _a.disabled;
|
|
11406
11407
|
return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
11407
11408
|
}, function (_a) {
|
|
@@ -11414,7 +11415,7 @@ var StyledTextarea = styled__default["default"].textarea(templateObject_1$9 || (
|
|
|
11414
11415
|
var disabled = _a.disabled;
|
|
11415
11416
|
return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
|
|
11416
11417
|
}, theme.fonts.paragraph, theme.paragraph.medium.fontSize, theme.paragraph.medium.lineHeight, theme.colors.lightGray.darker, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
11417
|
-
var templateObject_1$
|
|
11418
|
+
var templateObject_1$a;
|
|
11418
11419
|
|
|
11419
11420
|
var Textarea = function (props) {
|
|
11420
11421
|
var onChange = function (e) {
|
|
@@ -11424,9 +11425,9 @@ var Textarea = function (props) {
|
|
|
11424
11425
|
return jsxRuntime.jsx(StyledTextarea, __assign$2({}, props, { onChange: onChange }));
|
|
11425
11426
|
};
|
|
11426
11427
|
|
|
11427
|
-
var Container$
|
|
11428
|
-
var Label$1 = styled__default["default"](StyledParagraph)(templateObject_2$
|
|
11429
|
-
var templateObject_1$
|
|
11428
|
+
var Container$6 = styled__default["default"].div(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
|
|
11429
|
+
var Label$1 = styled__default["default"](StyledParagraph)(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
11430
|
+
var templateObject_1$9, templateObject_2$8;
|
|
11430
11431
|
|
|
11431
11432
|
var TextareaField = function (props) {
|
|
11432
11433
|
var onChange = function (value) {
|
|
@@ -11437,12 +11438,12 @@ var TextareaField = function (props) {
|
|
|
11437
11438
|
if (props.onBlur)
|
|
11438
11439
|
props.onBlur(props.name);
|
|
11439
11440
|
};
|
|
11440
|
-
return (jsxRuntime.jsxs(Container$
|
|
11441
|
+
return (jsxRuntime.jsxs(Container$6, { children: [jsxRuntime.jsx(Label$1, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Textarea, { defaultValue: props.defaultValue, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, placeholder: props.placeholder, id: props.name, rows: props.rows, onChange: onChange, onBlur: onBlur }), props.tips && (jsxRuntime.jsxs("div", __assign$2({ style: { marginLeft: "5px" } }, { children: [jsxRuntime.jsx(Spacer, { vertical: 5 }), props.tips.map(function (tip, index) { return (jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small", weight: "regular" }, { children: ["\u2022 ", tip] }), "".concat(tip, "-").concat(index))); })] })))] }));
|
|
11441
11442
|
};
|
|
11442
11443
|
|
|
11443
|
-
var Container$
|
|
11444
|
-
var Label = styled__default["default"](StyledParagraph)(templateObject_2$
|
|
11445
|
-
var templateObject_1$
|
|
11444
|
+
var Container$5 = styled__default["default"].div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
|
|
11445
|
+
var Label = styled__default["default"](StyledParagraph)(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
11446
|
+
var templateObject_1$8, templateObject_2$7;
|
|
11446
11447
|
|
|
11447
11448
|
var RangeField = function (props) {
|
|
11448
11449
|
var onChange = function (value) {
|
|
@@ -11453,25 +11454,25 @@ var RangeField = function (props) {
|
|
|
11453
11454
|
if (props.onBlur)
|
|
11454
11455
|
props.onBlur(props.name);
|
|
11455
11456
|
};
|
|
11456
|
-
return (jsxRuntime.jsxs(Container$
|
|
11457
|
+
return (jsxRuntime.jsxs(Container$5, { children: [jsxRuntime.jsx(Label, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Range, { defaultValue: props.defaultValue, autoFocus: props.autoFocus, disabled: props.disabled, id: props.name, onChange: onChange, onBlur: onBlur })] }));
|
|
11457
11458
|
};
|
|
11458
11459
|
|
|
11459
11460
|
var FeedbackColors = {
|
|
11460
11461
|
success: theme.colors.green.base,
|
|
11461
11462
|
error: theme.colors.red.base,
|
|
11462
11463
|
};
|
|
11463
|
-
var FieldWrapper = styled__default["default"].div(templateObject_1$
|
|
11464
|
+
var FieldWrapper = styled__default["default"].div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject$1(["\n input, select {\n border-color: ", ";\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"], ["\n input, select {\n border-color: ", ";\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"])), function (_a) {
|
|
11464
11465
|
var status = _a.status;
|
|
11465
11466
|
return FeedbackColors[status];
|
|
11466
11467
|
});
|
|
11467
|
-
var FeedbackWrapper = styled__default["default"].div(templateObject_2$
|
|
11468
|
+
var FeedbackWrapper = styled__default["default"].div(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject$1(["\n display: flex;\n align-items: center;\n margin-top: 5px;\n\n > div:first-child {\n min-width: 24px;\n min-height: 24px;\n margin-right: 5px;\n }\n\n svg {\n fill: ", ";\n }\n p {\n color: ", ";\n }\n"], ["\n display: flex;\n align-items: center;\n margin-top: 5px;\n\n > div:first-child {\n min-width: 24px;\n min-height: 24px;\n margin-right: 5px;\n }\n\n svg {\n fill: ", ";\n }\n p {\n color: ", ";\n }\n"])), function (_a) {
|
|
11468
11469
|
var status = _a.status;
|
|
11469
11470
|
return FeedbackColors[status];
|
|
11470
11471
|
}, function (_a) {
|
|
11471
11472
|
var status = _a.status;
|
|
11472
11473
|
return FeedbackColors[status];
|
|
11473
11474
|
});
|
|
11474
|
-
var templateObject_1$
|
|
11475
|
+
var templateObject_1$7, templateObject_2$6;
|
|
11475
11476
|
|
|
11476
11477
|
var WithValidation = function (_a) {
|
|
11477
11478
|
var status = _a.status, message = _a.message, children = _a.children;
|
|
@@ -11484,10 +11485,10 @@ var WithValidation = function (_a) {
|
|
|
11484
11485
|
return (jsxRuntime.jsxs(FieldWrapper, __assign$2({ status: status }, { children: [children, jsxRuntime.jsxs(FeedbackWrapper, __assign$2({ status: status }, { children: [jsxRuntime.jsx(Icon, { type: icons[status], size: "small" }), jsxRuntime.jsx(Paragraph, __assign$2({ size: "small" }, { children: message }))] }))] })));
|
|
11485
11486
|
};
|
|
11486
11487
|
|
|
11487
|
-
var FormWrapper = styled__default["default"].form(templateObject_1$
|
|
11488
|
-
var DescriptionWrapper = styled__default["default"].div(templateObject_2$
|
|
11489
|
-
var ButtonWrapper = styled__default["default"].div(templateObject_3$
|
|
11490
|
-
var templateObject_1$
|
|
11488
|
+
var FormWrapper = styled__default["default"].form(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject$1([""], [""])));
|
|
11489
|
+
var DescriptionWrapper = styled__default["default"].div(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject$1(["\n margin-bottom: 20px;\n\n a {\n color: ", ";\n\n :hover {\n color: ", ";\n }\n }\n"], ["\n margin-bottom: 20px;\n\n a {\n color: ", ";\n\n :hover {\n color: ", ";\n }\n }\n"])), theme.colors.darkGray.light, theme.colors.blue.base);
|
|
11490
|
+
var ButtonWrapper = styled__default["default"].div(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject$1(["\n padding-top: 30px;\n"], ["\n padding-top: 30px;\n"])));
|
|
11491
|
+
var templateObject_1$6, templateObject_2$5, templateObject_3$5;
|
|
11491
11492
|
|
|
11492
11493
|
var Form = React$3.forwardRef(function (props, ref) {
|
|
11493
11494
|
var _a = React$3.useState({}), values = _a[0], setValues = _a[1];
|
|
@@ -11670,7 +11671,7 @@ var Form = React$3.forwardRef(function (props, ref) {
|
|
|
11670
11671
|
}) }), props.button && (jsxRuntime.jsx(ButtonWrapper, { children: jsxRuntime.jsx(Button, __assign$2({}, props.button, { onClick: onSubmit, type: "submit" })) }))] }));
|
|
11671
11672
|
});
|
|
11672
11673
|
|
|
11673
|
-
var Container$
|
|
11674
|
+
var Container$4 = styled__default["default"].div(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject$1(["\n min-width: 40px;\n max-width: 40px;\n min-height: 40px;\n max-height: 40px;\n\n display: flex;\n flex-direction: column-reverse;\n align-items: center;\n justify-content: space-evenly;\n\n border-radius: 3px;\n border-color: ", ";\n\n background-color: ", ";\n box-sizing: border-box;\n border-width: ", ";\n border-style: solid;\n\n svg {\n fill: ", ";\n }\n\n h6 {\n color: ", ";\n font-size: 16px;\n line-height: 12px;\n }\n"], ["\n min-width: 40px;\n max-width: 40px;\n min-height: 40px;\n max-height: 40px;\n\n display: flex;\n flex-direction: column-reverse;\n align-items: center;\n justify-content: space-evenly;\n\n border-radius: 3px;\n border-color: ", ";\n\n background-color: ", ";\n box-sizing: border-box;\n border-width: ", ";\n border-style: solid;\n\n svg {\n fill: ", ";\n }\n\n h6 {\n color: ", ";\n font-size: 16px;\n line-height: 12px;\n }\n"])), function (_a) {
|
|
11674
11675
|
var color = _a.color, active = _a.active;
|
|
11675
11676
|
if (active)
|
|
11676
11677
|
return theme.colors[color].dark;
|
|
@@ -11694,20 +11695,20 @@ var Container$3 = styled__default["default"].div(templateObject_1$4 || (template
|
|
|
11694
11695
|
return theme.colors[color].base;
|
|
11695
11696
|
return "";
|
|
11696
11697
|
});
|
|
11697
|
-
var templateObject_1$
|
|
11698
|
+
var templateObject_1$5;
|
|
11698
11699
|
|
|
11699
11700
|
var Key = function (props) {
|
|
11700
11701
|
var _a;
|
|
11701
|
-
return (jsxRuntime.jsx(Container$
|
|
11702
|
+
return (jsxRuntime.jsx(Container$4, __assign$2({ color: props.color, active: props.active }, { children: props.color === "pink" ? (jsxRuntime.jsx("svg", __assign$2({ width: "28", height: "7", viewBox: "0 0 28 7" }, { children: jsxRuntime.jsx("path", { d: "M0 4.5V1C0 0.447715 0.447715 0 1 0H2C2.55228 0 3 0.447715 3 1V4H25V1C25 0.447715 25.4477 0 26 0H27C27.5523 0 28 0.447715 28 1V4.5C28 5.88071 26.8807 7 25.5 7H2.5C1.11929 7 0 5.88071 0 4.5Z" }) }))) : ((_a = props.characters) === null || _a === void 0 ? void 0 : _a.map(function (character, index) { return (jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: character }), "".concat(character, "-").concat(index))); })) })));
|
|
11702
11703
|
};
|
|
11703
11704
|
|
|
11704
|
-
var Container$
|
|
11705
|
-
var SpecialRow = styled__default["default"].div(templateObject_2$
|
|
11706
|
-
var TopRow = styled__default["default"].div(templateObject_3$
|
|
11705
|
+
var Container$3 = styled__default["default"].div(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject$1(["\n width: 720px;\n background-color: #cacbd6;\n box-shadow: #7b7f81 0px 8px 0px;\n border-radius: 10px;\n padding: 25px 20px;\n box-sizing: border-box;\n"], ["\n width: 720px;\n background-color: #cacbd6;\n box-shadow: #7b7f81 0px 8px 0px;\n border-radius: 10px;\n padding: 25px 20px;\n box-sizing: border-box;\n"])));
|
|
11706
|
+
var SpecialRow = styled__default["default"].div(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n\n > div:last-child {\n min-width: 60px;\n max-width: 60px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n\n > div:last-child {\n min-width: 60px;\n max-width: 60px;\n }\n"])));
|
|
11707
|
+
var TopRow = styled__default["default"].div(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child {\n min-width: 50px;\n max-width: 50px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child {\n min-width: 50px;\n max-width: 50px;\n }\n"])));
|
|
11707
11708
|
var StartRow = styled__default["default"].div(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child {\n min-width: 70px;\n max-width: 70px;\n }\n > div:last-child {\n min-width: 65px;\n max-width: 65px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child {\n min-width: 70px;\n max-width: 70px;\n }\n > div:last-child {\n min-width: 65px;\n max-width: 65px;\n }\n"])));
|
|
11708
11709
|
var BottomRow = styled__default["default"].div(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child,\n > div:last-child {\n min-width: 90px;\n max-width: 90px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child,\n > div:last-child {\n min-width: 90px;\n max-width: 90px;\n }\n"])));
|
|
11709
11710
|
var SpacebarRow = styled__default["default"].div(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child,\n > div:last-child {\n min-width: 70px;\n max-width: 70px;\n }\n\n > div:nth-child(5) {\n min-width: 220px;\n max-width: 220px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child,\n > div:last-child {\n min-width: 70px;\n max-width: 70px;\n }\n\n > div:nth-child(5) {\n min-width: 220px;\n max-width: 220px;\n }\n"])));
|
|
11710
|
-
var templateObject_1$
|
|
11711
|
+
var templateObject_1$4, templateObject_2$4, templateObject_3$4, templateObject_4$3, templateObject_5$2, templateObject_6$2;
|
|
11711
11712
|
|
|
11712
11713
|
var Keyboard = function (props) {
|
|
11713
11714
|
var _a = React$3.useState(), keys = _a[0], setKeys = _a[1];
|
|
@@ -11731,7 +11732,7 @@ var Keyboard = function (props) {
|
|
|
11731
11732
|
}, [props.keys]);
|
|
11732
11733
|
if (!keys)
|
|
11733
11734
|
return null;
|
|
11734
|
-
return (jsxRuntime.jsxs(Container$
|
|
11735
|
+
return (jsxRuntime.jsxs(Container$3, { children: [jsxRuntime.jsxs(SpecialRow, { children: [jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, { characters: [keys[44].character, keys[89].character], color: keys[44].color, active: keys[44].character === props.activeKey ||
|
|
11735
11736
|
keys[89].character === props.activeKey }, 44), jsxRuntime.jsx(Key, { characters: [keys[42].character, keys[87].character], color: keys[42].color, active: keys[42].character === props.activeKey ||
|
|
11736
11737
|
keys[87].character === props.activeKey }), jsxRuntime.jsx(Key, { characters: [keys[40].character, keys[85].character], color: keys[40].color, active: keys[40].character === props.activeKey ||
|
|
11737
11738
|
keys[85].character === props.activeKey }), jsxRuntime.jsx(Key, { characters: [keys[38].character, keys[83].character], color: keys[38].color, active: keys[38].character === props.activeKey ||
|
|
@@ -11779,8 +11780,8 @@ var Keyboard = function (props) {
|
|
|
11779
11780
|
keys[76].character === props.activeKey }), jsxRuntime.jsx(Key, { characters: ["Shift"], color: keys[31].color, active: shiftKeys.left.includes(props.activeKey) })] }), jsxRuntime.jsxs(SpacebarRow, { children: [jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, { color: keys[1].color, active: keys[1].character === props.activeKey }), jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, {})] })] }));
|
|
11780
11781
|
};
|
|
11781
11782
|
|
|
11782
|
-
var Mask = styled__default["default"].div(templateObject_1$
|
|
11783
|
-
var CardWrapper = styled__default["default"].div(templateObject_2$
|
|
11783
|
+
var Mask = styled__default["default"].div(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject$1(["\n width: 100vw;\n height: 100vh;\n position: fixed;\n background-color: rgba(35, 41, 47, 50%);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n"], ["\n width: 100vw;\n height: 100vh;\n position: fixed;\n background-color: rgba(35, 41, 47, 50%);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n"])));
|
|
11784
|
+
var CardWrapper = styled__default["default"].div(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject$1(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
|
|
11784
11785
|
var width = _a.width;
|
|
11785
11786
|
if (!width)
|
|
11786
11787
|
return "720px";
|
|
@@ -11788,11 +11789,11 @@ var CardWrapper = styled__default["default"].div(templateObject_2$2 || (template
|
|
|
11788
11789
|
return "".concat(width, "px");
|
|
11789
11790
|
return width;
|
|
11790
11791
|
});
|
|
11791
|
-
var TitleWrapper = styled__default["default"].div(templateObject_3$
|
|
11792
|
+
var TitleWrapper$1 = styled__default["default"].div(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject$1(["\n margin: 0 25px 20px 0;\n"], ["\n margin: 0 25px 20px 0;\n"])));
|
|
11792
11793
|
var CloseIconWrapper = styled__default["default"].div(templateObject_4$2 || (templateObject_4$2 = __makeTemplateObject$1(["\n display: flex;\n justify-content: flex-end;\n position: absolute;\n top: 20px;\n right: 20px;\n\n svg {\n cursor: pointer;\n\n :hover {\n fill: ", ";\n }\n }\n"], ["\n display: flex;\n justify-content: flex-end;\n position: absolute;\n top: 20px;\n right: 20px;\n\n svg {\n cursor: pointer;\n\n :hover {\n fill: ", ";\n }\n }\n"])), theme.colors.darkGray.base);
|
|
11793
11794
|
var ChildrenWrapper = styled__default["default"].div(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject$1(["\n padding: 20px 35px;\n"], ["\n padding: 20px 35px;\n"])));
|
|
11794
11795
|
var FooterContainer = styled__default["default"].div(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject$1(["\n width: calc(100% + 30px);\n box-sizing: border-box;\n min-height: 45px;\n background-color: ", ";\n border-top: 1px solid ", ";\n margin: 15px -15px -15px;\n padding: 15px;\n display: flex;\n justify-content: flex-end;\n gap: 10px;\n"], ["\n width: calc(100% + 30px);\n box-sizing: border-box;\n min-height: 45px;\n background-color: ", ";\n border-top: 1px solid ", ";\n margin: 15px -15px -15px;\n padding: 15px;\n display: flex;\n justify-content: flex-end;\n gap: 10px;\n"])), theme.colors.lightGray.dark, theme.colors.lightGray.darker);
|
|
11795
|
-
var templateObject_1$
|
|
11796
|
+
var templateObject_1$3, templateObject_2$3, templateObject_3$3, templateObject_4$2, templateObject_5$1, templateObject_6$1;
|
|
11796
11797
|
|
|
11797
11798
|
var Modal = function (props) {
|
|
11798
11799
|
var _a = React$3.useState(props.isOpen), isOpen = _a[0], setIsOpen = _a[1];
|
|
@@ -11806,15 +11807,15 @@ var Modal = function (props) {
|
|
|
11806
11807
|
}, [isOpen]);
|
|
11807
11808
|
if (!isOpen)
|
|
11808
11809
|
return null;
|
|
11809
|
-
return (jsxRuntime.jsx(Mask, { children: jsxRuntime.jsx(CardWrapper, __assign$2({}, props, { children: jsxRuntime.jsxs(Card, { children: [isClosable && (jsxRuntime.jsx(CloseIconWrapper, { children: jsxRuntime.jsx(Icon, { type: "cross", onClick: function () { return setIsOpen(false); } }) })), jsxRuntime.jsxs(ChildrenWrapper, { children: [props.title && (jsxRuntime.jsx(TitleWrapper, { children: jsxRuntime.jsx(Heading, __assign$2({ type: "h2" }, { children: props.title })) })), props.children] }), !props.okButton && !props.closeButton ? null : (jsxRuntime.jsxs(FooterContainer, { children: [props.closeButton && (jsxRuntime.jsx(Button, { label: props.closeButton.label, onClick: props.closeButton.onClick, color: "white", size: "small" })), props.okButton && (jsxRuntime.jsx(Button, { label: props.okButton.label, onClick: props.okButton.onClick, size: "small" }))] }))] }) })) }));
|
|
11810
|
+
return (jsxRuntime.jsx(Mask, { children: jsxRuntime.jsx(CardWrapper, __assign$2({}, props, { children: jsxRuntime.jsxs(Card, { children: [isClosable && (jsxRuntime.jsx(CloseIconWrapper, { children: jsxRuntime.jsx(Icon, { type: "cross", onClick: function () { return setIsOpen(false); } }) })), jsxRuntime.jsxs(ChildrenWrapper, { children: [props.title && (jsxRuntime.jsx(TitleWrapper$1, { children: jsxRuntime.jsx(Heading, __assign$2({ type: "h2" }, { children: props.title })) })), props.children] }), !props.okButton && !props.closeButton ? null : (jsxRuntime.jsxs(FooterContainer, { children: [props.closeButton && (jsxRuntime.jsx(Button, { label: props.closeButton.label, onClick: props.closeButton.onClick, color: "white", size: "small" })), props.okButton && (jsxRuntime.jsx(Button, { label: props.okButton.label, onClick: props.okButton.onClick, size: "small" }))] }))] }) })) }));
|
|
11810
11811
|
};
|
|
11811
11812
|
|
|
11812
|
-
var Container$
|
|
11813
|
+
var Container$2 = styled__default["default"].div(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject$1(["\n width: 100%;\n min-height: 90px;\n border-radius: 6px;\n border-width: 3px;\n border-style: solid;\n border-color: ", ";\n background-color: ", ";\n padding: 20px;\n display: flex;\n box-sizing: border-box;\n"], ["\n width: 100%;\n min-height: 90px;\n border-radius: 6px;\n border-width: 3px;\n border-style: solid;\n border-color: ", ";\n background-color: ", ";\n padding: 20px;\n display: flex;\n box-sizing: border-box;\n"])), function (_a) {
|
|
11813
11814
|
var passed = _a.passed;
|
|
11814
11815
|
return passed ? theme.colors.green.base : theme.colors.red.base;
|
|
11815
11816
|
}, theme.colors.lightGray.light);
|
|
11816
|
-
var ProgressBarWrapper = styled__default["default"].div(templateObject_2$
|
|
11817
|
-
var Indicator = styled__default["default"].div(templateObject_3$
|
|
11817
|
+
var ProgressBarWrapper = styled__default["default"].div(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject$1(["\n width: 50%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n margin-top: 15px;\n margin-left: auto;\n position: relative;\n\n > div:last-child {\n display: flex;\n justify-content: space-between;\n margin-top: 3px;\n }\n"], ["\n width: 50%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n margin-top: 15px;\n margin-left: auto;\n position: relative;\n\n > div:last-child {\n display: flex;\n justify-content: space-between;\n margin-top: 3px;\n }\n"])));
|
|
11818
|
+
var Indicator = styled__default["default"].div(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject$1(["\n width: 4px;\n height: 22px;\n background-color: ", ";\n position: absolute;\n left: ", ";\n z-index: 1;\n top: -4px;\n"], ["\n width: 4px;\n height: 22px;\n background-color: ", ";\n position: absolute;\n left: ", ";\n z-index: 1;\n top: -4px;\n"])), theme.colors.blue.darker, function (_a) {
|
|
11818
11819
|
var value = _a.value;
|
|
11819
11820
|
return "".concat(value, "%");
|
|
11820
11821
|
});
|
|
@@ -11822,7 +11823,7 @@ var Target = styled__default["default"].div(templateObject_4$1 || (templateObjec
|
|
|
11822
11823
|
var value = _a.value, width = _a.width;
|
|
11823
11824
|
return "calc(".concat(value, "% - ").concat(width / 2, "px)");
|
|
11824
11825
|
}, theme.colors.blue.darker);
|
|
11825
|
-
var templateObject_1$
|
|
11826
|
+
var templateObject_1$2, templateObject_2$2, templateObject_3$2, templateObject_4$1;
|
|
11826
11827
|
|
|
11827
11828
|
var Result = function (props) {
|
|
11828
11829
|
var ref = React$3.useRef(null);
|
|
@@ -11832,12 +11833,12 @@ var Result = function (props) {
|
|
|
11832
11833
|
var _a;
|
|
11833
11834
|
setTargetWidth((_a = ref.current) === null || _a === void 0 ? void 0 : _a.offsetWidth);
|
|
11834
11835
|
}, [ref]);
|
|
11835
|
-
return (jsxRuntime.jsxs(Container$
|
|
11836
|
+
return (jsxRuntime.jsxs(Container$2, __assign$2({ passed: isPassed }, { children: [jsxRuntime.jsx(Icon, { type: isPassed ? "check" : "warning", color: isPassed ? "green" : "red", size: "large" }), jsxRuntime.jsx(Spacer, { horizontal: 15 }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h5" }, { children: props.title })), jsxRuntime.jsx(Paragraph, { children: props.subtitle })] }), props.progressBar && (jsxRuntime.jsxs(ProgressBarWrapper, { children: [jsxRuntime.jsx(Indicator, { value: (props.target / props.progressBar.max) * 100 }), jsxRuntime.jsx(Target, __assign$2({ value: (props.target / props.progressBar.max) * 100, width: targetWidth, ref: ref }, { children: jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.target, props.progressBar.unit] })) })), jsxRuntime.jsx(ProgressBar, { percent: (props.value / props.progressBar.max) * 100, color: isPassed ? "green" : "red" }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.progressBar.min, props.progressBar.unit] })), jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.progressBar.max, props.progressBar.unit] }))] })] }))] })));
|
|
11836
11837
|
};
|
|
11837
11838
|
|
|
11838
|
-
var Container = styled__default["default"].table(templateObject_1 || (templateObject_1 = __makeTemplateObject$1(["\n width: 100%;\n border-collapse: collapse;\n border-radius: 6px;\n border-style: hidden;\n overflow: hidden;\n box-shadow: 0 0 0 1px ", ";\n"], ["\n width: 100%;\n border-collapse: collapse;\n border-radius: 6px;\n border-style: hidden;\n overflow: hidden;\n box-shadow: 0 0 0 1px ", ";\n"])), theme.colors.lightGray.dark);
|
|
11839
|
-
var TableHead = styled__default["default"].thead(templateObject_2 || (templateObject_2 = __makeTemplateObject$1([""], [""])));
|
|
11840
|
-
var TableBody = styled__default["default"].tbody(templateObject_3 || (templateObject_3 = __makeTemplateObject$1([""], [""])));
|
|
11839
|
+
var Container$1 = styled__default["default"].table(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject$1(["\n width: 100%;\n border-collapse: collapse;\n border-radius: 6px;\n border-style: hidden;\n overflow: hidden;\n box-shadow: 0 0 0 1px ", ";\n"], ["\n width: 100%;\n border-collapse: collapse;\n border-radius: 6px;\n border-style: hidden;\n overflow: hidden;\n box-shadow: 0 0 0 1px ", ";\n"])), theme.colors.lightGray.dark);
|
|
11840
|
+
var TableHead = styled__default["default"].thead(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject$1([""], [""])));
|
|
11841
|
+
var TableBody = styled__default["default"].tbody(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject$1([""], [""])));
|
|
11841
11842
|
styled__default["default"].tfoot(templateObject_4 || (templateObject_4 = __makeTemplateObject$1([""], [""])));
|
|
11842
11843
|
var ColumnTitle = styled__default["default"].th(templateObject_5 || (templateObject_5 = __makeTemplateObject$1(["\n text-align: left;\n padding-left: 15px;\n"], ["\n text-align: left;\n padding-left: 15px;\n"])));
|
|
11843
11844
|
var TableRow = styled__default["default"].tr(templateObject_6 || (templateObject_6 = __makeTemplateObject$1(["\n height: 50px;\n border-bottom: 1px solid ", ";\n\n :nth-child(odd) {\n background: ", ";\n }\n :nth-child(even) {\n background: ", ";\n }\n"], ["\n height: 50px;\n border-bottom: 1px solid ", ";\n\n :nth-child(odd) {\n background: ", ";\n }\n :nth-child(even) {\n background: ", ";\n }\n"])), theme.colors.lightGray.dark, theme.colors.lightGray.light, theme.colors.lightGray.base);
|
|
@@ -11854,11 +11855,11 @@ var TableCell = styled__default["default"].td(templateObject_7 || (templateObjec
|
|
|
11854
11855
|
}
|
|
11855
11856
|
});
|
|
11856
11857
|
var EmptyTableCell = styled__default["default"].td(templateObject_8 || (templateObject_8 = __makeTemplateObject$1(["\n p {\n color: ", ";\n }\n"], ["\n p {\n color: ", ";\n }\n"])), theme.colors.lightGray.darker);
|
|
11857
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
|
|
11858
|
+
var templateObject_1$1, templateObject_2$1, templateObject_3$1, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
|
|
11858
11859
|
|
|
11859
11860
|
var Table = function (_a) {
|
|
11860
11861
|
var columns = _a.columns, data = _a.data, empytText = _a.empytText;
|
|
11861
|
-
return (jsxRuntime.jsxs(Container, { children: [jsxRuntime.jsx(TableHead, { children: jsxRuntime.jsx(TableRow, { children: columns.map(function (_a, index) {
|
|
11862
|
+
return (jsxRuntime.jsxs(Container$1, { children: [jsxRuntime.jsx(TableHead, { children: jsxRuntime.jsx(TableRow, { children: columns.map(function (_a, index) {
|
|
11862
11863
|
var title = _a.title, dataIndex = _a.dataIndex;
|
|
11863
11864
|
return (jsxRuntime.jsx(ColumnTitle, { children: title && (jsxRuntime.jsx(Heading, __assign$2({ type: "h6", as: "span" }, { children: title }))) }, "".concat(dataIndex, "-").concat(index)));
|
|
11864
11865
|
}) }) }), jsxRuntime.jsx(TableBody, { children: data.length === 0 ? (jsxRuntime.jsx(TableRow, { children: jsxRuntime.jsx(EmptyTableCell, __assign$2({ colSpan: columns.length }, { children: jsxRuntime.jsx(Paragraph, __assign$2({ align: "center", size: "small", weight: "regular" }, { children: empytText || "No data" })) })) })) : (data.map(function (row, index) {
|
|
@@ -11870,6 +11871,75 @@ var Table = function (_a) {
|
|
|
11870
11871
|
})) })] }));
|
|
11871
11872
|
};
|
|
11872
11873
|
|
|
11874
|
+
var Container = styled__default["default"].div(templateObject_1 || (templateObject_1 = __makeTemplateObject$1(["\n display: flex;\n align-items: stretch;\n\n > div:nth-child(odd) {\n width: 100%;\n min-width: 180px;\n min-height: 180px;\n\n > div {\n padding: 0;\n }\n }\n"], ["\n display: flex;\n align-items: stretch;\n\n > div:nth-child(odd) {\n width: 100%;\n min-width: 180px;\n min-height: 180px;\n\n > div {\n padding: 0;\n }\n }\n"])));
|
|
11875
|
+
var TitleWrapper = styled__default["default"].div(templateObject_2 || (templateObject_2 = __makeTemplateObject$1(["\n width: 100%;\n box-sizing: border-box;\n padding: 10px 15px;\n border-bottom: 1px solid ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n"], ["\n width: 100%;\n box-sizing: border-box;\n padding: 10px 15px;\n border-bottom: 1px solid ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])), theme.colors.lightGray.dark);
|
|
11876
|
+
var CheckboxesWrapper = styled__default["default"].div(templateObject_3 || (templateObject_3 = __makeTemplateObject$1(["\n height: 100%;\n max-height: 310px;\n background-color: ", ";\n padding: 15px;\n\n fieldset {\n height: 100%;\n overflow: scroll;\n padding-left: 2px;\n\n > div > div:not(:last-child) {\n margin-bottom: 10px;\n }\n }\n"], ["\n height: 100%;\n max-height: 310px;\n background-color: ", ";\n padding: 15px;\n\n fieldset {\n height: 100%;\n overflow: scroll;\n padding-left: 2px;\n\n > div > div:not(:last-child) {\n margin-bottom: 10px;\n }\n }\n"])), theme.colors.lightGray.base);
|
|
11877
|
+
var templateObject_1, templateObject_2, templateObject_3;
|
|
11878
|
+
|
|
11879
|
+
var Transfer = function (props) {
|
|
11880
|
+
var _a, _b;
|
|
11881
|
+
var _c = React$3.useState(props.targetKeys || []), targetKeys = _c[0], setTargetKeys = _c[1];
|
|
11882
|
+
var _d = React$3.useState([]), selectedSourceKeys = _d[0], setSelectedSourceKeys = _d[1];
|
|
11883
|
+
var _e = React$3.useState([]), selectedTargetKeys = _e[0], setSelectedTargetKeys = _e[1];
|
|
11884
|
+
var onChange = function (newTargetKeys) {
|
|
11885
|
+
setTargetKeys(newTargetKeys);
|
|
11886
|
+
setSelectedSourceKeys([]);
|
|
11887
|
+
setSelectedTargetKeys([]);
|
|
11888
|
+
if (!props.onChange)
|
|
11889
|
+
return;
|
|
11890
|
+
props.onChange(props.dataSource
|
|
11891
|
+
.filter(function (_a) {
|
|
11892
|
+
var key = _a.key;
|
|
11893
|
+
return newTargetKeys.includes(key);
|
|
11894
|
+
})
|
|
11895
|
+
.map(function (_a) {
|
|
11896
|
+
var key = _a.key;
|
|
11897
|
+
return key;
|
|
11898
|
+
}));
|
|
11899
|
+
};
|
|
11900
|
+
var transferRight = function () {
|
|
11901
|
+
var newTargetKeys = __spreadArray(__spreadArray([], targetKeys, true), selectedSourceKeys, true);
|
|
11902
|
+
onChange(newTargetKeys);
|
|
11903
|
+
};
|
|
11904
|
+
var transferLeft = function () {
|
|
11905
|
+
var newTargetKeys = targetKeys.filter(function (key) { return !selectedTargetKeys.includes(key); });
|
|
11906
|
+
onChange(newTargetKeys);
|
|
11907
|
+
};
|
|
11908
|
+
return (jsxRuntime.jsxs(Container, { children: [jsxRuntime.jsxs(Card, __assign$2({ bordered: true }, { children: [((_a = props.titles) === null || _a === void 0 ? void 0 : _a.length) >= 1 && (jsxRuntime.jsxs(TitleWrapper, { children: [jsxRuntime.jsxs(Paragraph, __assign$2({ weight: "regular" }, { children: [selectedSourceKeys.length > 0 && "".concat(selectedSourceKeys.length, "/"), props.dataSource.length - targetKeys.length] })), jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: props.titles[0] }))] })), jsxRuntime.jsx(CheckboxesWrapper, { children: jsxRuntime.jsx(Checkboxes, { name: "source", legend: null, defaultValue: selectedSourceKeys, onChange: function (_, values) { return setSelectedSourceKeys(values); }, items: props.dataSource
|
|
11909
|
+
.filter(function (_a) {
|
|
11910
|
+
var key = _a.key;
|
|
11911
|
+
return !targetKeys.includes(key);
|
|
11912
|
+
})
|
|
11913
|
+
.map(function (_a) {
|
|
11914
|
+
var key = _a.key, title = _a.title;
|
|
11915
|
+
return ({
|
|
11916
|
+
id: key,
|
|
11917
|
+
value: key,
|
|
11918
|
+
label: title,
|
|
11919
|
+
});
|
|
11920
|
+
}) }) }, selectedSourceKeys)] })), jsxRuntime.jsxs("div", __assign$2({ style: {
|
|
11921
|
+
display: "flex",
|
|
11922
|
+
flexDirection: "column",
|
|
11923
|
+
gap: 10,
|
|
11924
|
+
position: "relative",
|
|
11925
|
+
top: 0,
|
|
11926
|
+
bottom: 0,
|
|
11927
|
+
margin: "auto 10px",
|
|
11928
|
+
} }, { children: [jsxRuntime.jsx(IconButton, { icon: "chevronRight", size: "small", onClick: transferRight }), jsxRuntime.jsx(IconButton, { icon: "chevronLeft", size: "small", onClick: transferLeft })] })), jsxRuntime.jsxs(Card, __assign$2({ bordered: true }, { children: [((_b = props.titles) === null || _b === void 0 ? void 0 : _b.length) >= 1 && (jsxRuntime.jsxs(TitleWrapper, { children: [jsxRuntime.jsxs(Paragraph, __assign$2({ weight: "regular" }, { children: [selectedTargetKeys.length > 0 && "".concat(selectedTargetKeys.length, "/"), targetKeys.length] })), jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: props.titles[1] }))] })), jsxRuntime.jsx(CheckboxesWrapper, { children: jsxRuntime.jsx(Checkboxes, { name: "target", legend: null, defaultValue: selectedTargetKeys, onChange: function (_, values) { return setSelectedTargetKeys(values); }, items: props.dataSource
|
|
11929
|
+
.filter(function (_a) {
|
|
11930
|
+
var key = _a.key;
|
|
11931
|
+
return targetKeys.includes(key);
|
|
11932
|
+
})
|
|
11933
|
+
.map(function (_a) {
|
|
11934
|
+
var key = _a.key, title = _a.title;
|
|
11935
|
+
return ({
|
|
11936
|
+
id: key,
|
|
11937
|
+
value: key,
|
|
11938
|
+
label: title,
|
|
11939
|
+
});
|
|
11940
|
+
}) }) }, selectedTargetKeys)] }))] }));
|
|
11941
|
+
};
|
|
11942
|
+
|
|
11873
11943
|
exports.Alert = Alert;
|
|
11874
11944
|
exports.Button = Button;
|
|
11875
11945
|
exports.Card = Card;
|
|
@@ -11917,6 +11987,7 @@ exports.Tag = Tag;
|
|
|
11917
11987
|
exports.Toggle = Toggle;
|
|
11918
11988
|
exports.ToggleField = ToggleField;
|
|
11919
11989
|
exports.Tooltip = Tooltip;
|
|
11990
|
+
exports.Transfer = Transfer;
|
|
11920
11991
|
exports.Trophy = Trophy;
|
|
11921
11992
|
exports.theme = theme;
|
|
11922
11993
|
//# sourceMappingURL=index.js.map
|