@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.es.js
CHANGED
|
@@ -3381,14 +3381,14 @@ Object.defineProperty(BeatLoader, "__esModule", { value: true });
|
|
|
3381
3381
|
var React$2 = __importStar$2(React__default);
|
|
3382
3382
|
var react_1 = require$$1;
|
|
3383
3383
|
var helpers_1 = helpers$1;
|
|
3384
|
-
var beat = react_1.keyframes(templateObject_1$
|
|
3384
|
+
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"])));
|
|
3385
3385
|
var Loader = /** @class */ (function (_super) {
|
|
3386
3386
|
__extends$1(Loader, _super);
|
|
3387
3387
|
function Loader() {
|
|
3388
3388
|
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
3389
3389
|
_this.style = function (i) {
|
|
3390
3390
|
var _a = _this.props, color = _a.color, size = _a.size, margin = _a.margin, speedMultiplier = _a.speedMultiplier;
|
|
3391
|
-
return react_1.css(templateObject_2$
|
|
3391
|
+
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");
|
|
3392
3392
|
};
|
|
3393
3393
|
return _this;
|
|
3394
3394
|
}
|
|
@@ -3403,9 +3403,9 @@ var Loader = /** @class */ (function (_super) {
|
|
|
3403
3403
|
return Loader;
|
|
3404
3404
|
}(React$2.PureComponent));
|
|
3405
3405
|
var _default = BeatLoader.default = Loader;
|
|
3406
|
-
var templateObject_1$
|
|
3406
|
+
var templateObject_1$T, templateObject_2$z;
|
|
3407
3407
|
|
|
3408
|
-
var StyledButton = styled.button(templateObject_1$
|
|
3408
|
+
var StyledButton = styled.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) {
|
|
3409
3409
|
var fluid = _a.fluid;
|
|
3410
3410
|
return (fluid ? "100%" : "fit-content");
|
|
3411
3411
|
}, function (_a) {
|
|
@@ -3459,11 +3459,11 @@ var StyledButton = styled.button(templateObject_1$R || (templateObject_1$R = __m
|
|
|
3459
3459
|
? theme.button.medium.heightActive
|
|
3460
3460
|
: theme.button[size].heightActive;
|
|
3461
3461
|
});
|
|
3462
|
-
var DisabledButton = styled(StyledButton)(templateObject_2$
|
|
3462
|
+
var DisabledButton = styled(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) {
|
|
3463
3463
|
var size = _a.size;
|
|
3464
3464
|
return !size ? theme.button.medium.height : theme.button[size].height;
|
|
3465
3465
|
});
|
|
3466
|
-
var GhostButton = styled(StyledButton)(templateObject_3$
|
|
3466
|
+
var GhostButton = styled(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) {
|
|
3467
3467
|
var size = _a.size;
|
|
3468
3468
|
return !size
|
|
3469
3469
|
? "calc(".concat(theme.button.medium.height, " - 2.5px)")
|
|
@@ -3486,7 +3486,7 @@ var LoaderWrapper = styled.div(templateObject_4$8 || (templateObject_4$8 = __mak
|
|
|
3486
3486
|
var size = _a.size;
|
|
3487
3487
|
return (size === "small" ? "3px" : "");
|
|
3488
3488
|
});
|
|
3489
|
-
var templateObject_1$
|
|
3489
|
+
var templateObject_1$S, templateObject_2$y, templateObject_3$c, templateObject_4$8;
|
|
3490
3490
|
|
|
3491
3491
|
var Button = forwardRef(function (_a, ref) {
|
|
3492
3492
|
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"]);
|
|
@@ -3522,7 +3522,7 @@ var Button = forwardRef(function (_a, ref) {
|
|
|
3522
3522
|
return (jsx$1(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 ? jsx$1(Loader, {}) : jsx$1("span", { children: label }) })));
|
|
3523
3523
|
});
|
|
3524
3524
|
|
|
3525
|
-
var StyledCheckbox = styled.div(templateObject_1$
|
|
3525
|
+
var StyledCheckbox = styled.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) {
|
|
3526
3526
|
var checked = _a.checked, disabled = _a.disabled;
|
|
3527
3527
|
if (disabled)
|
|
3528
3528
|
return theme.colors.lightGray.darker;
|
|
@@ -3543,7 +3543,7 @@ var StyledCheckbox = styled.div(templateObject_1$Q || (templateObject_1$Q = __ma
|
|
|
3543
3543
|
return theme.colors.green.base;
|
|
3544
3544
|
return theme.colors.lightGray.darker;
|
|
3545
3545
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
3546
|
-
var templateObject_1$
|
|
3546
|
+
var templateObject_1$R;
|
|
3547
3547
|
|
|
3548
3548
|
var Checkbox = function (props) {
|
|
3549
3549
|
var _a;
|
|
@@ -3576,7 +3576,7 @@ var Checkbox = function (props) {
|
|
|
3576
3576
|
return (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 && (jsx$1("svg", __assign$2({ width: 16, height: 12, viewBox: "0 0 16 12", fill: "none" }, { children: jsx$1("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" }) }))), jsx$1("input", { type: "checkbox", disabled: !!props.disabled, id: props.id, name: props.name, value: props.value, ref: inputRef })] })));
|
|
3577
3577
|
};
|
|
3578
3578
|
|
|
3579
|
-
var Wrapper$a = styled.div(templateObject_1$
|
|
3579
|
+
var Wrapper$a = styled.div(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
|
|
3580
3580
|
var size = _a.size;
|
|
3581
3581
|
switch (size) {
|
|
3582
3582
|
case "small":
|
|
@@ -3599,7 +3599,7 @@ var Wrapper$a = styled.div(templateObject_1$P || (templateObject_1$P = __makeTem
|
|
|
3599
3599
|
return "27px";
|
|
3600
3600
|
}
|
|
3601
3601
|
});
|
|
3602
|
-
var templateObject_1$
|
|
3602
|
+
var templateObject_1$Q;
|
|
3603
3603
|
|
|
3604
3604
|
var parsers = {};
|
|
3605
3605
|
|
|
@@ -3867,7 +3867,7 @@ var flags = {
|
|
|
3867
3867
|
};
|
|
3868
3868
|
var Flag = function (props) { return (jsx$1(Wrapper$a, __assign$2({}, props, { children: flags[getCountryCodeByLocale_1(props.locale)] }))); };
|
|
3869
3869
|
|
|
3870
|
-
var StyledHeading = styled.span(templateObject_1$
|
|
3870
|
+
var StyledHeading = styled.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) {
|
|
3871
3871
|
var type = _a.type;
|
|
3872
3872
|
return theme.heading[type].fontSize;
|
|
3873
3873
|
}, function (_a) {
|
|
@@ -3891,14 +3891,14 @@ var StyledHeading = styled.span(templateObject_1$O || (templateObject_1$O = __ma
|
|
|
3891
3891
|
var align = _a.align;
|
|
3892
3892
|
return align;
|
|
3893
3893
|
});
|
|
3894
|
-
var templateObject_1$
|
|
3894
|
+
var templateObject_1$P;
|
|
3895
3895
|
|
|
3896
3896
|
var Heading = function (props) {
|
|
3897
3897
|
var element = !!props.as ? props.as : props.type;
|
|
3898
3898
|
return (jsx$1(StyledHeading, __assign$2({}, props, { as: element }, { children: props.children })));
|
|
3899
3899
|
};
|
|
3900
3900
|
|
|
3901
|
-
var Wrapper$9 = styled.div(templateObject_1$
|
|
3901
|
+
var Wrapper$9 = styled.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) {
|
|
3902
3902
|
var size = _a.size;
|
|
3903
3903
|
return theme.icon[size] || theme.icon.medium;
|
|
3904
3904
|
}, function (_a) {
|
|
@@ -3928,7 +3928,7 @@ var Wrapper$9 = styled.div(templateObject_1$N || (templateObject_1$N = __makeTem
|
|
|
3928
3928
|
return theme.colors.lightGray.light;
|
|
3929
3929
|
}
|
|
3930
3930
|
});
|
|
3931
|
-
var templateObject_1$
|
|
3931
|
+
var templateObject_1$O;
|
|
3932
3932
|
|
|
3933
3933
|
var icons = {
|
|
3934
3934
|
check: (jsx$1("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" })),
|
|
@@ -3945,7 +3945,7 @@ var icons = {
|
|
|
3945
3945
|
cross: (jsx$1("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" })),
|
|
3946
3946
|
bulb: (jsx$1("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" })),
|
|
3947
3947
|
star: (jsx$1("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" })),
|
|
3948
|
-
setting: (jsx$1("path", { d: "
|
|
3948
|
+
setting: (jsx$1("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" })),
|
|
3949
3949
|
reload: (jsx$1("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" })),
|
|
3950
3950
|
expand: (jsx$1("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" })),
|
|
3951
3951
|
calendar: (jsx$1("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" })),
|
|
@@ -3958,10 +3958,11 @@ var icons = {
|
|
|
3958
3958
|
heart: (jsx$1("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" })),
|
|
3959
3959
|
thunder: (jsx$1("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" })),
|
|
3960
3960
|
fire: (jsx$1("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" })),
|
|
3961
|
+
control: (jsx$1("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" })),
|
|
3961
3962
|
};
|
|
3962
3963
|
var Icon = function (props) { return (jsx$1(Wrapper$9, __assign$2({}, props, { children: jsx$1("svg", __assign$2({ viewBox: "0 0 24 24", fill: "none" }, { children: icons[props.type] })) }))); };
|
|
3963
3964
|
|
|
3964
|
-
var Wrapper$8 = styled.div(templateObject_1$
|
|
3965
|
+
var Wrapper$8 = styled.div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject$1(["\n > svg {\n height: ", ";\n }\n"], ["\n > svg {\n height: ", ";\n }\n"])), function (_a) {
|
|
3965
3966
|
var size = _a.size;
|
|
3966
3967
|
switch (size) {
|
|
3967
3968
|
case "tiny":
|
|
@@ -3975,7 +3976,7 @@ var Wrapper$8 = styled.div(templateObject_1$M || (templateObject_1$M = __makeTem
|
|
|
3975
3976
|
return "118px";
|
|
3976
3977
|
}
|
|
3977
3978
|
});
|
|
3978
|
-
var templateObject_1$
|
|
3979
|
+
var templateObject_1$N;
|
|
3979
3980
|
|
|
3980
3981
|
var illustrations = {
|
|
3981
3982
|
keyboard: (jsxs("svg", __assign$2({ viewBox: "0 0 32.9 20.8" }, { children: [jsx$1("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" }), jsx$1("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" }), jsx$1("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" }), jsx$1("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" }), jsx$1("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" }), jsx$1("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" })] }))),
|
|
@@ -3996,7 +3997,7 @@ var illustrations = {
|
|
|
3996
3997
|
};
|
|
3997
3998
|
var Illustration = function (props) { return (jsx$1(Wrapper$8, __assign$2({}, props, { children: illustrations[props.type] }))); };
|
|
3998
3999
|
|
|
3999
|
-
var StyledParagraph = styled.p(templateObject_1$
|
|
4000
|
+
var StyledParagraph = styled.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) {
|
|
4000
4001
|
var size = _a.size;
|
|
4001
4002
|
return size ? theme.paragraph[size].fontSize : theme.paragraph.medium.fontSize;
|
|
4002
4003
|
}, function (_a) {
|
|
@@ -4031,17 +4032,17 @@ var StyledParagraph = styled.p(templateObject_1$L || (templateObject_1$L = __mak
|
|
|
4031
4032
|
var transform = _a.transform;
|
|
4032
4033
|
return transform;
|
|
4033
4034
|
});
|
|
4034
|
-
var templateObject_1$
|
|
4035
|
+
var templateObject_1$M;
|
|
4035
4036
|
|
|
4036
|
-
var Container$
|
|
4037
|
-
var InputIconWrapper = styled.div(templateObject_2$
|
|
4037
|
+
var Container$m = styled.div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject$1(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
4038
|
+
var InputIconWrapper = styled.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) {
|
|
4038
4039
|
var isChanged = _a.isChanged;
|
|
4039
4040
|
return !isChanged ? theme.colors.lightGray.darker : "";
|
|
4040
4041
|
}, function (_a) {
|
|
4041
4042
|
var disabled = _a.disabled;
|
|
4042
4043
|
return (disabled ? "not-allowed" : "pointer");
|
|
4043
4044
|
});
|
|
4044
|
-
var StyledInput = styled.input(templateObject_3$
|
|
4045
|
+
var StyledInput = styled.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) {
|
|
4045
4046
|
var disabled = _a.disabled;
|
|
4046
4047
|
return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
4047
4048
|
}, function (_a) {
|
|
@@ -4060,7 +4061,7 @@ var Helper = styled(StyledParagraph)(templateObject_6$3 || (templateObject_6$3 =
|
|
|
4060
4061
|
var isOk = _a.isOk;
|
|
4061
4062
|
return isOk ? theme.colors.green.base : theme.colors.darkGray.light;
|
|
4062
4063
|
}, fadeIn);
|
|
4063
|
-
var templateObject_1$
|
|
4064
|
+
var templateObject_1$L, templateObject_2$x, templateObject_3$b, templateObject_4$7, templateObject_5$3, templateObject_6$3;
|
|
4064
4065
|
|
|
4065
4066
|
var expressions = {};
|
|
4066
4067
|
|
|
@@ -4158,7 +4159,7 @@ var PasswordInput = function (props) {
|
|
|
4158
4159
|
if (props.onKeyPress)
|
|
4159
4160
|
props.onKeyPress(e);
|
|
4160
4161
|
};
|
|
4161
|
-
return (jsxs(Container$
|
|
4162
|
+
return (jsxs(Container$m, { children: [jsxs(InputIconWrapper, __assign$2({ disabled: props.disabled }, { children: [jsx$1(Icon, { type: isVisible ? "eyeInvisible" : "eye", color: "gray", size: "small", onClick: toggle }), jsx$1(StyledInput, __assign$2({ type: isVisible ? "text" : "password" }, props, { onChange: onChange, onKeyPress: onKeyPress }))] })), props.helperLocale && value.length ? (jsxs(HelperContainer, { children: [jsxs(Helper, __assign$2({ isOk: expressions.hasCapitalLetter(value) }, { children: ["\u2022 ", translations[props.helperLocale].capitalLetter] })), jsxs(Helper, __assign$2({ isOk: expressions.hasNumber(value) }, { children: ["\u2022 ", translations[props.helperLocale].number] })), jsxs(Helper, __assign$2({ isOk: expressions.hasSpecialCharacter(value) }, { children: ["\u2022 ", translations[props.helperLocale].specialCharacter] })), jsxs(Helper, __assign$2({ isOk: value.length >= 8 }, { children: ["\u2022 ", translations[props.helperLocale].length] }))] })) : null] }));
|
|
4162
4163
|
};
|
|
4163
4164
|
|
|
4164
4165
|
function requiredArgs(required, args) {
|
|
@@ -4492,7 +4493,7 @@ Input.Date = DateInput;
|
|
|
4492
4493
|
|
|
4493
4494
|
var Logo = function (props) { return (jsxs("svg", __assign$2({ width: 396, height: 66, viewBox: "0 0 662.8 118.1", fill: "none", xmlSpace: "preserve" }, props, { children: [jsxs("g", { children: [jsx$1("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" }), jsx$1("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" }), jsx$1("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" }), jsx$1("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" }), jsx$1("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" })] }), jsxs("g", __assign$2({ fill: "#23292f" }, { children: [jsx$1("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" }), jsx$1("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" })] }))] }))); };
|
|
4494
4495
|
|
|
4495
|
-
var Wrapper$7 = styled.div(templateObject_1$
|
|
4496
|
+
var Wrapper$7 = styled.div(templateObject_1$K || (templateObject_1$K = __makeTemplateObject$1(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
|
|
4496
4497
|
var size = _a.size;
|
|
4497
4498
|
switch (size) {
|
|
4498
4499
|
default:
|
|
@@ -4502,7 +4503,7 @@ var Wrapper$7 = styled.div(templateObject_1$J || (templateObject_1$J = __makeTem
|
|
|
4502
4503
|
return "116px";
|
|
4503
4504
|
}
|
|
4504
4505
|
});
|
|
4505
|
-
var templateObject_1$
|
|
4506
|
+
var templateObject_1$K;
|
|
4506
4507
|
|
|
4507
4508
|
var medals = {
|
|
4508
4509
|
small: {
|
|
@@ -4518,11 +4519,11 @@ var medals = {
|
|
|
4518
4519
|
};
|
|
4519
4520
|
var Medal = function (props) { return (jsx$1(Wrapper$7, __assign$2({}, props, { children: medals[props.size || "small"][props.type] }))); };
|
|
4520
4521
|
|
|
4521
|
-
var Wrapper$6 = styled.div(templateObject_1$
|
|
4522
|
+
var Wrapper$6 = styled.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) {
|
|
4522
4523
|
var disabled = _a.disabled;
|
|
4523
4524
|
return (disabled ? "49.5px" : "");
|
|
4524
4525
|
});
|
|
4525
|
-
var StyledInputNumber = styled.input(templateObject_2$
|
|
4526
|
+
var StyledInputNumber = styled.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) {
|
|
4526
4527
|
var disabled = _a.disabled;
|
|
4527
4528
|
return disabled ? theme.colors.lightGray.base : theme.colors.lightGray.light;
|
|
4528
4529
|
}, function (_a) {
|
|
@@ -4535,7 +4536,7 @@ var StyledInputNumber = styled.input(templateObject_2$v || (templateObject_2$v =
|
|
|
4535
4536
|
var disabled = _a.disabled;
|
|
4536
4537
|
return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
|
|
4537
4538
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
4538
|
-
var templateObject_1$
|
|
4539
|
+
var templateObject_1$J, templateObject_2$w;
|
|
4539
4540
|
|
|
4540
4541
|
var Number$1 = function (props) {
|
|
4541
4542
|
var inputRef = useRef(null);
|
|
@@ -4574,7 +4575,7 @@ var Number$1 = function (props) {
|
|
|
4574
4575
|
|
|
4575
4576
|
var Paragraph = function (props) { return (jsx$1(StyledParagraph, __assign$2({}, props, { children: props.children }))); };
|
|
4576
4577
|
|
|
4577
|
-
var StyledRadio = styled.div(templateObject_1$
|
|
4578
|
+
var StyledRadio = styled.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) {
|
|
4578
4579
|
var checked = _a.checked, disabled = _a.disabled;
|
|
4579
4580
|
if (disabled)
|
|
4580
4581
|
return theme.colors.lightGray.darker;
|
|
@@ -4602,7 +4603,7 @@ var StyledRadio = styled.div(templateObject_1$H || (templateObject_1$H = __makeT
|
|
|
4602
4603
|
return theme.colors.green.base;
|
|
4603
4604
|
return "";
|
|
4604
4605
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
4605
|
-
var templateObject_1$
|
|
4606
|
+
var templateObject_1$I;
|
|
4606
4607
|
|
|
4607
4608
|
var Radio = function (props) {
|
|
4608
4609
|
var _a, _b;
|
|
@@ -4634,7 +4635,7 @@ var Radio = function (props) {
|
|
|
4634
4635
|
return (jsx$1(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: jsx$1("input", { type: "radio", disabled: !!props.disabled, id: props.id, name: props.name, value: props.value, ref: inputRef }) })));
|
|
4635
4636
|
};
|
|
4636
4637
|
|
|
4637
|
-
var StyledRange = styled.div(templateObject_1$
|
|
4638
|
+
var StyledRange = styled.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) {
|
|
4638
4639
|
var value = _a.value, disabled = _a.disabled;
|
|
4639
4640
|
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 )");
|
|
4640
4641
|
}, function () { return theme.colors.lightGray.light; }, function (_a) {
|
|
@@ -4644,7 +4645,7 @@ var StyledRange = styled.div(templateObject_1$G || (templateObject_1$G = __makeT
|
|
|
4644
4645
|
var disabled = _a.disabled;
|
|
4645
4646
|
return disabled ? "not-allowed" : "pointer";
|
|
4646
4647
|
});
|
|
4647
|
-
var templateObject_1$
|
|
4648
|
+
var templateObject_1$H;
|
|
4648
4649
|
|
|
4649
4650
|
var Range = function (props) {
|
|
4650
4651
|
var _a;
|
|
@@ -4673,11 +4674,11 @@ var Range = function (props) {
|
|
|
4673
4674
|
return (jsx$1(StyledRange, __assign$2({ value: value, disabled: props.disabled }, { children: jsx$1("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 }) })));
|
|
4674
4675
|
};
|
|
4675
4676
|
|
|
4676
|
-
var Wrapper$5 = styled.div(templateObject_1$
|
|
4677
|
+
var Wrapper$5 = styled.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) {
|
|
4677
4678
|
var disabled = _a.disabled;
|
|
4678
4679
|
return (disabled ? "not-allowed" : "pointer");
|
|
4679
4680
|
});
|
|
4680
|
-
var StyledSelect = styled.select(templateObject_2$
|
|
4681
|
+
var StyledSelect = styled.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) {
|
|
4681
4682
|
var disabled = _a.disabled;
|
|
4682
4683
|
return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
4683
4684
|
}, function (_a) {
|
|
@@ -4690,7 +4691,7 @@ var StyledSelect = styled.select(templateObject_2$u || (templateObject_2$u = __m
|
|
|
4690
4691
|
var isChanged = _a.isChanged;
|
|
4691
4692
|
return isChanged ? theme.colors.darkGray.base : theme.colors.lightGray.darker;
|
|
4692
4693
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
4693
|
-
var templateObject_1$
|
|
4694
|
+
var templateObject_1$G, templateObject_2$v;
|
|
4694
4695
|
|
|
4695
4696
|
var Select = function (props) {
|
|
4696
4697
|
var _a;
|
|
@@ -4712,18 +4713,18 @@ var Select = function (props) {
|
|
|
4712
4713
|
return (jsxs(Wrapper$5, { children: [jsx$1(Icon, { type: "chevronDown", color: "gray", size: "small" }), jsxs(StyledSelect, __assign$2({}, props, { onChange: onChange, isChanged: isChanged || props.defaultValue, ref: inputRef }, { children: [props.placeholder && jsx$1("option", __assign$2({ hidden: true }, { children: props.placeholder })), props.children] }))] }));
|
|
4713
4714
|
};
|
|
4714
4715
|
|
|
4715
|
-
var StyledSpacer = styled.div(templateObject_1$
|
|
4716
|
+
var StyledSpacer = styled.div(templateObject_1$F || (templateObject_1$F = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
|
|
4716
4717
|
var horizontal = _a.horizontal;
|
|
4717
4718
|
return (horizontal ? "".concat(horizontal, "px") : "");
|
|
4718
4719
|
}, function (_a) {
|
|
4719
4720
|
var vertical = _a.vertical;
|
|
4720
4721
|
return (vertical ? "".concat(vertical, "px") : "");
|
|
4721
4722
|
});
|
|
4722
|
-
var templateObject_1$
|
|
4723
|
+
var templateObject_1$F;
|
|
4723
4724
|
|
|
4724
4725
|
var Spacer = function (props) { return (jsx$1(StyledSpacer, __assign$2({}, props))); };
|
|
4725
4726
|
|
|
4726
|
-
var StyledSubheading = styled.p(templateObject_1$
|
|
4727
|
+
var StyledSubheading = styled.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) {
|
|
4727
4728
|
var size = _a.size;
|
|
4728
4729
|
return size ? theme.subheading[size].fontSize : theme.subheading.medium.fontSize;
|
|
4729
4730
|
}, function (_a) {
|
|
@@ -4751,18 +4752,18 @@ var StyledSubheading = styled.p(templateObject_1$D || (templateObject_1$D = __ma
|
|
|
4751
4752
|
return theme.colors.darkGray.dark;
|
|
4752
4753
|
}
|
|
4753
4754
|
});
|
|
4754
|
-
var templateObject_1$
|
|
4755
|
+
var templateObject_1$E;
|
|
4755
4756
|
|
|
4756
4757
|
var Subheading = function (props) { return (jsx$1(StyledSubheading, __assign$2({}, props, { children: props.children }))); };
|
|
4757
4758
|
|
|
4758
|
-
var Container$
|
|
4759
|
-
var templateObject_1$
|
|
4759
|
+
var Container$l = styled.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);
|
|
4760
|
+
var templateObject_1$D;
|
|
4760
4761
|
|
|
4761
4762
|
var Tag = function (props) {
|
|
4762
|
-
return jsx$1(Container$
|
|
4763
|
+
return jsx$1(Container$l, { children: props.children });
|
|
4763
4764
|
};
|
|
4764
4765
|
|
|
4765
|
-
var Container$
|
|
4766
|
+
var Container$k = styled.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) {
|
|
4766
4767
|
var disabled = _a.disabled;
|
|
4767
4768
|
return (disabled ? "not-allowed" : "pointer");
|
|
4768
4769
|
}, function (_a) {
|
|
@@ -4780,7 +4781,7 @@ var Container$j = styled.div(templateObject_1$B || (templateObject_1$B = __makeT
|
|
|
4780
4781
|
var disabled = _a.disabled;
|
|
4781
4782
|
return disabled ? theme.colors.lightGray.darker : theme.colors.lightGray.light;
|
|
4782
4783
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
4783
|
-
var templateObject_1$
|
|
4784
|
+
var templateObject_1$C;
|
|
4784
4785
|
|
|
4785
4786
|
var Toggle = function (props) {
|
|
4786
4787
|
var _a;
|
|
@@ -4808,10 +4809,10 @@ var Toggle = function (props) {
|
|
|
4808
4809
|
props.onChange(newValue);
|
|
4809
4810
|
}
|
|
4810
4811
|
};
|
|
4811
|
-
return (jsx$1(Container$
|
|
4812
|
+
return (jsx$1(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: jsx$1("input", { type: "checkbox", disabled: !!props.disabled, id: props.id, name: props.name, ref: inputRef }) })));
|
|
4812
4813
|
};
|
|
4813
4814
|
|
|
4814
|
-
var Wrapper$4 = styled.div(templateObject_1$
|
|
4815
|
+
var Wrapper$4 = styled.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) {
|
|
4815
4816
|
var level = _a.level;
|
|
4816
4817
|
switch (level) {
|
|
4817
4818
|
case 1:
|
|
@@ -4822,7 +4823,7 @@ var Wrapper$4 = styled.div(templateObject_1$A || (templateObject_1$A = __makeTem
|
|
|
4822
4823
|
return "70px";
|
|
4823
4824
|
}
|
|
4824
4825
|
});
|
|
4825
|
-
var templateObject_1$
|
|
4826
|
+
var templateObject_1$B;
|
|
4826
4827
|
|
|
4827
4828
|
var trophies = {
|
|
4828
4829
|
1: {
|
|
@@ -4858,7 +4859,7 @@ var trophies = {
|
|
|
4858
4859
|
};
|
|
4859
4860
|
var Trophy = function (props) { return (jsx$1(Wrapper$4, __assign$2({}, props, { children: trophies[props.variant][props.level] }))); };
|
|
4860
4861
|
|
|
4861
|
-
var Container$
|
|
4862
|
+
var Container$j = styled.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) {
|
|
4862
4863
|
var type = _a.type;
|
|
4863
4864
|
switch (type) {
|
|
4864
4865
|
case "success":
|
|
@@ -4875,11 +4876,11 @@ var Container$i = styled.div(templateObject_1$z || (templateObject_1$z = __makeT
|
|
|
4875
4876
|
return theme.colors.red.base;
|
|
4876
4877
|
}
|
|
4877
4878
|
});
|
|
4878
|
-
var templateObject_1$
|
|
4879
|
+
var templateObject_1$A;
|
|
4879
4880
|
|
|
4880
|
-
var Alert = function (props) { return (jsxs(Container$
|
|
4881
|
+
var Alert = function (props) { return (jsxs(Container$j, __assign$2({}, props, { children: [jsx$1(Icon, { size: "small", type: props.type === "success" ? "check" : "warning", color: props.type === "success" ? "green" : "red" }), jsx$1(Paragraph, { children: props.message })] }))); };
|
|
4881
4882
|
|
|
4882
|
-
var StyledCard = styled.div(templateObject_1$
|
|
4883
|
+
var StyledCard = styled.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) {
|
|
4883
4884
|
var bordered = _a.bordered;
|
|
4884
4885
|
return bordered ? "1px solid ".concat(theme.colors.lightGray.dark) : "none";
|
|
4885
4886
|
}, function (_a) {
|
|
@@ -4891,23 +4892,23 @@ var StyledCard = styled.div(templateObject_1$y || (templateObject_1$y = __makeTe
|
|
|
4891
4892
|
}, ";\n\n > div:first-child {\n width: 175%;\n padding-bottom: 175%;\n top: -25%;\n right: -25%;\n }\n }")
|
|
4892
4893
|
: "";
|
|
4893
4894
|
});
|
|
4894
|
-
var Ellipse = styled.div(templateObject_2$
|
|
4895
|
+
var Ellipse = styled.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) {
|
|
4895
4896
|
var color = _a.color;
|
|
4896
4897
|
return color ? theme.colors[color].light : "";
|
|
4897
4898
|
});
|
|
4898
|
-
var Content = styled.div(templateObject_3$
|
|
4899
|
-
var templateObject_1$
|
|
4899
|
+
var Content = styled.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"])));
|
|
4900
|
+
var templateObject_1$z, templateObject_2$u, templateObject_3$a;
|
|
4900
4901
|
|
|
4901
4902
|
var Card = function (props) { return (jsxs(StyledCard, __assign$2({}, props, { children: [props.ellipse && jsx$1(Ellipse, { color: props.ellipse }), jsx$1(Content, { children: props.children })] }))); };
|
|
4902
4903
|
|
|
4903
|
-
var Fieldset$1 = styled.fieldset(templateObject_1$
|
|
4904
|
-
var CheckboxContainer = styled.div(templateObject_2$
|
|
4905
|
-
var CheckboxWrapper = styled.div(templateObject_3$
|
|
4904
|
+
var Fieldset$1 = styled.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"])));
|
|
4905
|
+
var CheckboxContainer = styled.div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
|
|
4906
|
+
var CheckboxWrapper = styled.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"])));
|
|
4906
4907
|
var Label$9 = styled(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) {
|
|
4907
4908
|
var weight = _a.weight;
|
|
4908
4909
|
return weight || 500;
|
|
4909
4910
|
}, theme.colors.darkGray.base, theme.colors.blue.base);
|
|
4910
|
-
var templateObject_1$
|
|
4911
|
+
var templateObject_1$y, templateObject_2$t, templateObject_3$9, templateObject_4$6;
|
|
4911
4912
|
|
|
4912
4913
|
var Checkboxes = function (props) {
|
|
4913
4914
|
var _a = useState(props.defaultValue || []), values = _a[0], setValues = _a[1];
|
|
@@ -4930,12 +4931,12 @@ var Checkboxes = function (props) {
|
|
|
4930
4931
|
}) })] }));
|
|
4931
4932
|
};
|
|
4932
4933
|
|
|
4933
|
-
var Container$
|
|
4934
|
-
var Item = styled.div(templateObject_2$
|
|
4934
|
+
var Container$i = styled.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);
|
|
4935
|
+
var Item = styled.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) {
|
|
4935
4936
|
var isOpen = _a.isOpen;
|
|
4936
4937
|
return (isOpen ? "" : "none");
|
|
4937
4938
|
}, theme.colors.lightGray.dark);
|
|
4938
|
-
var templateObject_1$
|
|
4939
|
+
var templateObject_1$x, templateObject_2$s;
|
|
4939
4940
|
|
|
4940
4941
|
var Collapse = function (props) {
|
|
4941
4942
|
var _a = useState([]), openItems = _a[0], setOpenItems = _a[1];
|
|
@@ -4947,18 +4948,18 @@ var Collapse = function (props) {
|
|
|
4947
4948
|
setOpenItems(function (prevState) { return __spreadArray(__spreadArray([], prevState, true), [index], false); });
|
|
4948
4949
|
}
|
|
4949
4950
|
};
|
|
4950
|
-
return (jsx$1(Container$
|
|
4951
|
+
return (jsx$1(Container$i, __assign$2({}, props, { children: props.items.map(function (item, index) {
|
|
4951
4952
|
var isOpen = openItems.includes(index);
|
|
4952
4953
|
return (jsxs(Item, __assign$2({ isOpen: isOpen, onClick: function () { return onClickItem(index, isOpen); } }, { children: [jsxs("div", { children: [jsx$1(Heading, __assign$2({ type: "h6" }, { children: item.title })), jsx$1(Icon, { type: isOpen ? "chevronUp" : "chevronDown", color: "blue" })] }), jsx$1(Paragraph, __assign$2({ weight: "regular" }, { children: item.content }))] }), "".concat(item.title, "-").concat(index)));
|
|
4953
4954
|
}) })));
|
|
4954
4955
|
};
|
|
4955
4956
|
|
|
4956
|
-
var Wrapper$3 = styled.div(templateObject_1$
|
|
4957
|
-
var Value = styled.div(templateObject_2$
|
|
4957
|
+
var Wrapper$3 = styled.div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject$1(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
4958
|
+
var Value = styled.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) {
|
|
4958
4959
|
var contrast = _a.contrast;
|
|
4959
4960
|
return contrast ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
4960
4961
|
}, theme.colors.darkGray.base);
|
|
4961
|
-
var templateObject_1$
|
|
4962
|
+
var templateObject_1$w, templateObject_2$r;
|
|
4962
4963
|
|
|
4963
4964
|
var Countdown = function (_a) {
|
|
4964
4965
|
var till = _a.till, contrast = _a.contrast;
|
|
@@ -4985,9 +4986,9 @@ var Countdown = function (_a) {
|
|
|
4985
4986
|
return (jsxs(Wrapper$3, { children: [jsx$1(Value, __assign$2({ contrast: contrast }, { children: jsx$1(Heading, __assign$2({ type: "h5" }, { children: HH })) })), jsx$1(Heading, __assign$2({ type: "h5", color: color }, { children: ":" })), jsx$1(Value, __assign$2({ contrast: contrast }, { children: jsx$1(Heading, __assign$2({ type: "h5" }, { children: MM })) })), jsx$1(Heading, __assign$2({ type: "h5", color: color }, { children: ":" })), jsx$1(Value, __assign$2({ contrast: contrast }, { children: jsx$1(Heading, __assign$2({ type: "h5" }, { children: SS })) }))] }));
|
|
4986
4987
|
};
|
|
4987
4988
|
|
|
4988
|
-
var Container$
|
|
4989
|
-
var Label$8 = styled(StyledParagraph)(templateObject_2$
|
|
4990
|
-
var templateObject_1$
|
|
4989
|
+
var Container$h = styled.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"])));
|
|
4990
|
+
var Label$8 = styled(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);
|
|
4991
|
+
var templateObject_1$v, templateObject_2$q;
|
|
4991
4992
|
|
|
4992
4993
|
var DateInputField = function (props) {
|
|
4993
4994
|
var onChange = function (value) {
|
|
@@ -4998,10 +4999,10 @@ var DateInputField = function (props) {
|
|
|
4998
4999
|
if (props.onBlur)
|
|
4999
5000
|
props.onBlur(props.name);
|
|
5000
5001
|
};
|
|
5001
|
-
return (jsxs(Container$
|
|
5002
|
+
return (jsxs(Container$h, { children: [jsx$1(Label$8, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsx$1(Spacer, { vertical: 5 }), jsx$1(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 })] }));
|
|
5002
5003
|
};
|
|
5003
5004
|
|
|
5004
|
-
var StyledIconButton = styled(StyledButton)(templateObject_1$
|
|
5005
|
+
var StyledIconButton = styled(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) {
|
|
5005
5006
|
var size = _a.size;
|
|
5006
5007
|
return (size === "small" ? "30px" : "40px");
|
|
5007
5008
|
}, function (_a) {
|
|
@@ -5020,7 +5021,7 @@ var StyledIconButton = styled(StyledButton)(templateObject_1$t || (templateObjec
|
|
|
5020
5021
|
var size = _a.size;
|
|
5021
5022
|
return (size === "small" ? "28px" : "38px");
|
|
5022
5023
|
});
|
|
5023
|
-
var GhostIconButton = styled(GhostButton)(templateObject_2$
|
|
5024
|
+
var GhostIconButton = styled(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) {
|
|
5024
5025
|
var size = _a.size;
|
|
5025
5026
|
return (size === "small" ? "30px" : "40px");
|
|
5026
5027
|
}, function (_a) {
|
|
@@ -5039,7 +5040,7 @@ var GhostIconButton = styled(GhostButton)(templateObject_2$o || (templateObject_
|
|
|
5039
5040
|
var size = _a.size;
|
|
5040
5041
|
return (size === "small" ? "32px" : "40px");
|
|
5041
5042
|
});
|
|
5042
|
-
var templateObject_1$
|
|
5043
|
+
var templateObject_1$u, templateObject_2$p;
|
|
5043
5044
|
|
|
5044
5045
|
var IconButton = function (props) {
|
|
5045
5046
|
if (props.color === "white")
|
|
@@ -5047,9 +5048,9 @@ var IconButton = function (props) {
|
|
|
5047
5048
|
return (jsx$1(StyledIconButton, __assign$2({}, props, { children: jsx$1(Icon, { type: props.icon, size: props.size === "small" ? "tiny" : "small", color: "white" }) })));
|
|
5048
5049
|
};
|
|
5049
5050
|
|
|
5050
|
-
var Container$
|
|
5051
|
-
var Label$7 = styled(StyledParagraph)(templateObject_2$
|
|
5052
|
-
var templateObject_1$
|
|
5051
|
+
var Container$g = styled.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"])));
|
|
5052
|
+
var Label$7 = styled(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);
|
|
5053
|
+
var templateObject_1$t, templateObject_2$o;
|
|
5053
5054
|
|
|
5054
5055
|
var InputField = function (props) {
|
|
5055
5056
|
var onChange = function (value) {
|
|
@@ -5060,10 +5061,10 @@ var InputField = function (props) {
|
|
|
5060
5061
|
if (props.onBlur)
|
|
5061
5062
|
props.onBlur(props.name);
|
|
5062
5063
|
};
|
|
5063
|
-
return (jsxs(Container$
|
|
5064
|
+
return (jsxs(Container$g, { children: [jsx$1(Label$7, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsx$1(Spacer, { vertical: 5 }), jsx$1(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 && (jsxs("div", __assign$2({ style: { marginLeft: "5px" } }, { children: [jsx$1(Spacer, { vertical: 5 }), props.tips.map(function (tip, index) { return (jsxs(Paragraph, __assign$2({ size: "small", weight: "regular" }, { children: ["\u2022 ", tip] }), "".concat(tip, "-").concat(index))); })] })))] }));
|
|
5064
5065
|
};
|
|
5065
5066
|
|
|
5066
|
-
var Container$
|
|
5067
|
+
var Container$f = styled.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) {
|
|
5067
5068
|
var status = _a.status, color = _a.color;
|
|
5068
5069
|
switch (status) {
|
|
5069
5070
|
case "passed":
|
|
@@ -5107,23 +5108,23 @@ var Container$e = styled.div(templateObject_1$r || (templateObject_1$r = __makeT
|
|
|
5107
5108
|
return theme.colors.darkGray.light;
|
|
5108
5109
|
}
|
|
5109
5110
|
});
|
|
5110
|
-
var CheckIconWrapper = styled.div(templateObject_2$
|
|
5111
|
-
var templateObject_1$
|
|
5111
|
+
var CheckIconWrapper = styled.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"])));
|
|
5112
|
+
var templateObject_1$s, templateObject_2$n;
|
|
5112
5113
|
|
|
5113
|
-
var Key$1 = function (props) { return (jsxs(Container$
|
|
5114
|
+
var Key$1 = function (props) { return (jsxs(Container$f, __assign$2({}, props, { children: [props.status === "passed" && (jsx$1(CheckIconWrapper, { children: jsx$1(Icon, { type: "check", color: "green", size: "small" }) })), props.char === " " ? (jsx$1("svg", __assign$2({ width: "28", height: "28", viewBox: "0 0 28 1", style: {
|
|
5114
5115
|
marginTop: "13px",
|
|
5115
5116
|
transform: "scale(2)",
|
|
5116
5117
|
} }, { children: jsx$1("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" }) }))) : (jsx$1(Heading, __assign$2({ type: "h1" }, { children: props.char })))] }))); };
|
|
5117
5118
|
|
|
5118
|
-
var Wrapper$2 = styled.a(templateObject_1$
|
|
5119
|
+
var Wrapper$2 = styled.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) {
|
|
5119
5120
|
var chevron = _a.chevron;
|
|
5120
5121
|
return (chevron === "left" ? "4px" : "");
|
|
5121
5122
|
}, function (_a) {
|
|
5122
5123
|
var chevron = _a.chevron;
|
|
5123
5124
|
return (chevron === "right" ? "4px" : "");
|
|
5124
5125
|
});
|
|
5125
|
-
var StyledLink = styled(StyledParagraph)(templateObject_2$
|
|
5126
|
-
var templateObject_1$
|
|
5126
|
+
var StyledLink = styled(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);
|
|
5127
|
+
var templateObject_1$r, templateObject_2$m;
|
|
5127
5128
|
|
|
5128
5129
|
var Link = function (props) {
|
|
5129
5130
|
var onClick = function (e) {
|
|
@@ -5135,15 +5136,15 @@ var Link = function (props) {
|
|
|
5135
5136
|
return (jsxs(Wrapper$2, __assign$2({ chevron: props.chevron, href: props.href, onClick: onClick }, { children: [props.chevron === "left" && jsx$1(Icon, { type: "chevronLeft", color: "green" }), jsx$1(StyledLink, __assign$2({ size: "large" }, { children: props.children })), props.chevron !== "none" && props.chevron !== "left" && (jsx$1(Icon, { type: "chevronRight", color: "green" }))] })));
|
|
5136
5137
|
};
|
|
5137
5138
|
|
|
5138
|
-
var Container$
|
|
5139
|
+
var Container$e = styled.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) {
|
|
5139
5140
|
var text = _a.text;
|
|
5140
5141
|
return (text ? "20px" : "");
|
|
5141
5142
|
});
|
|
5142
|
-
var templateObject_1$
|
|
5143
|
+
var templateObject_1$q;
|
|
5143
5144
|
|
|
5144
|
-
var Loading = function (props) { return (jsxs(Container$
|
|
5145
|
+
var Loading = function (props) { return (jsxs(Container$e, __assign$2({}, props, { children: [jsx$1(_default, { color: theme.colors[props.color].base, speedMultiplier: 0.5 }), props.text && (jsxs(Fragment$1, { children: [jsx$1(Spacer, { vertical: 20 }), jsx$1(Heading, __assign$2({ type: "h6", color: props.textColor || "black" }, { children: props.text }))] }))] }))); };
|
|
5145
5146
|
|
|
5146
|
-
var Container$
|
|
5147
|
+
var Container$d = styled.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) {
|
|
5147
5148
|
var dropdownIsVisible = _a.dropdownIsVisible, color = _a.color;
|
|
5148
5149
|
if (dropdownIsVisible) {
|
|
5149
5150
|
switch (color) {
|
|
@@ -5156,8 +5157,8 @@ var Container$c = styled.div(templateObject_1$o || (templateObject_1$o = __makeT
|
|
|
5156
5157
|
}
|
|
5157
5158
|
return "";
|
|
5158
5159
|
});
|
|
5159
|
-
var SelectedLocaleWrapper = styled.div(templateObject_2$
|
|
5160
|
-
var DropdownContainer = styled.div(templateObject_3$
|
|
5160
|
+
var SelectedLocaleWrapper = styled.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"])));
|
|
5161
|
+
var DropdownContainer = styled.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) {
|
|
5161
5162
|
var color = _a.color;
|
|
5162
5163
|
switch (color) {
|
|
5163
5164
|
default:
|
|
@@ -5168,7 +5169,7 @@ var DropdownContainer = styled.div(templateObject_3$7 || (templateObject_3$7 = _
|
|
|
5168
5169
|
}
|
|
5169
5170
|
});
|
|
5170
5171
|
var LocaleWrapper = styled.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);
|
|
5171
|
-
var templateObject_1$
|
|
5172
|
+
var templateObject_1$p, templateObject_2$l, templateObject_3$8, templateObject_4$5;
|
|
5172
5173
|
|
|
5173
5174
|
var LocaleSelect = function (props) {
|
|
5174
5175
|
var _a = useState(false), dropdownIsVisible = _a[0], setDropdownIsVisible = _a[1];
|
|
@@ -5177,22 +5178,22 @@ var LocaleSelect = function (props) {
|
|
|
5177
5178
|
setLocale(locale);
|
|
5178
5179
|
props.onChange(locale);
|
|
5179
5180
|
};
|
|
5180
|
-
return (jsxs(Container$
|
|
5181
|
+
return (jsxs(Container$d, __assign$2({ color: props.color || "light", dropdownIsVisible: dropdownIsVisible, onClick: function () { return setDropdownIsVisible(!dropdownIsVisible); }, onMouseLeave: function () { return setDropdownIsVisible(false); } }, { children: [jsxs(SelectedLocaleWrapper, { children: [jsxs("div", { children: [jsx$1(Flag, { locale: locale }), jsx$1(Spacer, { horizontal: 10 }), jsx$1(Heading, __assign$2({ type: "h6" }, { children: getNativeLanguageByLocale_1(locale) }))] }), dropdownIsVisible ? (jsx$1(Icon, { type: "chevronUp", size: "small", color: "darkGray" })) : (jsx$1(Icon, { type: "chevronDown", size: "small", color: "darkGray" }))] }), dropdownIsVisible && (jsx$1(DropdownContainer, __assign$2({ color: props.color || "light" }, { children: props.locales
|
|
5181
5182
|
.filter(function (l) { return l !== locale; })
|
|
5182
5183
|
.map(function (locale) { return (jsxs(LocaleWrapper, __assign$2({ onClick: function () { return onSelectLocale(locale); } }, { children: [jsxs("div", { children: [jsx$1(Flag, { locale: locale }), jsx$1(Spacer, { horizontal: 10 }), jsx$1(Paragraph, __assign$2({ size: "small", weight: "regular", color: "darkGray" }, { children: getNativeLanguageByLocale_1(locale) }))] }), jsx$1(Icon, { type: "chevronRight", size: "small", color: "darkGray" })] }), locale)); }) })))] })));
|
|
5183
5184
|
};
|
|
5184
5185
|
|
|
5185
|
-
var Wrapper$1 = styled.div(templateObject_1$
|
|
5186
|
-
var templateObject_1$
|
|
5186
|
+
var Wrapper$1 = styled.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"])));
|
|
5187
|
+
var templateObject_1$o;
|
|
5187
5188
|
|
|
5188
5189
|
var Medals = function (props) { return (jsxs(Wrapper$1, { children: [jsxs("div", { children: [jsx$1(Medal, { type: Medal$1.GOLD }), jsx$1(Spacer, { horizontal: 5 }), jsxs(Heading, __assign$2({ type: "h6" }, { children: ["x ", props.gold || 0] }))] }), jsxs("div", { children: [jsx$1(Medal, { type: Medal$1.SILVER }), jsx$1(Spacer, { horizontal: 5 }), jsxs(Heading, __assign$2({ type: "h6" }, { children: ["x ", props.silver || 0] }))] }), jsxs("div", { children: [jsx$1(Medal, { type: Medal$1.BRONZE }), jsx$1(Spacer, { horizontal: 5 }), jsxs(Heading, __assign$2({ type: "h6" }, { children: ["x ", props.bronze || 0] }))] })] })); };
|
|
5189
5190
|
|
|
5190
|
-
var NotificationContainer = styled.div(templateObject_1$
|
|
5191
|
+
var NotificationContainer = styled.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) {
|
|
5191
5192
|
var contrast = _a.contrast;
|
|
5192
5193
|
return contrast ? theme.colors.lightGray.light : theme.colors.lightGray.base;
|
|
5193
5194
|
});
|
|
5194
|
-
var ButtonContainer = styled.div(templateObject_2$
|
|
5195
|
-
var templateObject_1$
|
|
5195
|
+
var ButtonContainer = styled.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"])));
|
|
5196
|
+
var templateObject_1$n, templateObject_2$k;
|
|
5196
5197
|
|
|
5197
5198
|
var Notification = function (props) {
|
|
5198
5199
|
if (!props.isVisible)
|
|
@@ -5200,9 +5201,9 @@ var Notification = function (props) {
|
|
|
5200
5201
|
return (jsxs(NotificationContainer, __assign$2({ contrast: !!props.contrast }, { children: [jsxs("div", { children: [jsx$1(Heading, __assign$2({ type: "h4" }, { children: props.title })), props.onClose && (jsxs(Fragment$1, { children: [jsx$1(Spacer, { horizontal: 15 }), jsx$1(IconButton, { icon: "cross", color: "green", onClick: props.onClose })] }))] }), jsx$1(Paragraph, __assign$2({ size: "small", weight: "regular", color: "darkGray" }, { children: props.content })), props.buttons && (jsx$1(ButtonContainer, { children: props.buttons.map(function (button, index) { return (createElement(Button, __assign$2({}, button, { size: "small", color: index + 1 === props.buttons.length ? "blue" : "white", key: "button-".concat(index) }))); }) }))] })));
|
|
5201
5202
|
};
|
|
5202
5203
|
|
|
5203
|
-
var Container$
|
|
5204
|
-
var Label$6 = styled(StyledParagraph)(templateObject_2$
|
|
5205
|
-
var templateObject_1$
|
|
5204
|
+
var Container$c = styled.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"])));
|
|
5205
|
+
var Label$6 = styled(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);
|
|
5206
|
+
var templateObject_1$m, templateObject_2$j;
|
|
5206
5207
|
|
|
5207
5208
|
var NumberField = function (props) {
|
|
5208
5209
|
var onChange = function (value) {
|
|
@@ -5213,12 +5214,12 @@ var NumberField = function (props) {
|
|
|
5213
5214
|
if (props.onBlur)
|
|
5214
5215
|
props.onBlur(props.name);
|
|
5215
5216
|
};
|
|
5216
|
-
return (jsxs(Container$
|
|
5217
|
+
return (jsxs(Container$c, { children: [jsx$1(Label$6, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsx$1(Spacer, { vertical: 5 }), jsx$1(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 })] }));
|
|
5217
5218
|
};
|
|
5218
5219
|
|
|
5219
|
-
var Container$
|
|
5220
|
-
var Label$5 = styled(StyledParagraph)(templateObject_2$
|
|
5221
|
-
var templateObject_1$
|
|
5220
|
+
var Container$b = styled.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"])));
|
|
5221
|
+
var Label$5 = styled(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);
|
|
5222
|
+
var templateObject_1$l, templateObject_2$i;
|
|
5222
5223
|
|
|
5223
5224
|
var PasswordInputField = function (props) {
|
|
5224
5225
|
var onChange = function (value) {
|
|
@@ -5234,7 +5235,7 @@ var PasswordInputField = function (props) {
|
|
|
5234
5235
|
if (props.onBlur)
|
|
5235
5236
|
props.onBlur(props.name);
|
|
5236
5237
|
};
|
|
5237
|
-
return (jsxs(Container$
|
|
5238
|
+
return (jsxs(Container$b, { children: [jsx$1(Label$5, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsx$1(Spacer, { vertical: 5 }), jsx$1(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 })] }));
|
|
5238
5239
|
};
|
|
5239
5240
|
|
|
5240
5241
|
var generateRandomString = function (length) {
|
|
@@ -5247,7 +5248,7 @@ var generateRandomString = function (length) {
|
|
|
5247
5248
|
return string;
|
|
5248
5249
|
};
|
|
5249
5250
|
|
|
5250
|
-
var PopupContainer = styled.div(templateObject_1$
|
|
5251
|
+
var PopupContainer = styled.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) {
|
|
5251
5252
|
var isVisible = _a.isVisible;
|
|
5252
5253
|
return (isVisible ? "100%" : "0%");
|
|
5253
5254
|
}, function (_a) {
|
|
@@ -5260,7 +5261,7 @@ var PopupContainer = styled.div(templateObject_1$j || (templateObject_1$j = __ma
|
|
|
5260
5261
|
var contrast = _a.contrast;
|
|
5261
5262
|
return contrast ? theme.colors.lightGray.light : theme.colors.lightGray.base;
|
|
5262
5263
|
});
|
|
5263
|
-
var templateObject_1$
|
|
5264
|
+
var templateObject_1$k;
|
|
5264
5265
|
|
|
5265
5266
|
var Popup = function (props) {
|
|
5266
5267
|
var popupRef = useRef(null);
|
|
@@ -5296,24 +5297,24 @@ var Popup = function (props) {
|
|
|
5296
5297
|
return (jsxs(Fragment$1, { children: [children, jsxs(PopupContainer, __assign$2({}, position, { isVisible: isVisible, ref: popupRef, contrast: props.contrast }, { children: [props.title && (jsxs(Fragment$1, { children: [jsx$1(Heading, __assign$2({ type: "h6" }, { children: props.title })), jsx$1(Spacer, { vertical: 10 })] })), jsx$1(Paragraph, __assign$2({ size: "small", weight: "regular" }, { children: props.content }))] }))] }));
|
|
5297
5298
|
};
|
|
5298
5299
|
|
|
5299
|
-
var Wrapper = styled.div(templateObject_1$
|
|
5300
|
-
var StyledProgressBar = styled.div(templateObject_2$
|
|
5300
|
+
var Wrapper = styled.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"])));
|
|
5301
|
+
var StyledProgressBar = styled.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) {
|
|
5301
5302
|
var showInfo = _a.showInfo;
|
|
5302
5303
|
return (showInfo ? "10px" : "");
|
|
5303
5304
|
});
|
|
5304
|
-
var Indicator$1 = styled.div(templateObject_3$
|
|
5305
|
+
var Indicator$1 = styled.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) {
|
|
5305
5306
|
var percent = _a.percent;
|
|
5306
5307
|
return "calc(".concat(percent, "% - 6px)");
|
|
5307
5308
|
}, function (_a) {
|
|
5308
5309
|
var color = _a.color;
|
|
5309
5310
|
return color ? theme.colors[color].base : theme.colors.green.base;
|
|
5310
5311
|
});
|
|
5311
|
-
var templateObject_1$
|
|
5312
|
+
var templateObject_1$j, templateObject_2$h, templateObject_3$7;
|
|
5312
5313
|
|
|
5313
5314
|
var ProgressBar = function (props) { return (jsxs(Wrapper, { children: [jsx$1(StyledProgressBar, __assign$2({}, props, { children: jsx$1(Indicator$1, __assign$2({}, props)) })), props.showInfo && (jsx$1(Paragraph, __assign$2({ size: "small" }, { children: props.info ? props.info : "".concat(props.percent, "%") })))] })); };
|
|
5314
5315
|
|
|
5315
|
-
var Container$
|
|
5316
|
-
var Step$1 = styled.li(templateObject_2$
|
|
5316
|
+
var Container$a = styled.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"])));
|
|
5317
|
+
var Step$1 = styled.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) {
|
|
5317
5318
|
var status = _a.status;
|
|
5318
5319
|
return (!!status ? "pointer" : "not-allowed");
|
|
5319
5320
|
}, function (_a) {
|
|
@@ -5335,9 +5336,9 @@ var Step$1 = styled.li(templateObject_2$f || (templateObject_2$f = __makeTemplat
|
|
|
5335
5336
|
var hasTitle = _a.hasTitle;
|
|
5336
5337
|
return (hasTitle ? "calc(50% - 12px)" : "50%");
|
|
5337
5338
|
}, theme.colors.lightGray.dark);
|
|
5338
|
-
var templateObject_1$
|
|
5339
|
+
var templateObject_1$i, templateObject_2$g;
|
|
5339
5340
|
|
|
5340
|
-
var Steps$2 = function (props) { return (jsx$1(Container$
|
|
5341
|
+
var Steps$2 = function (props) { return (jsx$1(Container$a, { children: props.steps.map(function (_a, index) {
|
|
5341
5342
|
var title = _a.title, onClick = _a.onClick;
|
|
5342
5343
|
var step = index + 1;
|
|
5343
5344
|
var status = props.current > step
|
|
@@ -5352,8 +5353,8 @@ var Steps$2 = function (props) { return (jsx$1(Container$9, { children: props.st
|
|
|
5352
5353
|
return (jsxs(Step$1, __assign$2({ status: status, hasTitle: !!title }, { children: [jsx$1("div", __assign$2({ onClick: onClickStep }, { children: status === "passed" ? (jsx$1(Icon, { type: "check", size: "small", color: "white" })) : (jsx$1(Heading, __assign$2({ type: "h6" }, { children: step }))) })), title && jsx$1(Paragraph, { children: title })] }), "".concat(title, "-").concat(step)));
|
|
5353
5354
|
}) })); };
|
|
5354
5355
|
|
|
5355
|
-
var Container$
|
|
5356
|
-
var Step = styled.li(templateObject_2$
|
|
5356
|
+
var Container$9 = styled.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"])));
|
|
5357
|
+
var Step = styled.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) {
|
|
5357
5358
|
var status = _a.status;
|
|
5358
5359
|
return (!!status ? "pointer" : "not-allowed");
|
|
5359
5360
|
}, function (_a) {
|
|
@@ -5372,9 +5373,9 @@ var Step = styled.li(templateObject_2$e || (templateObject_2$e = __makeTemplateO
|
|
|
5372
5373
|
? theme.colors.lightGray.light
|
|
5373
5374
|
: theme.colors.darkGray.light;
|
|
5374
5375
|
}, theme.colors.darkGray.base, theme.colors.lightGray.base);
|
|
5375
|
-
var templateObject_1$
|
|
5376
|
+
var templateObject_1$h, templateObject_2$f;
|
|
5376
5377
|
|
|
5377
|
-
var Steps$1 = function (props) { return (jsx$1(Container$
|
|
5378
|
+
var Steps$1 = function (props) { return (jsx$1(Container$9, { children: props.steps.map(function (_a, index) {
|
|
5378
5379
|
var title = _a.title, onClick = _a.onClick;
|
|
5379
5380
|
var step = index + 1;
|
|
5380
5381
|
var status = props.current > step
|
|
@@ -5393,15 +5394,15 @@ var Steps = function (props) {
|
|
|
5393
5394
|
return props.alignment === "vertical" ? (jsx$1(Steps$1, __assign$2({}, props))) : (jsx$1(Steps$2, __assign$2({}, props)));
|
|
5394
5395
|
};
|
|
5395
5396
|
|
|
5396
|
-
var TabsContainer$1 = styled.div(templateObject_1$
|
|
5397
|
-
var Tab$1 = styled.div(templateObject_2$
|
|
5397
|
+
var TabsContainer$1 = styled.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);
|
|
5398
|
+
var Tab$1 = styled.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) {
|
|
5398
5399
|
var isActive = _a.isActive;
|
|
5399
5400
|
return isActive ? "3px solid ".concat(theme.colors.blue.base) : "";
|
|
5400
5401
|
}, function (_a) {
|
|
5401
5402
|
var isActive = _a.isActive;
|
|
5402
5403
|
return isActive ? theme.colors.blue.base : "";
|
|
5403
5404
|
}, theme.colors.blue.base);
|
|
5404
|
-
var templateObject_1$
|
|
5405
|
+
var templateObject_1$g, templateObject_2$e;
|
|
5405
5406
|
|
|
5406
5407
|
var Tabs$2 = function (props) {
|
|
5407
5408
|
var _a = useState(props.items[0].key), activeTab = _a[0], setActiveTab = _a[1];
|
|
@@ -5416,15 +5417,15 @@ var Tabs$2 = function (props) {
|
|
|
5416
5417
|
}) }));
|
|
5417
5418
|
};
|
|
5418
5419
|
|
|
5419
|
-
var TabsContainer = styled.div(templateObject_1$
|
|
5420
|
-
var Tab = styled.div(templateObject_2$
|
|
5420
|
+
var TabsContainer = styled.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);
|
|
5421
|
+
var Tab = styled.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) {
|
|
5421
5422
|
var isActive = _a.isActive;
|
|
5422
5423
|
return (isActive ? "block" : "none");
|
|
5423
5424
|
}, theme.colors.blue.base, function (_a) {
|
|
5424
5425
|
var isActive = _a.isActive;
|
|
5425
5426
|
return isActive ? theme.colors.blue.base : "";
|
|
5426
5427
|
}, theme.colors.blue.base);
|
|
5427
|
-
var templateObject_1$
|
|
5428
|
+
var templateObject_1$f, templateObject_2$d;
|
|
5428
5429
|
|
|
5429
5430
|
var Tabs$1 = function (props) {
|
|
5430
5431
|
var _a = useState(props.items[0].key), activeTab = _a[0], setActiveTab = _a[1];
|
|
@@ -5443,14 +5444,14 @@ var Tabs = function (props) {
|
|
|
5443
5444
|
return props.alignment === "vertical" ? (jsx$1(Tabs$1, __assign$2({}, props))) : (jsx$1(Tabs$2, __assign$2({}, props)));
|
|
5444
5445
|
};
|
|
5445
5446
|
|
|
5446
|
-
var Fieldset = styled.fieldset(templateObject_1$
|
|
5447
|
-
var RadioContainer = styled.div(templateObject_2$
|
|
5448
|
-
var RadioWrapper = styled.div(templateObject_3$
|
|
5447
|
+
var Fieldset = styled.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"])));
|
|
5448
|
+
var RadioContainer = styled.div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
|
|
5449
|
+
var RadioWrapper = styled.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"])));
|
|
5449
5450
|
var Label$4 = styled(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) {
|
|
5450
5451
|
var weight = _a.weight;
|
|
5451
5452
|
return weight || 500;
|
|
5452
5453
|
}, theme.colors.darkGray.base);
|
|
5453
|
-
var templateObject_1$
|
|
5454
|
+
var templateObject_1$e, templateObject_2$c, templateObject_3$6, templateObject_4$4;
|
|
5454
5455
|
|
|
5455
5456
|
var RadioGroup = function (props) {
|
|
5456
5457
|
var onChange = function (value) {
|
|
@@ -5467,9 +5468,9 @@ var RadioGroup = function (props) {
|
|
|
5467
5468
|
}) })] }));
|
|
5468
5469
|
};
|
|
5469
5470
|
|
|
5470
|
-
var Container$
|
|
5471
|
-
var Label$3 = styled(StyledParagraph)(templateObject_2$
|
|
5472
|
-
var templateObject_1$
|
|
5471
|
+
var Container$8 = styled.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"])));
|
|
5472
|
+
var Label$3 = styled(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);
|
|
5473
|
+
var templateObject_1$d, templateObject_2$b;
|
|
5473
5474
|
|
|
5474
5475
|
var SelectField = function (props) {
|
|
5475
5476
|
var onChange = function (value) {
|
|
@@ -5480,15 +5481,15 @@ var SelectField = function (props) {
|
|
|
5480
5481
|
if (props.onBlur)
|
|
5481
5482
|
props.onBlur(props.name);
|
|
5482
5483
|
};
|
|
5483
|
-
return (jsxs(Container$
|
|
5484
|
+
return (jsxs(Container$8, { children: [jsx$1(Label$3, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsx$1(Spacer, { vertical: 5 }), jsx$1(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) {
|
|
5484
5485
|
var value = _a.value, label = _a.label;
|
|
5485
5486
|
return (jsx$1("option", __assign$2({ value: value }, { children: label }), "".concat(value, "-").concat(value)));
|
|
5486
5487
|
}) }))] }));
|
|
5487
5488
|
};
|
|
5488
5489
|
|
|
5489
|
-
var Container$
|
|
5490
|
-
var Label$2 = styled(StyledParagraph)(templateObject_2$
|
|
5491
|
-
var templateObject_1$
|
|
5490
|
+
var Container$7 = styled.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"])));
|
|
5491
|
+
var Label$2 = styled(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);
|
|
5492
|
+
var templateObject_1$c, templateObject_2$a;
|
|
5492
5493
|
|
|
5493
5494
|
var ToggleField = function (props) {
|
|
5494
5495
|
var onChange = function (value) {
|
|
@@ -5499,10 +5500,10 @@ var ToggleField = function (props) {
|
|
|
5499
5500
|
if (props.onBlur)
|
|
5500
5501
|
props.onBlur(props.name);
|
|
5501
5502
|
};
|
|
5502
|
-
return (jsxs(Container$
|
|
5503
|
+
return (jsxs(Container$7, { children: [jsx$1(Label$2, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsx$1(Spacer, { vertical: 5 }), jsx$1(Toggle, { id: props.name, name: props.name, disabled: props.disabled, autoFocus: props.autoFocus, defaultValue: props.defaultValue, onChange: onChange, onBlur: onBlur })] }));
|
|
5503
5504
|
};
|
|
5504
5505
|
|
|
5505
|
-
var TooltipContainer = styled.div(templateObject_1$
|
|
5506
|
+
var TooltipContainer = styled.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) {
|
|
5506
5507
|
var isVisible = _a.isVisible;
|
|
5507
5508
|
return (isVisible ? "100%" : "0%");
|
|
5508
5509
|
}, function (_a) {
|
|
@@ -5512,7 +5513,7 @@ var TooltipContainer = styled.div(templateObject_1$a || (templateObject_1$a = __
|
|
|
5512
5513
|
var x = _a.x;
|
|
5513
5514
|
return (x ? "".concat(x, "px") : "");
|
|
5514
5515
|
});
|
|
5515
|
-
var TooltipTitle = styled.div(templateObject_2$
|
|
5516
|
+
var TooltipTitle = styled.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) {
|
|
5516
5517
|
var color = _a.color;
|
|
5517
5518
|
switch (color) {
|
|
5518
5519
|
default:
|
|
@@ -5522,7 +5523,7 @@ var TooltipTitle = styled.div(templateObject_2$8 || (templateObject_2$8 = __make
|
|
|
5522
5523
|
return theme.colors.lightGray.dark;
|
|
5523
5524
|
}
|
|
5524
5525
|
});
|
|
5525
|
-
var templateObject_1$
|
|
5526
|
+
var templateObject_1$b, templateObject_2$9;
|
|
5526
5527
|
|
|
5527
5528
|
var Tooltip = function (props) {
|
|
5528
5529
|
var tooltipRef = useRef(null);
|
|
@@ -11374,7 +11375,7 @@ HTMLReactParser$1.htmlToDOM;
|
|
|
11374
11375
|
HTMLReactParser$1.attributesToProps;
|
|
11375
11376
|
HTMLReactParser$1.Element;
|
|
11376
11377
|
|
|
11377
|
-
var StyledTextarea = styled.textarea(templateObject_1$
|
|
11378
|
+
var StyledTextarea = styled.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) {
|
|
11378
11379
|
var disabled = _a.disabled;
|
|
11379
11380
|
return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
11380
11381
|
}, function (_a) {
|
|
@@ -11387,7 +11388,7 @@ var StyledTextarea = styled.textarea(templateObject_1$9 || (templateObject_1$9 =
|
|
|
11387
11388
|
var disabled = _a.disabled;
|
|
11388
11389
|
return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
|
|
11389
11390
|
}, 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));
|
|
11390
|
-
var templateObject_1$
|
|
11391
|
+
var templateObject_1$a;
|
|
11391
11392
|
|
|
11392
11393
|
var Textarea = function (props) {
|
|
11393
11394
|
var onChange = function (e) {
|
|
@@ -11397,9 +11398,9 @@ var Textarea = function (props) {
|
|
|
11397
11398
|
return jsx$1(StyledTextarea, __assign$2({}, props, { onChange: onChange }));
|
|
11398
11399
|
};
|
|
11399
11400
|
|
|
11400
|
-
var Container$
|
|
11401
|
-
var Label$1 = styled(StyledParagraph)(templateObject_2$
|
|
11402
|
-
var templateObject_1$
|
|
11401
|
+
var Container$6 = styled.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"])));
|
|
11402
|
+
var Label$1 = styled(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);
|
|
11403
|
+
var templateObject_1$9, templateObject_2$8;
|
|
11403
11404
|
|
|
11404
11405
|
var TextareaField = function (props) {
|
|
11405
11406
|
var onChange = function (value) {
|
|
@@ -11410,12 +11411,12 @@ var TextareaField = function (props) {
|
|
|
11410
11411
|
if (props.onBlur)
|
|
11411
11412
|
props.onBlur(props.name);
|
|
11412
11413
|
};
|
|
11413
|
-
return (jsxs(Container$
|
|
11414
|
+
return (jsxs(Container$6, { children: [jsx$1(Label$1, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsx$1(Spacer, { vertical: 5 }), jsx$1(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 && (jsxs("div", __assign$2({ style: { marginLeft: "5px" } }, { children: [jsx$1(Spacer, { vertical: 5 }), props.tips.map(function (tip, index) { return (jsxs(Paragraph, __assign$2({ size: "small", weight: "regular" }, { children: ["\u2022 ", tip] }), "".concat(tip, "-").concat(index))); })] })))] }));
|
|
11414
11415
|
};
|
|
11415
11416
|
|
|
11416
|
-
var Container$
|
|
11417
|
-
var Label = styled(StyledParagraph)(templateObject_2$
|
|
11418
|
-
var templateObject_1$
|
|
11417
|
+
var Container$5 = styled.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"])));
|
|
11418
|
+
var Label = styled(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);
|
|
11419
|
+
var templateObject_1$8, templateObject_2$7;
|
|
11419
11420
|
|
|
11420
11421
|
var RangeField = function (props) {
|
|
11421
11422
|
var onChange = function (value) {
|
|
@@ -11426,25 +11427,25 @@ var RangeField = function (props) {
|
|
|
11426
11427
|
if (props.onBlur)
|
|
11427
11428
|
props.onBlur(props.name);
|
|
11428
11429
|
};
|
|
11429
|
-
return (jsxs(Container$
|
|
11430
|
+
return (jsxs(Container$5, { children: [jsx$1(Label, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsx$1(Spacer, { vertical: 5 }), jsx$1(Range, { defaultValue: props.defaultValue, autoFocus: props.autoFocus, disabled: props.disabled, id: props.name, onChange: onChange, onBlur: onBlur })] }));
|
|
11430
11431
|
};
|
|
11431
11432
|
|
|
11432
11433
|
var FeedbackColors = {
|
|
11433
11434
|
success: theme.colors.green.base,
|
|
11434
11435
|
error: theme.colors.red.base,
|
|
11435
11436
|
};
|
|
11436
|
-
var FieldWrapper = styled.div(templateObject_1$
|
|
11437
|
+
var FieldWrapper = styled.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) {
|
|
11437
11438
|
var status = _a.status;
|
|
11438
11439
|
return FeedbackColors[status];
|
|
11439
11440
|
});
|
|
11440
|
-
var FeedbackWrapper = styled.div(templateObject_2$
|
|
11441
|
+
var FeedbackWrapper = styled.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) {
|
|
11441
11442
|
var status = _a.status;
|
|
11442
11443
|
return FeedbackColors[status];
|
|
11443
11444
|
}, function (_a) {
|
|
11444
11445
|
var status = _a.status;
|
|
11445
11446
|
return FeedbackColors[status];
|
|
11446
11447
|
});
|
|
11447
|
-
var templateObject_1$
|
|
11448
|
+
var templateObject_1$7, templateObject_2$6;
|
|
11448
11449
|
|
|
11449
11450
|
var WithValidation = function (_a) {
|
|
11450
11451
|
var status = _a.status, message = _a.message, children = _a.children;
|
|
@@ -11457,10 +11458,10 @@ var WithValidation = function (_a) {
|
|
|
11457
11458
|
return (jsxs(FieldWrapper, __assign$2({ status: status }, { children: [children, jsxs(FeedbackWrapper, __assign$2({ status: status }, { children: [jsx$1(Icon, { type: icons[status], size: "small" }), jsx$1(Paragraph, __assign$2({ size: "small" }, { children: message }))] }))] })));
|
|
11458
11459
|
};
|
|
11459
11460
|
|
|
11460
|
-
var FormWrapper = styled.form(templateObject_1$
|
|
11461
|
-
var DescriptionWrapper = styled.div(templateObject_2$
|
|
11462
|
-
var ButtonWrapper = styled.div(templateObject_3$
|
|
11463
|
-
var templateObject_1$
|
|
11461
|
+
var FormWrapper = styled.form(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject$1([""], [""])));
|
|
11462
|
+
var DescriptionWrapper = styled.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);
|
|
11463
|
+
var ButtonWrapper = styled.div(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject$1(["\n padding-top: 30px;\n"], ["\n padding-top: 30px;\n"])));
|
|
11464
|
+
var templateObject_1$6, templateObject_2$5, templateObject_3$5;
|
|
11464
11465
|
|
|
11465
11466
|
var Form = forwardRef(function (props, ref) {
|
|
11466
11467
|
var _a = useState({}), values = _a[0], setValues = _a[1];
|
|
@@ -11643,7 +11644,7 @@ var Form = forwardRef(function (props, ref) {
|
|
|
11643
11644
|
}) }), props.button && (jsx$1(ButtonWrapper, { children: jsx$1(Button, __assign$2({}, props.button, { onClick: onSubmit, type: "submit" })) }))] }));
|
|
11644
11645
|
});
|
|
11645
11646
|
|
|
11646
|
-
var Container$
|
|
11647
|
+
var Container$4 = styled.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) {
|
|
11647
11648
|
var color = _a.color, active = _a.active;
|
|
11648
11649
|
if (active)
|
|
11649
11650
|
return theme.colors[color].dark;
|
|
@@ -11667,20 +11668,20 @@ var Container$3 = styled.div(templateObject_1$4 || (templateObject_1$4 = __makeT
|
|
|
11667
11668
|
return theme.colors[color].base;
|
|
11668
11669
|
return "";
|
|
11669
11670
|
});
|
|
11670
|
-
var templateObject_1$
|
|
11671
|
+
var templateObject_1$5;
|
|
11671
11672
|
|
|
11672
11673
|
var Key = function (props) {
|
|
11673
11674
|
var _a;
|
|
11674
|
-
return (jsx$1(Container$
|
|
11675
|
+
return (jsx$1(Container$4, __assign$2({ color: props.color, active: props.active }, { children: props.color === "pink" ? (jsx$1("svg", __assign$2({ width: "28", height: "7", viewBox: "0 0 28 7" }, { children: jsx$1("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 (jsx$1(Heading, __assign$2({ type: "h6" }, { children: character }), "".concat(character, "-").concat(index))); })) })));
|
|
11675
11676
|
};
|
|
11676
11677
|
|
|
11677
|
-
var Container$
|
|
11678
|
-
var SpecialRow = styled.div(templateObject_2$
|
|
11679
|
-
var TopRow = styled.div(templateObject_3$
|
|
11678
|
+
var Container$3 = styled.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"])));
|
|
11679
|
+
var SpecialRow = styled.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"])));
|
|
11680
|
+
var TopRow = styled.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"])));
|
|
11680
11681
|
var StartRow = styled.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"])));
|
|
11681
11682
|
var BottomRow = styled.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"])));
|
|
11682
11683
|
var SpacebarRow = styled.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"])));
|
|
11683
|
-
var templateObject_1$
|
|
11684
|
+
var templateObject_1$4, templateObject_2$4, templateObject_3$4, templateObject_4$3, templateObject_5$2, templateObject_6$2;
|
|
11684
11685
|
|
|
11685
11686
|
var Keyboard = function (props) {
|
|
11686
11687
|
var _a = useState(), keys = _a[0], setKeys = _a[1];
|
|
@@ -11704,7 +11705,7 @@ var Keyboard = function (props) {
|
|
|
11704
11705
|
}, [props.keys]);
|
|
11705
11706
|
if (!keys)
|
|
11706
11707
|
return null;
|
|
11707
|
-
return (jsxs(Container$
|
|
11708
|
+
return (jsxs(Container$3, { children: [jsxs(SpecialRow, { children: [jsx$1(Key, {}), jsx$1(Key, { characters: [keys[44].character, keys[89].character], color: keys[44].color, active: keys[44].character === props.activeKey ||
|
|
11708
11709
|
keys[89].character === props.activeKey }, 44), jsx$1(Key, { characters: [keys[42].character, keys[87].character], color: keys[42].color, active: keys[42].character === props.activeKey ||
|
|
11709
11710
|
keys[87].character === props.activeKey }), jsx$1(Key, { characters: [keys[40].character, keys[85].character], color: keys[40].color, active: keys[40].character === props.activeKey ||
|
|
11710
11711
|
keys[85].character === props.activeKey }), jsx$1(Key, { characters: [keys[38].character, keys[83].character], color: keys[38].color, active: keys[38].character === props.activeKey ||
|
|
@@ -11752,8 +11753,8 @@ var Keyboard = function (props) {
|
|
|
11752
11753
|
keys[76].character === props.activeKey }), jsx$1(Key, { characters: ["Shift"], color: keys[31].color, active: shiftKeys.left.includes(props.activeKey) })] }), jsxs(SpacebarRow, { children: [jsx$1(Key, {}), jsx$1(Key, {}), jsx$1(Key, {}), jsx$1(Key, {}), jsx$1(Key, { color: keys[1].color, active: keys[1].character === props.activeKey }), jsx$1(Key, {}), jsx$1(Key, {}), jsx$1(Key, {}), jsx$1(Key, {})] })] }));
|
|
11753
11754
|
};
|
|
11754
11755
|
|
|
11755
|
-
var Mask = styled.div(templateObject_1$
|
|
11756
|
-
var CardWrapper = styled.div(templateObject_2$
|
|
11756
|
+
var Mask = styled.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"])));
|
|
11757
|
+
var CardWrapper = styled.div(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject$1(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
|
|
11757
11758
|
var width = _a.width;
|
|
11758
11759
|
if (!width)
|
|
11759
11760
|
return "720px";
|
|
@@ -11761,11 +11762,11 @@ var CardWrapper = styled.div(templateObject_2$2 || (templateObject_2$2 = __makeT
|
|
|
11761
11762
|
return "".concat(width, "px");
|
|
11762
11763
|
return width;
|
|
11763
11764
|
});
|
|
11764
|
-
var TitleWrapper = styled.div(templateObject_3$
|
|
11765
|
+
var TitleWrapper$1 = styled.div(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject$1(["\n margin: 0 25px 20px 0;\n"], ["\n margin: 0 25px 20px 0;\n"])));
|
|
11765
11766
|
var CloseIconWrapper = styled.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);
|
|
11766
11767
|
var ChildrenWrapper = styled.div(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject$1(["\n padding: 20px 35px;\n"], ["\n padding: 20px 35px;\n"])));
|
|
11767
11768
|
var FooterContainer = styled.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);
|
|
11768
|
-
var templateObject_1$
|
|
11769
|
+
var templateObject_1$3, templateObject_2$3, templateObject_3$3, templateObject_4$2, templateObject_5$1, templateObject_6$1;
|
|
11769
11770
|
|
|
11770
11771
|
var Modal = function (props) {
|
|
11771
11772
|
var _a = useState(props.isOpen), isOpen = _a[0], setIsOpen = _a[1];
|
|
@@ -11779,15 +11780,15 @@ var Modal = function (props) {
|
|
|
11779
11780
|
}, [isOpen]);
|
|
11780
11781
|
if (!isOpen)
|
|
11781
11782
|
return null;
|
|
11782
|
-
return (jsx$1(Mask, { children: jsx$1(CardWrapper, __assign$2({}, props, { children: jsxs(Card, { children: [isClosable && (jsx$1(CloseIconWrapper, { children: jsx$1(Icon, { type: "cross", onClick: function () { return setIsOpen(false); } }) })), jsxs(ChildrenWrapper, { children: [props.title && (jsx$1(TitleWrapper, { children: jsx$1(Heading, __assign$2({ type: "h2" }, { children: props.title })) })), props.children] }), !props.okButton && !props.closeButton ? null : (jsxs(FooterContainer, { children: [props.closeButton && (jsx$1(Button, { label: props.closeButton.label, onClick: props.closeButton.onClick, color: "white", size: "small" })), props.okButton && (jsx$1(Button, { label: props.okButton.label, onClick: props.okButton.onClick, size: "small" }))] }))] }) })) }));
|
|
11783
|
+
return (jsx$1(Mask, { children: jsx$1(CardWrapper, __assign$2({}, props, { children: jsxs(Card, { children: [isClosable && (jsx$1(CloseIconWrapper, { children: jsx$1(Icon, { type: "cross", onClick: function () { return setIsOpen(false); } }) })), jsxs(ChildrenWrapper, { children: [props.title && (jsx$1(TitleWrapper$1, { children: jsx$1(Heading, __assign$2({ type: "h2" }, { children: props.title })) })), props.children] }), !props.okButton && !props.closeButton ? null : (jsxs(FooterContainer, { children: [props.closeButton && (jsx$1(Button, { label: props.closeButton.label, onClick: props.closeButton.onClick, color: "white", size: "small" })), props.okButton && (jsx$1(Button, { label: props.okButton.label, onClick: props.okButton.onClick, size: "small" }))] }))] }) })) }));
|
|
11783
11784
|
};
|
|
11784
11785
|
|
|
11785
|
-
var Container$
|
|
11786
|
+
var Container$2 = styled.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) {
|
|
11786
11787
|
var passed = _a.passed;
|
|
11787
11788
|
return passed ? theme.colors.green.base : theme.colors.red.base;
|
|
11788
11789
|
}, theme.colors.lightGray.light);
|
|
11789
|
-
var ProgressBarWrapper = styled.div(templateObject_2$
|
|
11790
|
-
var Indicator = styled.div(templateObject_3$
|
|
11790
|
+
var ProgressBarWrapper = styled.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"])));
|
|
11791
|
+
var Indicator = styled.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) {
|
|
11791
11792
|
var value = _a.value;
|
|
11792
11793
|
return "".concat(value, "%");
|
|
11793
11794
|
});
|
|
@@ -11795,7 +11796,7 @@ var Target = styled.div(templateObject_4$1 || (templateObject_4$1 = __makeTempla
|
|
|
11795
11796
|
var value = _a.value, width = _a.width;
|
|
11796
11797
|
return "calc(".concat(value, "% - ").concat(width / 2, "px)");
|
|
11797
11798
|
}, theme.colors.blue.darker);
|
|
11798
|
-
var templateObject_1$
|
|
11799
|
+
var templateObject_1$2, templateObject_2$2, templateObject_3$2, templateObject_4$1;
|
|
11799
11800
|
|
|
11800
11801
|
var Result = function (props) {
|
|
11801
11802
|
var ref = useRef(null);
|
|
@@ -11805,12 +11806,12 @@ var Result = function (props) {
|
|
|
11805
11806
|
var _a;
|
|
11806
11807
|
setTargetWidth((_a = ref.current) === null || _a === void 0 ? void 0 : _a.offsetWidth);
|
|
11807
11808
|
}, [ref]);
|
|
11808
|
-
return (jsxs(Container$
|
|
11809
|
+
return (jsxs(Container$2, __assign$2({ passed: isPassed }, { children: [jsx$1(Icon, { type: isPassed ? "check" : "warning", color: isPassed ? "green" : "red", size: "large" }), jsx$1(Spacer, { horizontal: 15 }), jsxs("div", { children: [jsx$1(Heading, __assign$2({ type: "h5" }, { children: props.title })), jsx$1(Paragraph, { children: props.subtitle })] }), props.progressBar && (jsxs(ProgressBarWrapper, { children: [jsx$1(Indicator, { value: (props.target / props.progressBar.max) * 100 }), jsx$1(Target, __assign$2({ value: (props.target / props.progressBar.max) * 100, width: targetWidth, ref: ref }, { children: jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.target, props.progressBar.unit] })) })), jsx$1(ProgressBar, { percent: (props.value / props.progressBar.max) * 100, color: isPassed ? "green" : "red" }), jsxs("div", { children: [jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.progressBar.min, props.progressBar.unit] })), jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.progressBar.max, props.progressBar.unit] }))] })] }))] })));
|
|
11809
11810
|
};
|
|
11810
11811
|
|
|
11811
|
-
var Container = styled.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);
|
|
11812
|
-
var TableHead = styled.thead(templateObject_2 || (templateObject_2 = __makeTemplateObject$1([""], [""])));
|
|
11813
|
-
var TableBody = styled.tbody(templateObject_3 || (templateObject_3 = __makeTemplateObject$1([""], [""])));
|
|
11812
|
+
var Container$1 = styled.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);
|
|
11813
|
+
var TableHead = styled.thead(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject$1([""], [""])));
|
|
11814
|
+
var TableBody = styled.tbody(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject$1([""], [""])));
|
|
11814
11815
|
styled.tfoot(templateObject_4 || (templateObject_4 = __makeTemplateObject$1([""], [""])));
|
|
11815
11816
|
var ColumnTitle = styled.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"])));
|
|
11816
11817
|
var TableRow = styled.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);
|
|
@@ -11827,11 +11828,11 @@ var TableCell = styled.td(templateObject_7 || (templateObject_7 = __makeTemplate
|
|
|
11827
11828
|
}
|
|
11828
11829
|
});
|
|
11829
11830
|
var EmptyTableCell = styled.td(templateObject_8 || (templateObject_8 = __makeTemplateObject$1(["\n p {\n color: ", ";\n }\n"], ["\n p {\n color: ", ";\n }\n"])), theme.colors.lightGray.darker);
|
|
11830
|
-
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
|
|
11831
|
+
var templateObject_1$1, templateObject_2$1, templateObject_3$1, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
|
|
11831
11832
|
|
|
11832
11833
|
var Table = function (_a) {
|
|
11833
11834
|
var columns = _a.columns, data = _a.data, empytText = _a.empytText;
|
|
11834
|
-
return (jsxs(Container, { children: [jsx$1(TableHead, { children: jsx$1(TableRow, { children: columns.map(function (_a, index) {
|
|
11835
|
+
return (jsxs(Container$1, { children: [jsx$1(TableHead, { children: jsx$1(TableRow, { children: columns.map(function (_a, index) {
|
|
11835
11836
|
var title = _a.title, dataIndex = _a.dataIndex;
|
|
11836
11837
|
return (jsx$1(ColumnTitle, { children: title && (jsx$1(Heading, __assign$2({ type: "h6", as: "span" }, { children: title }))) }, "".concat(dataIndex, "-").concat(index)));
|
|
11837
11838
|
}) }) }), jsx$1(TableBody, { children: data.length === 0 ? (jsx$1(TableRow, { children: jsx$1(EmptyTableCell, __assign$2({ colSpan: columns.length }, { children: jsx$1(Paragraph, __assign$2({ align: "center", size: "small", weight: "regular" }, { children: empytText || "No data" })) })) })) : (data.map(function (row, index) {
|
|
@@ -11843,5 +11844,74 @@ var Table = function (_a) {
|
|
|
11843
11844
|
})) })] }));
|
|
11844
11845
|
};
|
|
11845
11846
|
|
|
11846
|
-
|
|
11847
|
+
var Container = styled.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"])));
|
|
11848
|
+
var TitleWrapper = styled.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);
|
|
11849
|
+
var CheckboxesWrapper = styled.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);
|
|
11850
|
+
var templateObject_1, templateObject_2, templateObject_3;
|
|
11851
|
+
|
|
11852
|
+
var Transfer = function (props) {
|
|
11853
|
+
var _a, _b;
|
|
11854
|
+
var _c = useState(props.targetKeys || []), targetKeys = _c[0], setTargetKeys = _c[1];
|
|
11855
|
+
var _d = useState([]), selectedSourceKeys = _d[0], setSelectedSourceKeys = _d[1];
|
|
11856
|
+
var _e = useState([]), selectedTargetKeys = _e[0], setSelectedTargetKeys = _e[1];
|
|
11857
|
+
var onChange = function (newTargetKeys) {
|
|
11858
|
+
setTargetKeys(newTargetKeys);
|
|
11859
|
+
setSelectedSourceKeys([]);
|
|
11860
|
+
setSelectedTargetKeys([]);
|
|
11861
|
+
if (!props.onChange)
|
|
11862
|
+
return;
|
|
11863
|
+
props.onChange(props.dataSource
|
|
11864
|
+
.filter(function (_a) {
|
|
11865
|
+
var key = _a.key;
|
|
11866
|
+
return newTargetKeys.includes(key);
|
|
11867
|
+
})
|
|
11868
|
+
.map(function (_a) {
|
|
11869
|
+
var key = _a.key;
|
|
11870
|
+
return key;
|
|
11871
|
+
}));
|
|
11872
|
+
};
|
|
11873
|
+
var transferRight = function () {
|
|
11874
|
+
var newTargetKeys = __spreadArray(__spreadArray([], targetKeys, true), selectedSourceKeys, true);
|
|
11875
|
+
onChange(newTargetKeys);
|
|
11876
|
+
};
|
|
11877
|
+
var transferLeft = function () {
|
|
11878
|
+
var newTargetKeys = targetKeys.filter(function (key) { return !selectedTargetKeys.includes(key); });
|
|
11879
|
+
onChange(newTargetKeys);
|
|
11880
|
+
};
|
|
11881
|
+
return (jsxs(Container, { children: [jsxs(Card, __assign$2({ bordered: true }, { children: [((_a = props.titles) === null || _a === void 0 ? void 0 : _a.length) >= 1 && (jsxs(TitleWrapper, { children: [jsxs(Paragraph, __assign$2({ weight: "regular" }, { children: [selectedSourceKeys.length > 0 && "".concat(selectedSourceKeys.length, "/"), props.dataSource.length - targetKeys.length] })), jsx$1(Heading, __assign$2({ type: "h6" }, { children: props.titles[0] }))] })), jsx$1(CheckboxesWrapper, { children: jsx$1(Checkboxes, { name: "source", legend: null, defaultValue: selectedSourceKeys, onChange: function (_, values) { return setSelectedSourceKeys(values); }, items: props.dataSource
|
|
11882
|
+
.filter(function (_a) {
|
|
11883
|
+
var key = _a.key;
|
|
11884
|
+
return !targetKeys.includes(key);
|
|
11885
|
+
})
|
|
11886
|
+
.map(function (_a) {
|
|
11887
|
+
var key = _a.key, title = _a.title;
|
|
11888
|
+
return ({
|
|
11889
|
+
id: key,
|
|
11890
|
+
value: key,
|
|
11891
|
+
label: title,
|
|
11892
|
+
});
|
|
11893
|
+
}) }) }, selectedSourceKeys)] })), jsxs("div", __assign$2({ style: {
|
|
11894
|
+
display: "flex",
|
|
11895
|
+
flexDirection: "column",
|
|
11896
|
+
gap: 10,
|
|
11897
|
+
position: "relative",
|
|
11898
|
+
top: 0,
|
|
11899
|
+
bottom: 0,
|
|
11900
|
+
margin: "auto 10px",
|
|
11901
|
+
} }, { children: [jsx$1(IconButton, { icon: "chevronRight", size: "small", onClick: transferRight }), jsx$1(IconButton, { icon: "chevronLeft", size: "small", onClick: transferLeft })] })), jsxs(Card, __assign$2({ bordered: true }, { children: [((_b = props.titles) === null || _b === void 0 ? void 0 : _b.length) >= 1 && (jsxs(TitleWrapper, { children: [jsxs(Paragraph, __assign$2({ weight: "regular" }, { children: [selectedTargetKeys.length > 0 && "".concat(selectedTargetKeys.length, "/"), targetKeys.length] })), jsx$1(Heading, __assign$2({ type: "h6" }, { children: props.titles[1] }))] })), jsx$1(CheckboxesWrapper, { children: jsx$1(Checkboxes, { name: "target", legend: null, defaultValue: selectedTargetKeys, onChange: function (_, values) { return setSelectedTargetKeys(values); }, items: props.dataSource
|
|
11902
|
+
.filter(function (_a) {
|
|
11903
|
+
var key = _a.key;
|
|
11904
|
+
return targetKeys.includes(key);
|
|
11905
|
+
})
|
|
11906
|
+
.map(function (_a) {
|
|
11907
|
+
var key = _a.key, title = _a.title;
|
|
11908
|
+
return ({
|
|
11909
|
+
id: key,
|
|
11910
|
+
value: key,
|
|
11911
|
+
label: title,
|
|
11912
|
+
});
|
|
11913
|
+
}) }) }, selectedTargetKeys)] }))] }));
|
|
11914
|
+
};
|
|
11915
|
+
|
|
11916
|
+
export { Alert, Button, Card, Checkbox, Checkboxes, Collapse, Countdown, DateInputField, Flag, Form, Heading, Icon, IconButton, Illustration, Input, InputField, Key$1 as Key, Keyboard, Link, Loading, LocaleSelect, Logo, Medal, Medals, Modal, Notification, Number$1 as Number, NumberField, Paragraph, PasswordInputField, Popup, ProgressBar, Radio, RadioGroup, Range, Result, Select, SelectField, Spacer, Steps, Subheading, Table, Tabs, Tag, Toggle, ToggleField, Tooltip, Transfer, Trophy, theme };
|
|
11847
11917
|
//# sourceMappingURL=index.es.js.map
|