@typeolymp/ui-components 2.2.7 → 2.2.9
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/organisms/Keyboard/ISANSI/index.d.ts +17 -0
- package/build/components/organisms/Keyboard/ISANSI/styles.d.ts +7 -0
- package/build/components/organisms/Keyboard/ISO/index.d.ts +17 -0
- package/build/components/organisms/Keyboard/ISO/styles.d.ts +7 -0
- package/build/components/organisms/Keyboard/index.d.ts +2 -1
- package/build/components/organisms/Keyboard/stories.d.ts +1 -0
- package/build/index.es.js +520 -296
- package/build/index.es.js.map +1 -1
- package/build/index.js +520 -296
- package/build/index.js.map +1 -1
- package/package.json +2 -2
package/build/index.es.js
CHANGED
|
@@ -3436,14 +3436,14 @@ Object.defineProperty(BeatLoader, "__esModule", { value: true });
|
|
|
3436
3436
|
var React$2 = __importStar$2(React__default);
|
|
3437
3437
|
var react_1 = require$$1;
|
|
3438
3438
|
var helpers_1 = helpers$1;
|
|
3439
|
-
var beat = react_1.keyframes(templateObject_1$
|
|
3439
|
+
var beat = react_1.keyframes(templateObject_1$X || (templateObject_1$X = __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"])));
|
|
3440
3440
|
var Loader = /** @class */ (function (_super) {
|
|
3441
3441
|
__extends$2(Loader, _super);
|
|
3442
3442
|
function Loader() {
|
|
3443
3443
|
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
3444
3444
|
_this.style = function (i) {
|
|
3445
3445
|
var _a = _this.props, color = _a.color, size = _a.size, margin = _a.margin, speedMultiplier = _a.speedMultiplier;
|
|
3446
|
-
return react_1.css(templateObject_2$
|
|
3446
|
+
return react_1.css(templateObject_2$D || (templateObject_2$D = __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");
|
|
3447
3447
|
};
|
|
3448
3448
|
return _this;
|
|
3449
3449
|
}
|
|
@@ -3458,9 +3458,9 @@ var Loader = /** @class */ (function (_super) {
|
|
|
3458
3458
|
return Loader;
|
|
3459
3459
|
}(React$2.PureComponent));
|
|
3460
3460
|
var _default$1 = BeatLoader.default = Loader;
|
|
3461
|
-
var templateObject_1$
|
|
3461
|
+
var templateObject_1$X, templateObject_2$D;
|
|
3462
3462
|
|
|
3463
|
-
var Wrapper$a = styled.div(templateObject_1$
|
|
3463
|
+
var Wrapper$a = styled.div(templateObject_1$W || (templateObject_1$W = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n\n :hover {\n cursor: ", ";\n fill: ", ";\n }\n }\n"], ["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n\n :hover {\n cursor: ", ";\n fill: ", ";\n }\n }\n"])), function (_a) {
|
|
3464
3464
|
var size = _a.size;
|
|
3465
3465
|
return theme.icon[size] || theme.icon.medium;
|
|
3466
3466
|
}, function (_a) {
|
|
@@ -3518,7 +3518,7 @@ var Wrapper$a = styled.div(templateObject_1$V || (templateObject_1$V = __makeTem
|
|
|
3518
3518
|
return theme.colors.lightGray.base;
|
|
3519
3519
|
}
|
|
3520
3520
|
});
|
|
3521
|
-
var templateObject_1$
|
|
3521
|
+
var templateObject_1$W;
|
|
3522
3522
|
|
|
3523
3523
|
var icons = {
|
|
3524
3524
|
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" })),
|
|
@@ -3571,7 +3571,7 @@ var icons = {
|
|
|
3571
3571
|
};
|
|
3572
3572
|
var Icon = function (props) { return (jsx$1(Wrapper$a, __assign$2({}, props, { children: jsx$1("svg", __assign$2({ viewBox: "0 0 24 24", fill: "none" }, { children: icons[props.type] })) }))); };
|
|
3573
3573
|
|
|
3574
|
-
var StyledButton = styled.button(templateObject_1$
|
|
3574
|
+
var StyledButton = styled.button(templateObject_1$V || (templateObject_1$V = __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 svg {\n pointer-events: none;\n }\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: ", ";\n background-color: ", ";\n }\n\n :active {\n position: relative;\n top: 3px;\n margin-bottom: 3px;\n box-shadow: none;\n height: ", "\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 svg {\n pointer-events: none;\n }\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: ", ";\n background-color: ", ";\n }\n\n :active {\n position: relative;\n top: 3px;\n margin-bottom: 3px;\n box-shadow: none;\n height: ", "\n"])), function (_a) {
|
|
3575
3575
|
var fluid = _a.fluid;
|
|
3576
3576
|
return (fluid ? "100%" : "fit-content");
|
|
3577
3577
|
}, function (_a) {
|
|
@@ -3626,27 +3626,27 @@ var StyledButton = styled.button(templateObject_1$U || (templateObject_1$U = __m
|
|
|
3626
3626
|
? "calc(".concat(theme.button.medium.height, " - 3px)")
|
|
3627
3627
|
: "calc(".concat(theme.button[size].height, " - 3px)");
|
|
3628
3628
|
});
|
|
3629
|
-
var DisabledButton = styled(StyledButton)(templateObject_2$
|
|
3629
|
+
var DisabledButton = styled(StyledButton)(templateObject_2$C || (templateObject_2$C = __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) {
|
|
3630
3630
|
var size = _a.size;
|
|
3631
3631
|
return !size ? theme.button.medium.height : theme.button[size].height;
|
|
3632
3632
|
});
|
|
3633
|
-
var LoaderWrapper = styled.div(templateObject_3$
|
|
3633
|
+
var LoaderWrapper = styled.div(templateObject_3$g || (templateObject_3$g = __makeTemplateObject$1(["\n width: ", ";\n margin-top: ", ";\n"], ["\n width: ", ";\n margin-top: ", ";\n"])), function (_a) {
|
|
3634
3634
|
var width = _a.width;
|
|
3635
3635
|
return "".concat(width, "px");
|
|
3636
3636
|
}, function (_a) {
|
|
3637
3637
|
var size = _a.size;
|
|
3638
3638
|
return (size === "small" ? "3px" : "");
|
|
3639
3639
|
});
|
|
3640
|
-
var templateObject_1$
|
|
3640
|
+
var templateObject_1$V, templateObject_2$C, templateObject_3$g;
|
|
3641
3641
|
|
|
3642
|
-
var StyledSpacer = styled.div(templateObject_1$
|
|
3642
|
+
var StyledSpacer = styled.div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject$1(["\n min-width: ", ";\n min-height: ", ";\n"], ["\n min-width: ", ";\n min-height: ", ";\n"])), function (_a) {
|
|
3643
3643
|
var horizontal = _a.horizontal;
|
|
3644
3644
|
return (horizontal ? "".concat(horizontal, "px") : "");
|
|
3645
3645
|
}, function (_a) {
|
|
3646
3646
|
var vertical = _a.vertical;
|
|
3647
3647
|
return (vertical ? "".concat(vertical, "px") : "");
|
|
3648
3648
|
});
|
|
3649
|
-
var templateObject_1$
|
|
3649
|
+
var templateObject_1$U;
|
|
3650
3650
|
|
|
3651
3651
|
var Spacer = function (props) { return (jsx$1(StyledSpacer, __assign$2({}, props))); };
|
|
3652
3652
|
|
|
@@ -3693,7 +3693,7 @@ var Button$1 = forwardRef(function (_a, ref) {
|
|
|
3693
3693
|
renderIcon({ color: color === "white" ? "gray" : "white" }), jsx$1("span", { children: label })] })) })));
|
|
3694
3694
|
});
|
|
3695
3695
|
|
|
3696
|
-
var StyledCheckbox = styled.div(templateObject_1$
|
|
3696
|
+
var StyledCheckbox = styled.div(templateObject_1$T || (templateObject_1$T = __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) {
|
|
3697
3697
|
var checked = _a.checked, disabled = _a.disabled;
|
|
3698
3698
|
if (disabled)
|
|
3699
3699
|
return theme.colors.lightGray.darker;
|
|
@@ -3714,7 +3714,7 @@ var StyledCheckbox = styled.div(templateObject_1$S || (templateObject_1$S = __ma
|
|
|
3714
3714
|
return theme.colors.green.base;
|
|
3715
3715
|
return theme.colors.lightGray.darker;
|
|
3716
3716
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
3717
|
-
var templateObject_1$
|
|
3717
|
+
var templateObject_1$T;
|
|
3718
3718
|
|
|
3719
3719
|
var Checkbox = function (props) {
|
|
3720
3720
|
var _a;
|
|
@@ -3823,6 +3823,20 @@ exports.Currency = void 0;
|
|
|
3823
3823
|
|
|
3824
3824
|
}(Currency));
|
|
3825
3825
|
|
|
3826
|
+
var Difficulty = {};
|
|
3827
|
+
|
|
3828
|
+
(function (exports) {
|
|
3829
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3830
|
+
exports.Difficulty = void 0;
|
|
3831
|
+
(function (Difficulty) {
|
|
3832
|
+
Difficulty["BEGINNER"] = "beginner";
|
|
3833
|
+
Difficulty["EASY"] = "easy";
|
|
3834
|
+
Difficulty["NORMAL"] = "normal";
|
|
3835
|
+
Difficulty["HARD"] = "hard";
|
|
3836
|
+
})(exports.Difficulty || (exports.Difficulty = {}));
|
|
3837
|
+
|
|
3838
|
+
}(Difficulty));
|
|
3839
|
+
|
|
3826
3840
|
var ExerciseType = {};
|
|
3827
3841
|
|
|
3828
3842
|
(function (exports) {
|
|
@@ -3890,12 +3904,24 @@ exports.KeyboardLayout = void 0;
|
|
|
3890
3904
|
KeyboardLayout["QWERTY_NL"] = "qwerty-nl";
|
|
3891
3905
|
KeyboardLayout["QWERTY_UK"] = "qwerty-uk";
|
|
3892
3906
|
KeyboardLayout["QWERTZ_DE"] = "qwertz-de";
|
|
3893
|
-
KeyboardLayout["TURKISH_Q"] = "turkish-q";
|
|
3894
3907
|
KeyboardLayout["TURKISH_F"] = "turkish-f";
|
|
3908
|
+
KeyboardLayout["TURKISH_Q"] = "turkish-q";
|
|
3895
3909
|
})(exports.KeyboardLayout || (exports.KeyboardLayout = {}));
|
|
3896
3910
|
|
|
3897
3911
|
}(KeyboardLayout));
|
|
3898
3912
|
|
|
3913
|
+
var KeyboardVariant = {};
|
|
3914
|
+
|
|
3915
|
+
(function (exports) {
|
|
3916
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3917
|
+
exports.KeyboardVariant = void 0;
|
|
3918
|
+
(function (KeyboardVariant) {
|
|
3919
|
+
KeyboardVariant["ISO"] = "ISO";
|
|
3920
|
+
KeyboardVariant["ISANSI"] = "ISANSI";
|
|
3921
|
+
})(exports.KeyboardVariant || (exports.KeyboardVariant = {}));
|
|
3922
|
+
|
|
3923
|
+
}(KeyboardVariant));
|
|
3924
|
+
|
|
3899
3925
|
var Locale = {};
|
|
3900
3926
|
|
|
3901
3927
|
(function (exports) {
|
|
@@ -4004,9 +4030,11 @@ __exportStar(AchievementType, exports);
|
|
|
4004
4030
|
__exportStar(Color$1, exports);
|
|
4005
4031
|
__exportStar(Country, exports);
|
|
4006
4032
|
__exportStar(Currency, exports);
|
|
4033
|
+
__exportStar(Difficulty, exports);
|
|
4007
4034
|
__exportStar(ExerciseType, exports);
|
|
4008
4035
|
__exportStar(HttpStatus, exports);
|
|
4009
4036
|
__exportStar(KeyboardLayout, exports);
|
|
4037
|
+
__exportStar(KeyboardVariant, exports);
|
|
4010
4038
|
__exportStar(Locale, exports);
|
|
4011
4039
|
__exportStar(Medal$1, exports);
|
|
4012
4040
|
__exportStar(NodeEnv, exports);
|
|
@@ -4016,7 +4044,7 @@ __exportStar(TextTopic, exports);
|
|
|
4016
4044
|
|
|
4017
4045
|
}(enums));
|
|
4018
4046
|
|
|
4019
|
-
var Wrapper$9 = styled.div(templateObject_1$
|
|
4047
|
+
var Wrapper$9 = styled.div(templateObject_1$S || (templateObject_1$S = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
|
|
4020
4048
|
var size = _a.size;
|
|
4021
4049
|
switch (size) {
|
|
4022
4050
|
case "small":
|
|
@@ -4039,7 +4067,7 @@ var Wrapper$9 = styled.div(templateObject_1$R || (templateObject_1$R = __makeTem
|
|
|
4039
4067
|
return "27px";
|
|
4040
4068
|
}
|
|
4041
4069
|
});
|
|
4042
|
-
var templateObject_1$
|
|
4070
|
+
var templateObject_1$S;
|
|
4043
4071
|
|
|
4044
4072
|
var _a$1;
|
|
4045
4073
|
var flags = (_a$1 = {},
|
|
@@ -4049,7 +4077,7 @@ var flags = (_a$1 = {},
|
|
|
4049
4077
|
_a$1);
|
|
4050
4078
|
var Flag = function (props) { return (jsx$1(Wrapper$9, __assign$2({}, props, { children: flags[props.locale] }))); };
|
|
4051
4079
|
|
|
4052
|
-
var StyledHeading = styled.span(templateObject_1$
|
|
4080
|
+
var StyledHeading = styled.span(templateObject_1$R || (templateObject_1$R = __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 text-decoration: ", ";\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 text-decoration: ", ";\n"])), theme.fonts.heading, function (_a) {
|
|
4053
4081
|
var type = _a.type;
|
|
4054
4082
|
return theme.heading[type].fontSize;
|
|
4055
4083
|
}, function (_a) {
|
|
@@ -4076,14 +4104,14 @@ var StyledHeading = styled.span(templateObject_1$Q || (templateObject_1$Q = __ma
|
|
|
4076
4104
|
var decoration = _a.decoration;
|
|
4077
4105
|
return decoration;
|
|
4078
4106
|
});
|
|
4079
|
-
var templateObject_1$
|
|
4107
|
+
var templateObject_1$R;
|
|
4080
4108
|
|
|
4081
4109
|
var Heading = function (props) {
|
|
4082
4110
|
var element = !!props.as ? props.as : props.type;
|
|
4083
4111
|
return (jsx$1(StyledHeading, __assign$2({}, props, { as: element }, { children: props.children })));
|
|
4084
4112
|
};
|
|
4085
4113
|
|
|
4086
|
-
var Wrapper$8 = styled.div(templateObject_1$
|
|
4114
|
+
var Wrapper$8 = styled.div(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject$1(["\n > svg {\n height: ", ";\n }\n"], ["\n > svg {\n height: ", ";\n }\n"])), function (_a) {
|
|
4087
4115
|
var size = _a.size;
|
|
4088
4116
|
switch (size) {
|
|
4089
4117
|
case "tiny":
|
|
@@ -4097,7 +4125,7 @@ var Wrapper$8 = styled.div(templateObject_1$P || (templateObject_1$P = __makeTem
|
|
|
4097
4125
|
return "118px";
|
|
4098
4126
|
}
|
|
4099
4127
|
});
|
|
4100
|
-
var templateObject_1$
|
|
4128
|
+
var templateObject_1$Q;
|
|
4101
4129
|
|
|
4102
4130
|
var illustrations = {
|
|
4103
4131
|
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" })] }))),
|
|
@@ -4121,7 +4149,7 @@ var illustrations = {
|
|
|
4121
4149
|
};
|
|
4122
4150
|
var Illustration = function (props) { return (jsx$1(Wrapper$8, __assign$2({}, props, { children: illustrations[props.type] }))); };
|
|
4123
4151
|
|
|
4124
|
-
var StyledParagraph = styled.p(templateObject_1$
|
|
4152
|
+
var StyledParagraph = styled.p(templateObject_1$P || (templateObject_1$P = __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 text-decoration: ", ";\n\n li:not(:last-child) {\n margin-bottom: 10px;\n }\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 text-decoration: ", ";\n\n li:not(:last-child) {\n margin-bottom: 10px;\n }\n"])), theme.fonts.paragraph, function (_a) {
|
|
4125
4153
|
var size = _a.size;
|
|
4126
4154
|
return size ? theme.paragraph[size].fontSize : theme.paragraph.medium.fontSize;
|
|
4127
4155
|
}, function (_a) {
|
|
@@ -4159,10 +4187,10 @@ var StyledParagraph = styled.p(templateObject_1$O || (templateObject_1$O = __mak
|
|
|
4159
4187
|
var decoration = _a.decoration;
|
|
4160
4188
|
return decoration;
|
|
4161
4189
|
});
|
|
4162
|
-
var templateObject_1$
|
|
4190
|
+
var templateObject_1$P;
|
|
4163
4191
|
|
|
4164
|
-
var Container$
|
|
4165
|
-
var InputIconWrapper = styled.div(templateObject_2$
|
|
4192
|
+
var Container$p = styled.div(templateObject_1$O || (templateObject_1$O = __makeTemplateObject$1(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
4193
|
+
var InputIconWrapper = styled.div(templateObject_2$B || (templateObject_2$B = __makeTemplateObject$1(["\n position: relative;\n width: 100%;\n\n input {\n padding-right: ", ";\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: ", ";\n top: ", ";\n }\n\n svg {\n cursor: ", ";\n width: ", ";\n }\n"], ["\n position: relative;\n width: 100%;\n\n input {\n padding-right: ", ";\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: ", ";\n top: ", ";\n }\n\n svg {\n cursor: ", ";\n width: ", ";\n }\n"])), function (_a) {
|
|
4166
4194
|
var size = _a.size;
|
|
4167
4195
|
switch (size) {
|
|
4168
4196
|
case "small":
|
|
@@ -4205,7 +4233,7 @@ var InputIconWrapper = styled.div(templateObject_2$A || (templateObject_2$A = __
|
|
|
4205
4233
|
return "24px";
|
|
4206
4234
|
}
|
|
4207
4235
|
});
|
|
4208
|
-
var StyledInput = styled.input(templateObject_3$
|
|
4236
|
+
var StyledInput = styled.input(templateObject_3$f || (templateObject_3$f = __makeTemplateObject$1(["\n width: 100%;\n min-width: 228px;\n height: ", ";\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: ", ";\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) {
|
|
4209
4237
|
var size = _a.size;
|
|
4210
4238
|
switch (size) {
|
|
4211
4239
|
case "small":
|
|
@@ -4227,13 +4255,13 @@ var StyledInput = styled.input(templateObject_3$e || (templateObject_3$e = __mak
|
|
|
4227
4255
|
var disabled = _a.disabled;
|
|
4228
4256
|
return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
|
|
4229
4257
|
}, 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));
|
|
4230
|
-
var HelperContainer = styled.div(templateObject_4$
|
|
4231
|
-
var fadeIn = keyframes$1(templateObject_5$
|
|
4232
|
-
var Helper = styled(StyledParagraph)(templateObject_6$
|
|
4258
|
+
var HelperContainer = styled.div(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject$1(["\n margin-top: 5px;\n padding-left: 5px;\n"], ["\n margin-top: 5px;\n padding-left: 5px;\n"])));
|
|
4259
|
+
var fadeIn = keyframes$1(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject$1(["\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n"], ["\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n"])));
|
|
4260
|
+
var Helper = styled(StyledParagraph)(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject$1(["\n font-weight: 400;\n font-size: 14px;\n color: ", ";\n animation: ", " 0.3s linear;\n"], ["\n font-weight: 400;\n font-size: 14px;\n color: ", ";\n animation: ", " 0.3s linear;\n"])), function (_a) {
|
|
4233
4261
|
var isOk = _a.isOk;
|
|
4234
4262
|
return isOk ? theme.colors.green.base : theme.colors.darkGray.light;
|
|
4235
4263
|
}, fadeIn);
|
|
4236
|
-
var templateObject_1$
|
|
4264
|
+
var templateObject_1$O, templateObject_2$B, templateObject_3$f, templateObject_4$7, templateObject_5$4, templateObject_6$4;
|
|
4237
4265
|
|
|
4238
4266
|
var expressions = {};
|
|
4239
4267
|
|
|
@@ -4439,7 +4467,7 @@ var PasswordInput = function (props) {
|
|
|
4439
4467
|
if (props.onKeyPress)
|
|
4440
4468
|
props.onKeyPress(e);
|
|
4441
4469
|
};
|
|
4442
|
-
return (jsxs(Container$
|
|
4470
|
+
return (jsxs(Container$p, { children: [jsxs(InputIconWrapper, __assign$2({ disabled: props.disabled, size: props.size }, { 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]["At least 1 capital letter"]] })), jsxs(Helper, __assign$2({ isOk: expressions.hasNumber(value) }, { children: ["\u2022 ", translations[props.helperLocale]["At least 1 number"]] })), jsxs(Helper, __assign$2({ isOk: expressions.hasSpecialCharacter(value) }, { children: ["\u2022 ", translations[props.helperLocale]["At least 1 special character"]] })), jsxs(Helper, __assign$2({ isOk: value.length >= 8 }, { children: ["\u2022 ", translations[props.helperLocale]["At least 8 characters"]] }))] })) : null] }));
|
|
4443
4471
|
};
|
|
4444
4472
|
|
|
4445
4473
|
function toInteger$2(dirtyNumber) {
|
|
@@ -7941,7 +7969,7 @@ var SearchInput = function (props) {
|
|
|
7941
7969
|
if (value.length <= 0)
|
|
7942
7970
|
onSearch();
|
|
7943
7971
|
};
|
|
7944
|
-
return (jsx$1(Container$
|
|
7972
|
+
return (jsx$1(Container$p, { children: jsxs(InputIconWrapper, __assign$2({ disabled: props.disabled, size: props.size }, { children: [jsx$1(Icon, { type: "search", color: "gray", size: "small", onClick: onSearch }), jsx$1(StyledInput, __assign$2({ type: "text" }, rest, { onChange: onChange, onKeyPress: onKeyPress, onBlur: onBlur }))] })) }));
|
|
7945
7973
|
};
|
|
7946
7974
|
|
|
7947
7975
|
var Input = function (props) {
|
|
@@ -7959,7 +7987,7 @@ var Logo = function (props) {
|
|
|
7959
7987
|
return props.iconOnly ? (jsxs("svg", __assign$2({ width: "89", height: "66", viewBox: "0 0 89 66", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsx$1("path", { d: "M35.2229 13.1329C34.9994 12.8535 34.72 12.5182 34.4964 12.2947L31.7581 9.61219L24.2695 2.23539C23.543 1.50889 22.7047 0.950042 21.7547 0.558848C20.8046 0.167655 19.7987 0 18.7928 0C17.7868 0 16.7809 0.223539 15.8309 0.558848C14.8808 0.950042 14.0426 1.50889 13.3161 2.23539L3.08913 12.2947C1.63612 13.7477 0.797852 15.6478 0.797852 17.7155C0.797852 19.7274 1.63612 21.6833 3.08913 23.1363L13.3161 33.1956C14.7691 34.6486 16.7809 35.431 18.7928 35.431C20.8605 35.431 22.8165 34.6486 24.2695 33.1956L31.7581 25.8188L29.0197 23.1363C28.7403 22.8569 28.5167 22.5775 28.2932 22.2981L20.7487 29.6749C20.4693 29.9543 20.1899 30.1219 19.8546 30.2896C19.5193 30.4014 19.1281 30.5131 18.7928 30.5131C18.4016 30.5131 18.0663 30.4572 17.731 30.2896C17.3956 30.1778 17.0603 29.9543 16.8368 29.6749L6.60988 19.6156C6.10691 19.1126 5.7716 18.3861 5.7716 17.6596C5.7716 16.9331 6.05103 16.2625 6.60988 15.7036L16.8368 5.64437C17.1162 5.36495 17.3956 5.19729 17.731 5.02964C18.0663 4.91787 18.4575 4.8061 18.7928 4.8061C19.184 4.8061 19.5193 4.86198 19.8546 5.02964C20.1899 5.14141 20.5252 5.36495 20.7487 5.64437L28.2932 13.0771L30.9757 15.7036C31.2551 15.9272 31.4227 16.2625 31.5904 16.5978C31.7022 16.9331 31.8139 17.2684 31.8139 17.6596V17.7155C31.8139 18.442 32.0934 19.1126 32.6522 19.6156L35.3347 22.2422C36.3406 20.9009 36.8436 19.3362 36.8436 17.7155C36.7877 16.039 36.2288 14.4742 35.2229 13.1329Z", fill: "#E62743" }), jsx$1("path", { d: "M86.4691 12.2947L76.2421 2.23539C75.5156 1.50889 74.6774 0.950042 73.7273 0.558848C72.7773 0.167655 71.7714 0 70.7654 0C69.7595 0 68.7536 0.223539 67.8035 0.558848C66.8535 0.950042 66.0152 1.50889 65.2887 2.23539L57.8001 9.61219L55.0618 12.2947C54.7824 12.5741 54.5588 12.8535 54.3353 13.1329C53.3294 14.4742 52.7705 16.039 52.7705 17.7155C52.7705 19.3362 53.3294 20.9568 54.2794 22.2422L56.9619 19.6156C57.4648 19.1126 57.7443 18.442 57.8001 17.7155C57.8001 17.3802 57.856 16.989 58.0237 16.6537C58.1355 16.3184 58.359 16.039 58.6384 15.7595L61.3209 13.1329L68.8653 5.70025C69.1448 5.42083 69.4242 5.25318 69.7595 5.08552C70.0948 4.97375 70.4301 4.86198 70.8213 4.86198C71.2125 4.86198 71.5478 4.91787 71.8831 5.08552C72.2184 5.19729 72.4979 5.42083 72.7773 5.70025L83.0042 15.7595C83.2836 16.039 83.4513 16.3184 83.6189 16.6537C83.7866 16.989 83.8425 17.3243 83.8425 17.7155C83.8425 18.0508 83.7866 18.442 83.6189 18.7773C83.4513 19.1126 83.2836 19.392 83.0042 19.6715L72.7773 29.7307C72.4979 30.0102 72.2184 30.1778 71.8831 30.3455C71.5478 30.4572 71.2125 30.569 70.8213 30.569C70.4301 30.569 70.0948 30.5131 69.7595 30.3455C69.4242 30.2337 69.1448 30.0102 68.8653 29.7307L61.3209 22.2981C61.0974 22.5775 60.8738 22.9128 60.5944 23.1363L57.856 25.8188L65.3446 33.1956C66.0711 33.9221 66.9094 34.4809 67.8594 34.8721C68.8095 35.2633 69.8154 35.431 70.8213 35.431C71.8272 35.431 72.8332 35.2075 73.7832 34.8721C74.7333 34.4809 75.5715 33.9221 76.298 33.1956L86.525 23.1363C87.2515 22.4098 87.8103 21.5716 88.2015 20.6215C88.5927 19.6715 88.8162 18.6655 88.8162 17.6596C88.8162 16.6537 88.5927 15.6478 88.2015 14.6977C87.7544 13.8594 87.1956 13.0212 86.4691 12.2947Z", fill: "#53B476" }), jsx$1("path", { d: "M35.3904 13.0212L35.2228 13.1888C34.9993 12.9094 34.7198 12.5741 34.4963 12.3506L31.7579 9.66808L39.2465 2.23539C39.973 1.50889 40.8113 0.950042 41.7613 0.558848C42.7114 0.167655 43.7173 0 44.7232 0C45.7291 0 46.7351 0.223539 47.6851 0.558848C48.6352 0.950042 49.4734 1.50889 50.1999 2.23539L57.6885 9.55631L55.0619 12.2947C54.7825 12.5741 54.5589 12.8535 54.3354 13.1329L46.7351 5.70025C46.4556 5.42083 46.1762 5.25318 45.8409 5.08552C45.5056 4.97375 45.1144 4.86198 44.7791 4.86198C44.3879 4.86198 44.0526 4.91787 43.7173 5.08552C43.382 5.19729 43.0467 5.42083 42.8231 5.70025L35.3904 13.0212ZM58.5827 15.7595L61.2651 13.1329C62.2711 14.4742 62.774 16.039 62.774 17.7155C62.774 19.3362 62.2152 20.9568 61.2651 22.2981C61.0416 22.5775 60.8181 22.9128 60.5386 23.1363L57.8003 25.8188L50.2558 33.1956C48.8028 34.6486 46.791 35.431 44.7791 35.431C42.7672 35.431 40.7554 34.6486 39.3024 33.1956L31.7579 25.7629L29.0196 23.0804C28.7401 22.801 28.5166 22.5216 28.2931 22.2422C27.2871 20.9009 26.7842 19.3362 26.7842 17.7155C26.7842 16.0948 27.343 14.4742 28.2931 13.1888L30.9755 15.8154C31.255 16.0389 31.4226 16.3743 31.5903 16.7096C31.702 17.0449 31.8138 17.3802 31.8138 17.7714V17.8273C31.8138 18.5538 32.0932 19.2244 32.6521 19.7273L35.3346 22.3539L42.879 29.7866C43.1584 30.066 43.4379 30.2337 43.7732 30.4014C44.1085 30.569 44.4997 30.6249 44.835 30.6249C45.1703 30.6249 45.5615 30.569 45.8968 30.4014C46.2321 30.2337 46.5674 30.066 46.791 29.7866L54.3354 22.3539L57.0179 19.7273C57.5208 19.2244 57.8003 18.5538 57.8562 17.8273C57.8562 17.492 57.912 17.1008 58.0797 16.7655C58.0797 16.3184 58.3032 16.039 58.5827 15.7595Z", fill: "#FFD800" }), jsx$1("path", { d: "M73.4483 42.8078L63.2214 32.7485C61.7684 31.2955 59.7566 30.5131 57.7447 30.5131C55.677 30.5131 53.721 31.2955 52.268 32.7485L44.7794 40.1812L42.0411 42.8637C41.7616 43.1431 41.5381 43.4225 41.3146 43.7019C40.3086 45.0432 39.8057 46.608 39.8057 48.2286C39.8057 49.8493 40.3645 51.4699 41.3146 52.7553L43.997 50.1287C44.5 49.6257 44.7794 48.9551 44.8353 48.2286C44.8353 47.5021 45.1147 46.8315 45.6736 46.3285L48.356 43.7019L55.9005 36.2693C56.4035 35.7663 57.13 35.4869 57.8565 35.4869C58.583 35.4869 59.3095 35.7663 59.8124 36.2693L70.0394 46.3285C70.5423 46.8315 70.8776 47.558 70.8776 48.2845C70.8776 49.011 70.5982 49.6816 70.0394 50.2405L59.8124 60.2997C59.3095 60.8027 58.583 61.0821 57.8565 61.0821C57.13 61.0821 56.4035 60.8027 55.9005 60.2997L48.2443 52.8112C48.0207 53.1465 47.7972 53.4259 47.5178 53.6494L44.7794 56.3319L52.268 63.7087C53.721 65.1617 55.7328 65.9441 57.7447 65.9441C59.8124 65.9441 61.7684 65.1617 63.2214 63.7087L73.4483 53.6494C74.1748 52.9229 74.7337 52.0847 75.1249 51.1346C75.5161 50.1846 75.7396 49.1787 75.7396 48.1727C75.7396 47.1668 75.5161 46.1609 75.1249 45.2108C74.7896 44.3726 74.1748 43.5343 73.4483 42.8078Z", fill: "#8C5CA2" }), jsx$1("path", { d: "M48.2436 43.7019L45.5612 46.3285C45.0582 46.8315 44.7788 47.5021 44.7229 48.2286C44.7229 48.9551 44.4435 49.6257 43.8846 50.1287L41.2022 52.7553L33.6577 60.188C33.1547 60.6909 32.4282 60.9704 31.7017 60.9704C30.9752 60.9704 30.2487 60.6909 29.7458 60.188L19.5188 50.1287C19.0159 49.6257 18.7364 48.8992 18.7364 48.1727C18.7364 47.4462 19.0159 46.7756 19.5188 46.2168L29.7458 36.1575C30.2487 35.6545 30.9752 35.3751 31.7017 35.3751C32.4282 35.3751 33.1547 35.6545 33.6577 36.1575L41.2022 43.5902C41.4257 43.3107 41.6492 42.9754 41.9287 42.7519L44.667 40.0694L37.2343 32.8044C35.7813 31.3514 33.7695 30.569 31.7576 30.569C29.6899 30.569 27.7339 31.3514 26.2809 32.8044L16.054 42.8637C14.601 44.3167 13.7627 46.2726 13.7627 48.2845C13.7627 50.2964 14.601 52.2523 16.054 53.7053L26.2809 63.7646C27.7339 65.2176 29.7458 66 31.7576 66C33.8254 66 35.7813 65.2176 37.2343 63.7646L44.7229 56.3878L47.4613 53.7053C47.7407 53.4259 47.9642 53.1465 48.1878 52.8671C49.1937 51.5258 49.6967 49.961 49.6967 48.3404C49.7525 46.608 49.1937 45.0432 48.2436 43.7019Z", fill: "#3DA9E1" })] }))) : (jsxs("svg", __assign$2({ width: "372", height: "66", viewBox: "0 0 372 66", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, { children: [jsx$1("path", { d: "M35.2229 13.1329C34.9994 12.8535 34.72 12.5182 34.4964 12.2947L31.7581 9.61219L24.2695 2.23539C23.543 1.50889 22.7047 0.950042 21.7547 0.558848C20.8046 0.167655 19.7987 0 18.7928 0C17.7868 0 16.7809 0.223539 15.8309 0.558848C14.8808 0.950042 14.0426 1.50889 13.3161 2.23539L3.08913 12.2947C1.63612 13.7477 0.797852 15.6478 0.797852 17.7155C0.797852 19.7274 1.63612 21.6833 3.08913 23.1363L13.3161 33.1956C14.7691 34.6486 16.7809 35.431 18.7928 35.431C20.8605 35.431 22.8165 34.6486 24.2695 33.1956L31.7581 25.8188L29.0197 23.1363C28.7403 22.8569 28.5167 22.5775 28.2932 22.2981L20.7487 29.6749C20.4693 29.9543 20.1899 30.1219 19.8546 30.2896C19.5193 30.4014 19.1281 30.5131 18.7928 30.5131C18.4016 30.5131 18.0663 30.4572 17.731 30.2896C17.3956 30.1778 17.0603 29.9543 16.8368 29.6749L6.60988 19.6156C6.10691 19.1126 5.7716 18.3861 5.7716 17.6596C5.7716 16.9331 6.05103 16.2625 6.60988 15.7036L16.8368 5.64437C17.1162 5.36495 17.3956 5.19729 17.731 5.02964C18.0663 4.91787 18.4575 4.8061 18.7928 4.8061C19.184 4.8061 19.5193 4.86198 19.8546 5.02964C20.1899 5.14141 20.5252 5.36495 20.7487 5.64437L28.2932 13.0771L30.9757 15.7036C31.2551 15.9272 31.4227 16.2625 31.5904 16.5978C31.7022 16.9331 31.8139 17.2684 31.8139 17.6596V17.7155C31.8139 18.442 32.0934 19.1126 32.6522 19.6156L35.3347 22.2422C36.3406 20.9009 36.8436 19.3362 36.8436 17.7155C36.7877 16.039 36.2288 14.4742 35.2229 13.1329Z", fill: "#E62743" }), jsx$1("path", { d: "M86.4691 12.2947L76.2421 2.23539C75.5156 1.50889 74.6774 0.950042 73.7273 0.558848C72.7773 0.167655 71.7714 0 70.7654 0C69.7595 0 68.7536 0.223539 67.8035 0.558848C66.8535 0.950042 66.0152 1.50889 65.2887 2.23539L57.8001 9.61219L55.0618 12.2947C54.7824 12.5741 54.5588 12.8535 54.3353 13.1329C53.3294 14.4742 52.7705 16.039 52.7705 17.7155C52.7705 19.3362 53.3294 20.9568 54.2794 22.2422L56.9619 19.6156C57.4648 19.1126 57.7443 18.442 57.8001 17.7155C57.8001 17.3802 57.856 16.989 58.0237 16.6537C58.1355 16.3184 58.359 16.039 58.6384 15.7595L61.3209 13.1329L68.8653 5.70025C69.1448 5.42083 69.4242 5.25318 69.7595 5.08552C70.0948 4.97375 70.4301 4.86198 70.8213 4.86198C71.2125 4.86198 71.5478 4.91787 71.8831 5.08552C72.2184 5.19729 72.4979 5.42083 72.7773 5.70025L83.0042 15.7595C83.2836 16.039 83.4513 16.3184 83.6189 16.6537C83.7866 16.989 83.8425 17.3243 83.8425 17.7155C83.8425 18.0508 83.7866 18.442 83.6189 18.7773C83.4513 19.1126 83.2836 19.392 83.0042 19.6715L72.7773 29.7307C72.4979 30.0102 72.2184 30.1778 71.8831 30.3455C71.5478 30.4572 71.2125 30.569 70.8213 30.569C70.4301 30.569 70.0948 30.5131 69.7595 30.3455C69.4242 30.2337 69.1448 30.0102 68.8653 29.7307L61.3209 22.2981C61.0974 22.5775 60.8738 22.9128 60.5944 23.1363L57.856 25.8188L65.3446 33.1956C66.0711 33.9221 66.9094 34.4809 67.8594 34.8721C68.8095 35.2633 69.8154 35.431 70.8213 35.431C71.8272 35.431 72.8332 35.2075 73.7832 34.8721C74.7333 34.4809 75.5715 33.9221 76.298 33.1956L86.525 23.1363C87.2515 22.4098 87.8103 21.5716 88.2015 20.6215C88.5927 19.6715 88.8162 18.6655 88.8162 17.6596C88.8162 16.6537 88.5927 15.6478 88.2015 14.6977C87.7544 13.8594 87.1956 13.0212 86.4691 12.2947Z", fill: "#53B476" }), jsx$1("path", { d: "M35.3904 13.0212L35.2228 13.1888C34.9993 12.9094 34.7198 12.5741 34.4963 12.3506L31.7579 9.66808L39.2465 2.23539C39.973 1.50889 40.8113 0.950042 41.7613 0.558848C42.7114 0.167655 43.7173 0 44.7232 0C45.7291 0 46.7351 0.223539 47.6851 0.558848C48.6352 0.950042 49.4734 1.50889 50.1999 2.23539L57.6885 9.55631L55.0619 12.2947C54.7825 12.5741 54.5589 12.8535 54.3354 13.1329L46.7351 5.70025C46.4556 5.42083 46.1762 5.25318 45.8409 5.08552C45.5056 4.97375 45.1144 4.86198 44.7791 4.86198C44.3879 4.86198 44.0526 4.91787 43.7173 5.08552C43.382 5.19729 43.0467 5.42083 42.8231 5.70025L35.3904 13.0212ZM58.5827 15.7595L61.2651 13.1329C62.2711 14.4742 62.774 16.039 62.774 17.7155C62.774 19.3362 62.2152 20.9568 61.2651 22.2981C61.0416 22.5775 60.8181 22.9128 60.5386 23.1363L57.8003 25.8188L50.2558 33.1956C48.8028 34.6486 46.791 35.431 44.7791 35.431C42.7672 35.431 40.7554 34.6486 39.3024 33.1956L31.7579 25.7629L29.0196 23.0804C28.7401 22.801 28.5166 22.5216 28.2931 22.2422C27.2871 20.9009 26.7842 19.3362 26.7842 17.7155C26.7842 16.0948 27.343 14.4742 28.2931 13.1888L30.9755 15.8154C31.255 16.0389 31.4226 16.3743 31.5903 16.7096C31.702 17.0449 31.8138 17.3802 31.8138 17.7714V17.8273C31.8138 18.5538 32.0932 19.2244 32.6521 19.7273L35.3346 22.3539L42.879 29.7866C43.1584 30.066 43.4379 30.2337 43.7732 30.4014C44.1085 30.569 44.4997 30.6249 44.835 30.6249C45.1703 30.6249 45.5615 30.569 45.8968 30.4014C46.2321 30.2337 46.5674 30.066 46.791 29.7866L54.3354 22.3539L57.0179 19.7273C57.5208 19.2244 57.8003 18.5538 57.8562 17.8273C57.8562 17.492 57.912 17.1008 58.0797 16.7655C58.0797 16.3184 58.3032 16.039 58.5827 15.7595Z", fill: "#FFD800" }), jsx$1("path", { d: "M73.4483 42.8078L63.2214 32.7485C61.7684 31.2955 59.7566 30.5131 57.7447 30.5131C55.677 30.5131 53.721 31.2955 52.268 32.7485L44.7794 40.1812L42.0411 42.8637C41.7616 43.1431 41.5381 43.4225 41.3146 43.7019C40.3086 45.0432 39.8057 46.608 39.8057 48.2286C39.8057 49.8493 40.3645 51.4699 41.3146 52.7553L43.997 50.1287C44.5 49.6257 44.7794 48.9551 44.8353 48.2286C44.8353 47.5021 45.1147 46.8315 45.6736 46.3285L48.356 43.7019L55.9005 36.2693C56.4035 35.7663 57.13 35.4869 57.8565 35.4869C58.583 35.4869 59.3095 35.7663 59.8124 36.2693L70.0394 46.3285C70.5423 46.8315 70.8776 47.558 70.8776 48.2845C70.8776 49.011 70.5982 49.6816 70.0394 50.2405L59.8124 60.2997C59.3095 60.8027 58.583 61.0821 57.8565 61.0821C57.13 61.0821 56.4035 60.8027 55.9005 60.2997L48.2443 52.8112C48.0207 53.1465 47.7972 53.4259 47.5178 53.6494L44.7794 56.3319L52.268 63.7087C53.721 65.1617 55.7328 65.9441 57.7447 65.9441C59.8124 65.9441 61.7684 65.1617 63.2214 63.7087L73.4483 53.6494C74.1748 52.9229 74.7337 52.0847 75.1249 51.1346C75.5161 50.1846 75.7396 49.1787 75.7396 48.1727C75.7396 47.1668 75.5161 46.1609 75.1249 45.2108C74.7896 44.3726 74.1748 43.5343 73.4483 42.8078Z", fill: "#8C5CA2" }), jsx$1("path", { d: "M48.2436 43.7019L45.5612 46.3285C45.0582 46.8315 44.7788 47.5021 44.7229 48.2286C44.7229 48.9551 44.4435 49.6257 43.8846 50.1287L41.2022 52.7553L33.6577 60.188C33.1547 60.6909 32.4282 60.9704 31.7017 60.9704C30.9752 60.9704 30.2487 60.6909 29.7458 60.188L19.5188 50.1287C19.0159 49.6257 18.7364 48.8992 18.7364 48.1727C18.7364 47.4462 19.0159 46.7756 19.5188 46.2168L29.7458 36.1575C30.2487 35.6545 30.9752 35.3751 31.7017 35.3751C32.4282 35.3751 33.1547 35.6545 33.6577 36.1575L41.2022 43.5902C41.4257 43.3107 41.6492 42.9754 41.9287 42.7519L44.667 40.0694L37.2343 32.8044C35.7813 31.3514 33.7695 30.569 31.7576 30.569C29.6899 30.569 27.7339 31.3514 26.2809 32.8044L16.054 42.8637C14.601 44.3167 13.7627 46.2726 13.7627 48.2845C13.7627 50.2964 14.601 52.2523 16.054 53.7053L26.2809 63.7646C27.7339 65.2176 29.7458 66 31.7576 66C33.8254 66 35.7813 65.2176 37.2343 63.7646L44.7229 56.3878L47.4613 53.7053C47.7407 53.4259 47.9642 53.1465 48.1878 52.8671C49.1937 51.5258 49.6967 49.961 49.6967 48.3404C49.7525 46.608 49.1937 45.0432 48.2436 43.7019Z", fill: "#3DA9E1" }), jsx$1("path", { d: "M133.022 12.0152C132.407 11.4564 131.68 11.1769 130.842 11.1769H108.376C107.482 11.1769 106.756 11.4564 106.197 11.9593C105.582 12.4623 105.303 13.1888 105.303 14.083C105.303 14.9771 105.582 15.6477 106.197 16.2066C106.812 16.7654 107.538 17.0448 108.376 17.0448H116.312V43.5902C116.312 44.4843 116.591 45.2108 117.206 45.7697C117.821 46.3844 118.603 46.6638 119.553 46.6638C120.559 46.6638 121.342 46.3844 121.956 45.7697C122.571 45.1549 122.906 44.4284 122.906 43.5902V16.989H130.842C131.736 16.989 132.463 16.7095 133.022 16.2066C133.636 15.7036 133.916 14.9771 133.916 14.083C133.916 13.2447 133.636 12.5182 133.022 12.0152Z", fill: "#23292F" }), jsx$1("path", { d: "M152.022 20.4538C151.464 19.8391 150.737 19.5597 149.843 19.5597C148.949 19.5597 148.222 19.8391 147.663 20.4538C147.105 21.0686 146.825 21.7951 146.825 22.6333V35.5986C146.825 36.884 146.602 37.9458 146.155 38.84C145.707 39.7341 145.093 40.4047 144.254 40.8518C143.416 41.2989 142.466 41.5224 141.293 41.5224C139.56 41.5224 138.219 41.0753 137.269 40.1812C136.319 39.287 135.816 37.7223 135.816 35.5427V22.6333C135.816 21.7392 135.536 21.0127 134.978 20.4538C134.419 19.8391 133.692 19.5597 132.798 19.5597C131.904 19.5597 131.177 19.8391 130.619 20.4538C130.06 21.0686 129.78 21.7951 129.78 22.6333V37.4428C129.78 39.3429 130.171 41.0195 130.898 42.4725C131.624 43.9255 132.686 45.0991 134.028 45.9373C135.369 46.7756 136.934 47.1668 138.722 47.1668C140.231 47.1668 141.572 46.9991 142.801 46.6079C143.975 46.2168 144.981 45.7138 145.875 44.9873C146.266 44.652 146.602 44.2608 146.937 43.8696V44.4284C146.937 46.1609 146.657 47.5021 146.155 48.508C145.652 49.514 144.869 50.2405 143.807 50.6317C142.801 51.0787 141.46 51.2464 139.951 51.2464C138.778 51.2464 137.772 51.0787 136.934 50.6875C136.039 50.3522 135.369 50.0728 134.81 49.9052C134.083 49.6257 133.357 49.6816 132.686 50.0169C132.016 50.3522 131.513 51.0228 131.233 52.0288C131.01 52.7553 131.066 53.4818 131.457 54.1524C131.848 54.823 132.519 55.3819 133.58 55.7731C134.363 56.1084 135.369 56.3878 136.542 56.5554C137.772 56.7231 138.89 56.8349 140.007 56.8349C142.466 56.8349 144.646 56.4437 146.602 55.6054C148.558 54.823 150.122 53.4818 151.296 51.6376C152.47 49.7934 153.028 47.3344 153.028 44.2049V22.6333C152.861 21.7392 152.581 21.0127 152.022 20.4538ZM183.821 25.7629C182.703 23.6952 181.25 22.0186 179.35 20.845C177.45 19.6715 175.382 19.0567 172.979 19.0567C171.806 19.0567 170.688 19.2803 169.626 19.6715C168.564 20.0626 167.614 20.5656 166.832 21.2362C166.105 21.7951 165.491 22.3539 165.044 22.9687V22.6892C165.044 21.7951 164.764 21.0686 164.205 20.5097C163.646 19.895 162.92 19.6156 162.026 19.6156C161.132 19.6156 160.405 19.895 159.846 20.5097C159.287 21.1245 159.008 21.851 159.008 22.6892V53.7612C159.008 54.6554 159.287 55.4377 159.846 55.9966C160.405 56.5554 161.132 56.8349 162.026 56.8349C162.92 56.8349 163.646 56.5554 164.205 55.9407C164.764 55.326 165.044 54.5995 165.044 53.7612V43.7578C165.379 44.0931 165.826 44.4843 166.273 44.8196C167.167 45.4902 168.229 46.0491 169.403 46.4962C170.576 46.9433 171.862 47.1668 173.203 47.1668C175.494 47.1668 177.562 46.5521 179.406 45.3785C181.25 44.2049 182.703 42.5284 183.821 40.4047C184.939 38.2811 185.442 35.8781 185.442 33.0838C185.442 30.2896 184.883 27.8865 183.821 25.7629ZM178.68 37.3869C178.065 38.6723 177.171 39.7341 176.109 40.4606C174.991 41.1871 173.706 41.5783 172.253 41.5783C170.8 41.5783 169.459 41.1871 168.341 40.4606C167.223 39.7341 166.329 38.6723 165.714 37.3869C165.099 36.1016 164.764 34.6486 164.764 33.0279C164.764 31.4073 165.099 29.9543 165.714 28.6689C166.329 27.3836 167.223 26.3776 168.341 25.6511C169.459 24.9246 170.744 24.5334 172.253 24.5334C173.762 24.5334 175.047 24.9246 176.109 25.6511C177.227 26.3776 178.065 27.3836 178.68 28.6689C179.294 29.9543 179.63 31.3514 179.63 33.0279C179.63 34.6486 179.294 36.1016 178.68 37.3869ZM213.384 34.425C213.999 33.9221 214.334 33.2515 214.334 32.4691C214.334 30.6249 213.999 28.9483 213.272 27.3277C212.602 25.707 211.652 24.254 210.478 23.0245C209.304 21.7951 207.963 20.845 206.398 20.1185C204.834 19.392 203.213 19.0567 201.536 19.0567C199.301 19.0567 197.177 19.6156 195.221 20.7891C193.21 21.9627 191.589 23.5834 190.359 25.707C189.13 27.8306 188.515 30.4572 188.515 33.475C188.515 36.1016 189.074 38.3929 190.192 40.4606C191.309 42.5284 192.93 44.149 195.054 45.3226C197.177 46.4962 199.636 47.1109 202.542 47.1109C204.219 47.1109 205.895 46.8315 207.46 46.2726C209.025 45.7138 210.254 45.0432 211.149 44.3167C212.099 43.5902 212.546 42.7519 212.546 41.8577C212.546 41.1871 212.322 40.5724 211.819 40.0694C211.316 39.5665 210.702 39.287 209.975 39.287C209.416 39.287 208.857 39.4547 208.243 39.7341C207.851 39.9576 207.46 40.1812 207.013 40.4606C206.566 40.74 205.951 41.0195 205.225 41.1871C204.498 41.4107 203.492 41.4665 202.263 41.4665C200.922 41.4665 199.636 41.1312 198.463 40.4606C197.289 39.79 196.283 38.8399 195.501 37.5546C195.054 36.8281 194.774 35.9898 194.551 35.0398H211.26C212.043 35.2074 212.769 34.928 213.384 34.425ZM196.395 26.3776C197.01 25.7629 197.792 25.2599 198.686 25.0364C199.58 24.757 200.53 24.6452 201.536 24.6452C202.598 24.6452 203.548 24.8687 204.498 25.3158C205.448 25.7629 206.231 26.3776 206.845 27.16C207.46 27.9424 207.796 28.8366 207.907 29.7866V30.1219H194.663C194.718 29.7307 194.83 29.2836 194.942 28.9483C195.221 27.8865 195.78 27.0483 196.395 26.3776ZM250.771 21.851C249.933 19.6715 248.759 17.7155 247.194 16.0389C245.63 14.3624 243.841 13.077 241.718 12.127C239.594 11.177 237.303 10.7299 234.788 10.7299C232.273 10.7299 229.982 11.177 227.914 12.127C225.846 13.077 224.002 14.3624 222.493 16.0389C220.928 17.7155 219.755 19.6715 218.917 21.851C218.078 24.0305 217.631 26.4335 217.631 28.9483C217.631 31.4632 218.078 33.8662 218.917 36.0457C219.755 38.2252 220.928 40.1812 222.493 41.8577C224.002 43.5343 225.846 44.8196 227.914 45.7697C229.982 46.7197 232.329 47.1668 234.788 47.1668C237.303 47.1668 239.594 46.7197 241.718 45.7697C243.841 44.8196 245.63 43.5343 247.194 41.8577C248.759 40.1812 249.933 38.2252 250.771 36.0457C251.609 33.8662 252.056 31.4632 252.056 28.9483C252 26.3776 251.609 24.0305 250.771 21.851ZM244.065 35.0957C243.171 36.9399 241.885 38.3929 240.32 39.4547C238.756 40.5165 236.912 41.0753 234.788 41.0753C232.72 41.0753 230.876 40.5165 229.255 39.4547C227.691 38.3929 226.405 36.9399 225.511 35.0957C224.617 33.2515 224.17 31.1837 224.17 28.9483C224.17 26.6571 224.617 24.5893 225.511 22.7451C226.405 20.9009 227.635 19.4479 229.255 18.3861C230.82 17.3243 232.664 16.7654 234.788 16.7654C236.856 16.7654 238.7 17.3243 240.32 18.3861C241.885 19.4479 243.171 20.9009 244.065 22.7451C244.959 24.5893 245.406 26.6571 245.406 28.8925C245.462 31.1837 244.959 33.2515 244.065 35.0957ZM262.563 10.0593C262.004 9.44452 261.277 9.1651 260.383 9.1651C259.489 9.1651 258.762 9.44452 258.204 10.0593C257.589 10.674 257.309 11.4005 257.309 12.2388V43.5343C257.309 44.4284 257.589 45.1549 258.148 45.7138C258.707 46.3285 259.433 46.6079 260.271 46.6079C261.166 46.6079 261.892 46.3285 262.451 45.7138C263.066 45.0991 263.345 44.3726 263.345 43.5343V12.2388C263.401 11.4005 263.122 10.6181 262.563 10.0593ZM291.511 20.4538C290.952 19.8391 290.226 19.5597 289.332 19.5597C288.437 19.5597 287.711 19.8391 287.152 20.4538C286.593 21.0686 286.314 21.7951 286.314 22.6333V35.5986C286.314 36.884 286.09 37.9458 285.643 38.84C285.196 39.7341 284.581 40.4047 283.743 40.8518C282.961 41.2989 281.955 41.5224 280.781 41.5224C279.049 41.5224 277.707 41.0753 276.757 40.1812C275.807 39.287 275.304 37.7223 275.304 35.5427V22.6333C275.304 21.7392 275.025 21.0127 274.466 20.4538C273.907 19.8391 273.181 19.5597 272.287 19.5597C271.392 19.5597 270.666 19.8391 270.107 20.4538C269.548 21.0686 269.269 21.7951 269.269 22.6333V37.4428C269.269 39.3429 269.66 41.0195 270.387 42.4725C271.113 43.9255 272.175 45.0991 273.516 45.9373C274.857 46.7756 276.422 47.1668 278.21 47.1668C279.719 47.1668 281.061 46.9991 282.29 46.6079C283.464 46.2168 284.47 45.7138 285.364 44.9873C285.755 44.652 286.09 44.2608 286.425 43.8696V44.4284C286.425 46.1609 286.146 47.5021 285.643 48.508C285.14 49.514 284.358 50.2405 283.296 50.6317C282.29 51.0787 280.949 51.2464 279.44 51.2464C278.266 51.2464 277.26 51.0787 276.422 50.6875C275.528 50.3522 274.857 50.0728 274.298 49.9052C273.572 49.6257 272.845 49.6816 272.175 50.0169C271.504 50.3522 271.001 51.0228 270.722 52.0288C270.498 52.7553 270.554 53.4818 270.945 54.1524C271.337 54.823 272.007 55.3819 273.069 55.7731C273.851 56.1084 274.857 56.3878 276.031 56.5554C277.26 56.7231 278.378 56.8349 279.496 56.8349C281.955 56.8349 284.134 56.4437 286.09 55.6054C288.046 54.823 289.611 53.4818 290.785 51.6376C291.958 49.7934 292.517 47.3344 292.517 44.2049V22.6333C292.405 21.7392 292.126 21.0127 291.511 20.4538ZM337.895 24.8129C337.448 23.0804 336.554 21.6833 335.269 20.6215C333.984 19.5597 332.139 19.0567 329.736 19.0567C328.227 19.0567 326.886 19.392 325.713 20.0068C324.539 20.6215 323.477 21.4039 322.639 22.298C321.857 23.1363 321.242 23.9187 320.851 24.6452C320.403 23.1922 319.677 22.0186 318.671 21.0127C317.386 19.7273 315.374 19.0567 312.691 19.0567C311.574 19.0567 310.568 19.2244 309.618 19.6156C308.668 19.9509 307.829 20.4538 307.047 21.0127C306.265 21.5715 305.594 22.1863 305.091 22.8569L304.588 23.5275V22.6892C304.588 21.7951 304.309 21.0686 303.75 20.5097C303.191 19.895 302.464 19.6156 301.57 19.6156C300.676 19.6156 299.95 19.895 299.391 20.5097C298.832 21.1245 298.553 21.851 298.553 22.6892V43.5902C298.553 44.4843 298.832 45.2108 299.391 45.7697C299.95 46.3844 300.676 46.6638 301.57 46.6638C302.464 46.6638 303.191 46.3844 303.75 45.7697C304.309 45.1549 304.588 44.4284 304.588 43.5902V30.569C304.588 29.4513 304.812 28.4454 305.259 27.5512C305.706 26.6571 306.376 25.9306 307.326 25.3717C308.221 24.8129 309.338 24.5893 310.624 24.5893C311.965 24.5893 312.971 24.8687 313.641 25.3717C314.368 25.9306 314.815 26.6571 315.094 27.5512C315.374 28.4454 315.486 29.4513 315.486 30.569V43.5343C315.486 44.4284 315.765 45.1549 316.324 45.7138C316.883 46.3285 317.609 46.6079 318.503 46.6079C319.398 46.6079 320.124 46.3285 320.683 45.7138C321.242 45.0991 321.521 44.3726 321.521 43.5343V30.569C321.521 29.4513 321.745 28.4454 322.192 27.5512C322.639 26.6571 323.309 25.9306 324.26 25.3717C325.154 24.8129 326.271 24.5893 327.557 24.5893C328.898 24.5893 329.904 24.8687 330.575 25.3717C331.301 25.9306 331.748 26.6571 332.028 27.5512C332.307 28.4454 332.419 29.4513 332.419 30.569V43.5343C332.419 44.4284 332.698 45.1549 333.257 45.7138C333.816 46.3285 334.542 46.6079 335.436 46.6079C336.331 46.6079 337.057 46.3285 337.616 45.7138C338.175 45.0991 338.454 44.3726 338.454 43.5343V30.569C338.622 28.4454 338.343 26.5453 337.895 24.8129ZM369.526 25.7629C368.409 23.6952 366.956 22.0186 365.055 20.845C363.155 19.6715 361.088 19.0567 358.685 19.0567C357.511 19.0567 356.393 19.2803 355.332 19.6715C354.27 20.0626 353.32 20.5656 352.537 21.2362C351.811 21.7951 351.196 22.3539 350.749 22.9687V22.6892C350.749 21.7951 350.47 21.0686 349.911 20.5097C349.352 19.895 348.625 19.6156 347.731 19.6156C346.837 19.6156 346.111 19.895 345.552 20.5097C344.993 21.1245 344.713 21.851 344.713 22.6892V53.7612C344.713 54.6554 344.993 55.4377 345.552 55.9966C346.111 56.5554 346.837 56.8349 347.731 56.8349C348.625 56.8349 349.352 56.5554 349.911 55.9407C350.47 55.326 350.749 54.5995 350.749 53.7612V43.7578C351.084 44.0931 351.531 44.4843 351.978 44.8196C352.873 45.4902 353.934 46.0491 355.108 46.4962C356.282 46.9433 357.567 47.1668 358.908 47.1668C361.199 47.1668 363.267 46.5521 365.111 45.3785C366.956 44.2049 368.409 42.5284 369.526 40.4047C370.644 38.2811 371.147 35.8781 371.147 33.0838C371.203 30.2896 370.644 27.8865 369.526 25.7629ZM364.441 37.3869C363.826 38.6723 362.932 39.7341 361.87 40.4606C360.752 41.1871 359.467 41.5783 358.014 41.5783C356.561 41.5783 355.22 41.1871 354.102 40.4606C352.984 39.7341 352.146 38.6723 351.475 37.3869C350.861 36.1016 350.525 34.6486 350.525 33.0279C350.525 31.4073 350.861 29.9543 351.475 28.6689C352.09 27.3836 352.984 26.3776 354.102 25.6511C355.22 24.9246 356.505 24.5334 358.014 24.5334C359.523 24.5334 360.808 24.9246 361.87 25.6511C362.988 26.3776 363.826 27.3836 364.441 28.6689C365.055 29.9543 365.391 31.3514 365.391 33.0279C365.335 34.6486 365.055 36.1016 364.441 37.3869Z", fill: "#23292F" })] })));
|
|
7960
7988
|
};
|
|
7961
7989
|
|
|
7962
|
-
var Wrapper$7 = styled.div(templateObject_1$
|
|
7990
|
+
var Wrapper$7 = styled.div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject$1(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
|
|
7963
7991
|
var size = _a.size;
|
|
7964
7992
|
switch (size) {
|
|
7965
7993
|
default:
|
|
@@ -7969,7 +7997,7 @@ var Wrapper$7 = styled.div(templateObject_1$M || (templateObject_1$M = __makeTem
|
|
|
7969
7997
|
return "116px";
|
|
7970
7998
|
}
|
|
7971
7999
|
});
|
|
7972
|
-
var templateObject_1$
|
|
8000
|
+
var templateObject_1$N;
|
|
7973
8001
|
|
|
7974
8002
|
var medals = {
|
|
7975
8003
|
small: {
|
|
@@ -7985,11 +8013,11 @@ var medals = {
|
|
|
7985
8013
|
};
|
|
7986
8014
|
var Medal = function (props) { return (jsx$1(Wrapper$7, __assign$2({}, props, { children: medals[props.size || "small"][props.type] }))); };
|
|
7987
8015
|
|
|
7988
|
-
var Wrapper$6 = styled.div(templateObject_1$
|
|
8016
|
+
var Wrapper$6 = styled.div(templateObject_1$M || (templateObject_1$M = __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) {
|
|
7989
8017
|
var disabled = _a.disabled;
|
|
7990
8018
|
return (disabled ? "49.5px" : "");
|
|
7991
8019
|
});
|
|
7992
|
-
var StyledInputNumber = styled.input(templateObject_2$
|
|
8020
|
+
var StyledInputNumber = styled.input(templateObject_2$A || (templateObject_2$A = __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) {
|
|
7993
8021
|
var disabled = _a.disabled;
|
|
7994
8022
|
return disabled ? theme.colors.lightGray.base : theme.colors.lightGray.light;
|
|
7995
8023
|
}, function (_a) {
|
|
@@ -8002,7 +8030,7 @@ var StyledInputNumber = styled.input(templateObject_2$z || (templateObject_2$z =
|
|
|
8002
8030
|
var disabled = _a.disabled;
|
|
8003
8031
|
return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
|
|
8004
8032
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
8005
|
-
var templateObject_1$
|
|
8033
|
+
var templateObject_1$M, templateObject_2$A;
|
|
8006
8034
|
|
|
8007
8035
|
var Number$1 = function (props) {
|
|
8008
8036
|
var inputRef = useRef(null);
|
|
@@ -8046,7 +8074,7 @@ var Number$1 = function (props) {
|
|
|
8046
8074
|
|
|
8047
8075
|
var Paragraph = function (props) { return (jsx$1(StyledParagraph, __assign$2({}, props, { children: props.children }))); };
|
|
8048
8076
|
|
|
8049
|
-
var StyledRadio = styled.div(templateObject_1$
|
|
8077
|
+
var StyledRadio = styled.div(templateObject_1$L || (templateObject_1$L = __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) {
|
|
8050
8078
|
var checked = _a.checked, disabled = _a.disabled;
|
|
8051
8079
|
if (disabled)
|
|
8052
8080
|
return theme.colors.lightGray.darker;
|
|
@@ -8074,7 +8102,7 @@ var StyledRadio = styled.div(templateObject_1$K || (templateObject_1$K = __makeT
|
|
|
8074
8102
|
return theme.colors.green.base;
|
|
8075
8103
|
return "";
|
|
8076
8104
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
8077
|
-
var templateObject_1$
|
|
8105
|
+
var templateObject_1$L;
|
|
8078
8106
|
|
|
8079
8107
|
var Radio = function (props) {
|
|
8080
8108
|
var _a, _b;
|
|
@@ -8106,7 +8134,7 @@ var Radio = function (props) {
|
|
|
8106
8134
|
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 }) })));
|
|
8107
8135
|
};
|
|
8108
8136
|
|
|
8109
|
-
var StyledRange = styled.div(templateObject_1$
|
|
8137
|
+
var StyledRange = styled.div(templateObject_1$K || (templateObject_1$K = __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) {
|
|
8110
8138
|
var value = _a.value, disabled = _a.disabled;
|
|
8111
8139
|
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 )");
|
|
8112
8140
|
}, function () { return theme.colors.lightGray.light; }, function (_a) {
|
|
@@ -8116,7 +8144,7 @@ var StyledRange = styled.div(templateObject_1$J || (templateObject_1$J = __makeT
|
|
|
8116
8144
|
var disabled = _a.disabled;
|
|
8117
8145
|
return disabled ? "not-allowed" : "pointer";
|
|
8118
8146
|
});
|
|
8119
|
-
var templateObject_1$
|
|
8147
|
+
var templateObject_1$K;
|
|
8120
8148
|
|
|
8121
8149
|
var Range = function (props) {
|
|
8122
8150
|
var _a;
|
|
@@ -8145,11 +8173,11 @@ var Range = function (props) {
|
|
|
8145
8173
|
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 }) })));
|
|
8146
8174
|
};
|
|
8147
8175
|
|
|
8148
|
-
var Wrapper$5 = styled.div(templateObject_1$
|
|
8176
|
+
var Wrapper$5 = styled.div(templateObject_1$J || (templateObject_1$J = __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) {
|
|
8149
8177
|
var disabled = _a.disabled;
|
|
8150
8178
|
return (disabled ? "not-allowed" : "pointer");
|
|
8151
8179
|
});
|
|
8152
|
-
var StyledSelect = styled.select(templateObject_2$
|
|
8180
|
+
var StyledSelect = styled.select(templateObject_2$z || (templateObject_2$z = __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 13px 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 13px 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) {
|
|
8153
8181
|
var disabled = _a.disabled;
|
|
8154
8182
|
return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
8155
8183
|
}, function (_a) {
|
|
@@ -8162,7 +8190,7 @@ var StyledSelect = styled.select(templateObject_2$y || (templateObject_2$y = __m
|
|
|
8162
8190
|
var isChanged = _a.isChanged;
|
|
8163
8191
|
return isChanged ? theme.colors.darkGray.base : theme.colors.lightGray.darker;
|
|
8164
8192
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
8165
|
-
var templateObject_1$
|
|
8193
|
+
var templateObject_1$J, templateObject_2$z;
|
|
8166
8194
|
|
|
8167
8195
|
var Select = function (props) {
|
|
8168
8196
|
var _a;
|
|
@@ -8184,7 +8212,7 @@ var Select = function (props) {
|
|
|
8184
8212
|
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] }))] }));
|
|
8185
8213
|
};
|
|
8186
8214
|
|
|
8187
|
-
var StyledSubheading = styled.p(templateObject_1$
|
|
8215
|
+
var StyledSubheading = styled.p(templateObject_1$I || (templateObject_1$I = __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) {
|
|
8188
8216
|
var size = _a.size;
|
|
8189
8217
|
return size ? theme.subheading[size].fontSize : theme.subheading.medium.fontSize;
|
|
8190
8218
|
}, function (_a) {
|
|
@@ -8212,11 +8240,11 @@ var StyledSubheading = styled.p(templateObject_1$H || (templateObject_1$H = __ma
|
|
|
8212
8240
|
return theme.colors.darkGray.dark;
|
|
8213
8241
|
}
|
|
8214
8242
|
});
|
|
8215
|
-
var templateObject_1$
|
|
8243
|
+
var templateObject_1$I;
|
|
8216
8244
|
|
|
8217
8245
|
var Subheading = function (props) { return (jsx$1(StyledSubheading, __assign$2({}, props, { children: props.children }))); };
|
|
8218
8246
|
|
|
8219
|
-
var Container$
|
|
8247
|
+
var Container$o = styled.div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject$1(["\n padding: 7px 10px;\n background-color: ", ";\n box-shadow: ", ";\n border: 1px solid;\n border-color: ", ";\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: ", ";\n border: 1px solid;\n border-color: ", ";\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"])), function (_a) {
|
|
8220
8248
|
var color = _a.color;
|
|
8221
8249
|
if (!color)
|
|
8222
8250
|
return theme.colors.lightGray.base;
|
|
@@ -8237,14 +8265,14 @@ var Container$n = styled.div(templateObject_1$G || (templateObject_1$G = __makeT
|
|
|
8237
8265
|
return theme.colors.darkGray.light;
|
|
8238
8266
|
return theme.colors[color].darker;
|
|
8239
8267
|
});
|
|
8240
|
-
var templateObject_1$
|
|
8268
|
+
var templateObject_1$H;
|
|
8241
8269
|
|
|
8242
8270
|
var Tag = function (_a) {
|
|
8243
8271
|
var color = _a.color, children = _a.children;
|
|
8244
|
-
return jsx$1(Container$
|
|
8272
|
+
return jsx$1(Container$o, __assign$2({ color: color }, { children: children }));
|
|
8245
8273
|
};
|
|
8246
8274
|
|
|
8247
|
-
var StyledTextarea = styled.textarea(templateObject_1$
|
|
8275
|
+
var StyledTextarea = styled.textarea(templateObject_1$G || (templateObject_1$G = __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) {
|
|
8248
8276
|
var disabled = _a.disabled;
|
|
8249
8277
|
return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
8250
8278
|
}, function (_a) {
|
|
@@ -8257,7 +8285,7 @@ var StyledTextarea = styled.textarea(templateObject_1$F || (templateObject_1$F =
|
|
|
8257
8285
|
var disabled = _a.disabled;
|
|
8258
8286
|
return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
|
|
8259
8287
|
}, 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));
|
|
8260
|
-
var templateObject_1$
|
|
8288
|
+
var templateObject_1$G;
|
|
8261
8289
|
|
|
8262
8290
|
var Textarea = function (props) {
|
|
8263
8291
|
var onChange = function (e) {
|
|
@@ -8267,7 +8295,7 @@ var Textarea = function (props) {
|
|
|
8267
8295
|
return jsx$1(StyledTextarea, __assign$2({}, props, { onChange: onChange }));
|
|
8268
8296
|
};
|
|
8269
8297
|
|
|
8270
|
-
var Container$
|
|
8298
|
+
var Container$n = styled.div(templateObject_1$F || (templateObject_1$F = __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) {
|
|
8271
8299
|
var disabled = _a.disabled;
|
|
8272
8300
|
return (disabled ? "not-allowed" : "pointer");
|
|
8273
8301
|
}, function (_a) {
|
|
@@ -8285,7 +8313,7 @@ var Container$m = styled.div(templateObject_1$E || (templateObject_1$E = __makeT
|
|
|
8285
8313
|
var disabled = _a.disabled;
|
|
8286
8314
|
return disabled ? theme.colors.lightGray.darker : theme.colors.lightGray.light;
|
|
8287
8315
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
8288
|
-
var templateObject_1$
|
|
8316
|
+
var templateObject_1$F;
|
|
8289
8317
|
|
|
8290
8318
|
var Toggle = function (props) {
|
|
8291
8319
|
var _a;
|
|
@@ -8313,10 +8341,10 @@ var Toggle = function (props) {
|
|
|
8313
8341
|
props.onChange(newValue);
|
|
8314
8342
|
}
|
|
8315
8343
|
};
|
|
8316
|
-
return (jsx$1(Container$
|
|
8344
|
+
return (jsx$1(Container$n, __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 }) })));
|
|
8317
8345
|
};
|
|
8318
8346
|
|
|
8319
|
-
var Wrapper$4 = styled.div(templateObject_1$
|
|
8347
|
+
var Wrapper$4 = styled.div(templateObject_1$E || (templateObject_1$E = __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) {
|
|
8320
8348
|
var level = _a.level;
|
|
8321
8349
|
switch (level) {
|
|
8322
8350
|
case 1:
|
|
@@ -8327,7 +8355,7 @@ var Wrapper$4 = styled.div(templateObject_1$D || (templateObject_1$D = __makeTem
|
|
|
8327
8355
|
return "70px";
|
|
8328
8356
|
}
|
|
8329
8357
|
});
|
|
8330
|
-
var templateObject_1$
|
|
8358
|
+
var templateObject_1$E;
|
|
8331
8359
|
|
|
8332
8360
|
var trophies = {
|
|
8333
8361
|
1: {
|
|
@@ -8363,7 +8391,7 @@ var trophies = {
|
|
|
8363
8391
|
};
|
|
8364
8392
|
var Trophy = function (props) { return (jsx$1(Wrapper$4, __assign$2({}, props, { children: trophies[props.variant][props.level] }))); };
|
|
8365
8393
|
|
|
8366
|
-
var Container$
|
|
8394
|
+
var Container$m = styled.div(templateObject_1$D || (templateObject_1$D = __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) {
|
|
8367
8395
|
var type = _a.type;
|
|
8368
8396
|
switch (type) {
|
|
8369
8397
|
case "success":
|
|
@@ -8384,7 +8412,7 @@ var Container$l = styled.div(templateObject_1$C || (templateObject_1$C = __makeT
|
|
|
8384
8412
|
return theme.colors.blue.base;
|
|
8385
8413
|
}
|
|
8386
8414
|
});
|
|
8387
|
-
var Action = styled.div(templateObject_2$
|
|
8415
|
+
var Action = styled.div(templateObject_2$y || (templateObject_2$y = __makeTemplateObject$1(["\n flex-shrink: 0;\n margin-left: 15px;\n cursor: pointer;\n\n :hover p {\n color: ", ";\n }\n"], ["\n flex-shrink: 0;\n margin-left: 15px;\n cursor: pointer;\n\n :hover p {\n color: ", ";\n }\n"])), function (_a) {
|
|
8388
8416
|
var type = _a.type;
|
|
8389
8417
|
switch (type) {
|
|
8390
8418
|
default:
|
|
@@ -8396,7 +8424,7 @@ var Action = styled.div(templateObject_2$x || (templateObject_2$x = __makeTempla
|
|
|
8396
8424
|
return theme.colors.blue.dark;
|
|
8397
8425
|
}
|
|
8398
8426
|
});
|
|
8399
|
-
var templateObject_1$
|
|
8427
|
+
var templateObject_1$D, templateObject_2$y;
|
|
8400
8428
|
|
|
8401
8429
|
var Alert = function (props) {
|
|
8402
8430
|
var _a = useState(true), isOpen = _a[0], setIsOpen = _a[1];
|
|
@@ -8416,10 +8444,10 @@ var Alert = function (props) {
|
|
|
8416
8444
|
icon = "infoCircle";
|
|
8417
8445
|
if (!isOpen)
|
|
8418
8446
|
return null;
|
|
8419
|
-
return (jsxs(Container$
|
|
8447
|
+
return (jsxs(Container$m, __assign$2({}, props, { children: [jsx$1(Icon, { size: "small", type: icon, color: color }), jsx$1(Paragraph, { children: props.message }), props.action && (jsx$1(Action, __assign$2({ type: props.type, onClick: props.action.onClick }, { children: jsx$1(Paragraph, __assign$2({ decoration: "underline" }, { children: props.action.label })) }))), props.isClosable && (jsx$1("div", __assign$2({ style: { marginLeft: "auto" } }, { children: jsx$1(Icon, { size: "tiny", type: "cross", color: color, onClick: function () { return setIsOpen(false); } }) })))] })));
|
|
8420
8448
|
};
|
|
8421
8449
|
|
|
8422
|
-
var StyledCard = styled.div(templateObject_1$
|
|
8450
|
+
var StyledCard = styled.div(templateObject_1$C || (templateObject_1$C = __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) {
|
|
8423
8451
|
var bordered = _a.bordered;
|
|
8424
8452
|
return bordered ? "1px solid ".concat(theme.colors.lightGray.dark) : "none";
|
|
8425
8453
|
}, function (_a) {
|
|
@@ -8431,12 +8459,12 @@ var StyledCard = styled.div(templateObject_1$B || (templateObject_1$B = __makeTe
|
|
|
8431
8459
|
}, ";\n\n > div:first-child {\n width: 175%;\n padding-bottom: 175%;\n top: -25%;\n right: -25%;\n }\n }")
|
|
8432
8460
|
: "";
|
|
8433
8461
|
});
|
|
8434
|
-
var Ellipse = styled.div(templateObject_2$
|
|
8462
|
+
var Ellipse = styled.div(templateObject_2$x || (templateObject_2$x = __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) {
|
|
8435
8463
|
var color = _a.color;
|
|
8436
8464
|
return color ? theme.colors[color].light : "";
|
|
8437
8465
|
});
|
|
8438
|
-
var Content = styled.div(templateObject_3$
|
|
8439
|
-
var templateObject_1$
|
|
8466
|
+
var Content = styled.div(templateObject_3$e || (templateObject_3$e = __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"])));
|
|
8467
|
+
var templateObject_1$C, templateObject_2$x, templateObject_3$e;
|
|
8440
8468
|
|
|
8441
8469
|
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 })] }))); };
|
|
8442
8470
|
|
|
@@ -14685,14 +14713,14 @@ htmlReactParser.Element;
|
|
|
14685
14713
|
htmlReactParser.ProcessingInstruction;
|
|
14686
14714
|
htmlReactParser.Text;
|
|
14687
14715
|
|
|
14688
|
-
var Fieldset$1 = styled.fieldset(templateObject_1$
|
|
14689
|
-
var CheckboxContainer = styled.div(templateObject_2$
|
|
14690
|
-
var CheckboxWrapper = styled.div(templateObject_3$
|
|
14691
|
-
var Label$b = styled(StyledParagraph)(templateObject_4$
|
|
14716
|
+
var Fieldset$1 = styled.fieldset(templateObject_1$B || (templateObject_1$B = __makeTemplateObject$1(["\n border: 0;\n margin: 0;\n padding: 0;\n"], ["\n border: 0;\n margin: 0;\n padding: 0;\n"])));
|
|
14717
|
+
var CheckboxContainer = styled.div(templateObject_2$w || (templateObject_2$w = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
|
|
14718
|
+
var CheckboxWrapper = styled.div(templateObject_3$d || (templateObject_3$d = __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"])));
|
|
14719
|
+
var Label$b = styled(StyledParagraph)(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject$1(["\n font-weight: ", ";\n color: ", ";\n display: flex;\n flex-wrap: wrap;\n gap: 0 6px;\n align-items: center;\n cursor: pointer;\n\n a {\n color: ", ";\n }\n"], ["\n font-weight: ", ";\n color: ", ";\n display: flex;\n flex-wrap: wrap;\n gap: 0 6px;\n align-items: center;\n cursor: pointer;\n\n a {\n color: ", ";\n }\n"])), function (_a) {
|
|
14692
14720
|
var weight = _a.weight;
|
|
14693
14721
|
return weight || 500;
|
|
14694
14722
|
}, theme.colors.darkGray.base, theme.colors.blue.base);
|
|
14695
|
-
var templateObject_1$
|
|
14723
|
+
var templateObject_1$B, templateObject_2$w, templateObject_3$d, templateObject_4$6;
|
|
14696
14724
|
|
|
14697
14725
|
var Checkboxes = function (props) {
|
|
14698
14726
|
var _a = useState(props.defaultValue || []), values = _a[0], setValues = _a[1];
|
|
@@ -14715,12 +14743,12 @@ var Checkboxes = function (props) {
|
|
|
14715
14743
|
}) })] }));
|
|
14716
14744
|
};
|
|
14717
14745
|
|
|
14718
|
-
var Container$
|
|
14719
|
-
var Item = styled.div(templateObject_2$
|
|
14746
|
+
var Container$l = styled.div(templateObject_1$A || (templateObject_1$A = __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);
|
|
14747
|
+
var Item = styled.div(templateObject_2$v || (templateObject_2$v = __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, > div:last-child {\n display: ", ";\n margin: 0;\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, > div:last-child {\n display: ", ";\n margin: 0;\n }\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n"])), function (_a) {
|
|
14720
14748
|
var isOpen = _a.isOpen;
|
|
14721
14749
|
return (isOpen ? "" : "none");
|
|
14722
14750
|
}, theme.colors.lightGray.dark);
|
|
14723
|
-
var templateObject_1$
|
|
14751
|
+
var templateObject_1$A, templateObject_2$v;
|
|
14724
14752
|
|
|
14725
14753
|
var Collapse = function (props) {
|
|
14726
14754
|
var _a = useState([]), openItems = _a[0], setOpenItems = _a[1];
|
|
@@ -14732,18 +14760,18 @@ var Collapse = function (props) {
|
|
|
14732
14760
|
setOpenItems(function (prevState) { return __spreadArray(__spreadArray([], prevState, true), [index], false); });
|
|
14733
14761
|
}
|
|
14734
14762
|
};
|
|
14735
|
-
return (jsx$1(Container$
|
|
14763
|
+
return (jsx$1(Container$l, __assign$2({}, props, { children: props.items.map(function (item, index) {
|
|
14736
14764
|
var isOpen = openItems.includes(index);
|
|
14737
14765
|
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", as: typeof item.content !== "string" ? "div" : undefined }, { children: item.content }))] }), "".concat(item.title, "-").concat(index)));
|
|
14738
14766
|
}) })));
|
|
14739
14767
|
};
|
|
14740
14768
|
|
|
14741
|
-
var Wrapper$3 = styled.div(templateObject_1$
|
|
14742
|
-
var Value = styled.div(templateObject_2$
|
|
14769
|
+
var Wrapper$3 = styled.div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject$1(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
14770
|
+
var Value = styled.div(templateObject_2$u || (templateObject_2$u = __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) {
|
|
14743
14771
|
var contrast = _a.contrast;
|
|
14744
14772
|
return contrast ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
14745
14773
|
}, theme.colors.darkGray.base);
|
|
14746
|
-
var templateObject_1$
|
|
14774
|
+
var templateObject_1$z, templateObject_2$u;
|
|
14747
14775
|
|
|
14748
14776
|
var Countdown = function (_a) {
|
|
14749
14777
|
var till = _a.till, contrast = _a.contrast;
|
|
@@ -14770,20 +14798,20 @@ var Countdown = function (_a) {
|
|
|
14770
14798
|
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 })) }))] }));
|
|
14771
14799
|
};
|
|
14772
14800
|
|
|
14773
|
-
var Container$
|
|
14774
|
-
var Data = styled.div(templateObject_2$
|
|
14775
|
-
var templateObject_1$
|
|
14801
|
+
var Container$k = styled.div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject$1(["\n width: fill-available;\n padding: 15px;\n border: 1px solid;\n border-radius: 6px;\n border-color: ", ";\n background-color: ", ";\n position: relative;\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n gap: 50px;\n margin-bottom: 15px;\n\n h6 {\n font-size: 14px;\n\n :hover {\n color: ", ";\n cursor: pointer;\n }\n }\n }\n"], ["\n width: fill-available;\n padding: 15px;\n border: 1px solid;\n border-radius: 6px;\n border-color: ", ";\n background-color: ", ";\n position: relative;\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n gap: 50px;\n margin-bottom: 15px;\n\n h6 {\n font-size: 14px;\n\n :hover {\n color: ", ";\n cursor: pointer;\n }\n }\n }\n"])), theme.colors.lightGray.darker, theme.colors.lightGray.light, theme.colors.blue.base);
|
|
14802
|
+
var Data = styled.div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject$1(["\n > div {\n width: 100%;\n display: flex;\n align-items: end;\n gap: 10px;\n\n > p {\n width: 50%;\n }\n }\n"], ["\n > div {\n width: 100%;\n display: flex;\n align-items: end;\n gap: 10px;\n\n > p {\n width: 50%;\n }\n }\n"])));
|
|
14803
|
+
var templateObject_1$y, templateObject_2$t;
|
|
14776
14804
|
|
|
14777
14805
|
var DataSummary = function (_a) {
|
|
14778
14806
|
var title = _a.title, data = _a.data, onEdit = _a.onEdit, locale = _a.locale;
|
|
14779
|
-
return (jsx$1(Fragment$1, { children: jsxs(Container$
|
|
14807
|
+
return (jsx$1(Fragment$1, { children: jsxs(Container$k, { children: [jsxs("div", { children: [jsx$1(Heading, __assign$2({ type: "h5" }, { children: title })), onEdit && (jsx$1("div", __assign$2({ onClick: onEdit }, { children: jsx$1(Heading, __assign$2({ type: "h6", color: "gray" }, { children: translations[locale]["Edit"] })) })))] }), jsx$1(Data, { children: data === null || data === void 0 ? void 0 : data.map(function (item, index) {
|
|
14780
14808
|
return item instanceof Object ? (jsxs("div", { children: [jsxs(Paragraph, __assign$2({ weight: "regular" }, { children: [item.label, ":"] })), jsx$1(Paragraph, __assign$2({ weight: "regular" }, { children: item.value }))] }, "".concat(item.label, "-").concat(item.value, "-").concat(index))) : (jsx$1(Paragraph, __assign$2({ weight: "regular" }, { children: item }), "".concat(item, "-").concat(index)));
|
|
14781
14809
|
}) })] }) }));
|
|
14782
14810
|
};
|
|
14783
14811
|
|
|
14784
|
-
var Container$
|
|
14785
|
-
var Label$a = styled(StyledParagraph)(templateObject_2$
|
|
14786
|
-
var templateObject_1$
|
|
14812
|
+
var Container$j = styled.div(templateObject_1$x || (templateObject_1$x = __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"])));
|
|
14813
|
+
var Label$a = styled(StyledParagraph)(templateObject_2$s || (templateObject_2$s = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
14814
|
+
var templateObject_1$x, templateObject_2$s;
|
|
14787
14815
|
|
|
14788
14816
|
var DateInputField = function (props) {
|
|
14789
14817
|
var onChange = function (value) {
|
|
@@ -14794,7 +14822,7 @@ var DateInputField = function (props) {
|
|
|
14794
14822
|
if (props.onBlur)
|
|
14795
14823
|
props.onBlur(props.name);
|
|
14796
14824
|
};
|
|
14797
|
-
return (jsxs(Container$
|
|
14825
|
+
return (jsxs(Container$j, { children: [jsx$1(Label$a, __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 })] }));
|
|
14798
14826
|
};
|
|
14799
14827
|
|
|
14800
14828
|
var generateRandomString = function (length) {
|
|
@@ -14807,8 +14835,8 @@ var generateRandomString = function (length) {
|
|
|
14807
14835
|
return string;
|
|
14808
14836
|
};
|
|
14809
14837
|
|
|
14810
|
-
var ButtonWrapper$1 = styled.div(templateObject_1$
|
|
14811
|
-
var Container$
|
|
14838
|
+
var ButtonWrapper$1 = styled.div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject$1(["\n > button {\n flex-direction: row-reverse;\n padding-right: 14px;\n }\n"], ["\n > button {\n flex-direction: row-reverse;\n padding-right: 14px;\n }\n"])));
|
|
14839
|
+
var Container$i = styled.div(templateObject_2$r || (templateObject_2$r = __makeTemplateObject$1(["\n width: max-content;\n position: fixed;\n z-index: 9;\n opacity: ", ";\n top: ", ";\n left: ", ";\n background-color: ", ";\n border-radius: 6px;\n border: 1px solid ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 10%);\n pointer-events: ", ";\n"], ["\n width: max-content;\n position: fixed;\n z-index: 9;\n opacity: ", ";\n top: ", ";\n left: ", ";\n background-color: ", ";\n border-radius: 6px;\n border: 1px solid ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 10%);\n pointer-events: ", ";\n"])), function (_a) {
|
|
14812
14840
|
var isVisible = _a.isVisible;
|
|
14813
14841
|
return (isVisible ? "100%" : "0%");
|
|
14814
14842
|
}, function (_a) {
|
|
@@ -14821,8 +14849,8 @@ var Container$h = styled.div(templateObject_2$q || (templateObject_2$q = __makeT
|
|
|
14821
14849
|
var isVisible = _a.isVisible;
|
|
14822
14850
|
return (isVisible ? "all" : "none");
|
|
14823
14851
|
});
|
|
14824
|
-
var MenuItem = styled.div(templateObject_3$
|
|
14825
|
-
var templateObject_1$
|
|
14852
|
+
var MenuItem = styled.div(templateObject_3$c || (templateObject_3$c = __makeTemplateObject$1(["\n padding: 10px 15px;\n display: flex;\n align-items: center;\n gap: 10px;\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n p {\n margin-top: 2px;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n p {\n color: ", ";\n }\n\n svg {\n fill: ", ";\n }\n }\n"], ["\n padding: 10px 15px;\n display: flex;\n align-items: center;\n gap: 10px;\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n p {\n margin-top: 2px;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n p {\n color: ", ";\n }\n\n svg {\n fill: ", ";\n }\n }\n"])), theme.colors.lightGray.dark, theme.colors.lightGray.base, theme.colors.blue.base, theme.colors.blue.base);
|
|
14853
|
+
var templateObject_1$w, templateObject_2$r, templateObject_3$c;
|
|
14826
14854
|
|
|
14827
14855
|
var DropdownButton = function (props) {
|
|
14828
14856
|
return (jsx$1(Fragment$1, { children: jsx$1("div", { children: jsx$1(Dropdown, __assign$2({}, props, { yOffset: props.yOffset || 10, trigger: ["click"] }, { children: jsx$1(ButtonWrapper$1, { children: jsx$1(Button$1, { label: props.label, color: props.color, size: props.size, disabled: props.disabled, icon: "chevronDown" }) }) })) }) }));
|
|
@@ -14886,7 +14914,7 @@ var Dropdown = function (_a) {
|
|
|
14886
14914
|
return React__default.cloneElement(child, props_1);
|
|
14887
14915
|
}
|
|
14888
14916
|
});
|
|
14889
|
-
return (jsxs(Fragment$1, { children: [children, jsx$1(Container$
|
|
14917
|
+
return (jsxs(Fragment$1, { children: [children, jsx$1(Container$i, __assign$2({}, position, { isVisible: isVisible && menu.length > 0, ref: dropwdownRef, onMouseLeave: function () { return setIsVisible(false); } }, { children: menu.map(function (_a, index) {
|
|
14890
14918
|
var label = _a.label, icon = _a.icon, onClick = _a.onClick;
|
|
14891
14919
|
return (jsx$1(MenuItem, __assign$2({ onClick: function () {
|
|
14892
14920
|
onClick();
|
|
@@ -17413,8 +17441,8 @@ function reducer$1(state, action) {
|
|
|
17413
17441
|
|
|
17414
17442
|
function noop$3() {}
|
|
17415
17443
|
|
|
17416
|
-
var Container$
|
|
17417
|
-
var DropZone = styled.div(templateObject_2$
|
|
17444
|
+
var Container$h = styled.div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject$1(["\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 15px;\n"], ["\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 15px;\n"])));
|
|
17445
|
+
var DropZone = styled.div(templateObject_2$q || (templateObject_2$q = __makeTemplateObject$1(["\n min-height: 250px;\n border-width: 2px;\n border-style: dashed;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n background-color: ", ";\n padding: 25px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"], ["\n min-height: 250px;\n border-width: 2px;\n border-style: dashed;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n background-color: ", ";\n padding: 25px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"])), function (_a) {
|
|
17418
17446
|
_a.isDragActive; var isDragAccept = _a.isDragAccept, isDragReject = _a.isDragReject;
|
|
17419
17447
|
// if (isDragActive) return theme.colors.blue.base;
|
|
17420
17448
|
if (isDragAccept)
|
|
@@ -17433,8 +17461,8 @@ var DropZone = styled.div(templateObject_2$p || (templateObject_2$p = __makeTemp
|
|
|
17433
17461
|
else
|
|
17434
17462
|
return theme.colors.lightGray.base;
|
|
17435
17463
|
});
|
|
17436
|
-
var FileList = styled.div(templateObject_3$
|
|
17437
|
-
var templateObject_1$
|
|
17464
|
+
var FileList = styled.div(templateObject_3$b || (templateObject_3$b = __makeTemplateObject$1(["\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 10px;\n"], ["\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
17465
|
+
var templateObject_1$v, templateObject_2$q, templateObject_3$b;
|
|
17438
17466
|
|
|
17439
17467
|
var FileUpload = function (_a) {
|
|
17440
17468
|
var locale = _a.locale, accept = _a.accept, onDrop = _a.onDrop, files = _a.files;
|
|
@@ -17447,14 +17475,14 @@ var FileUpload = function (_a) {
|
|
|
17447
17475
|
// Max number of files: 1
|
|
17448
17476
|
maxFiles: 1,
|
|
17449
17477
|
}), getRootProps = _b.getRootProps, getInputProps = _b.getInputProps, isDragActive = _b.isDragActive, isDragAccept = _b.isDragAccept, isDragReject = _b.isDragReject;
|
|
17450
|
-
return (jsx$1(Fragment$1, { children: jsxs(Container$
|
|
17478
|
+
return (jsx$1(Fragment$1, { children: jsxs(Container$h, { children: [jsxs(DropZone, __assign$2({}, getRootProps({
|
|
17451
17479
|
isDragActive: isDragActive,
|
|
17452
17480
|
isDragAccept: isDragAccept,
|
|
17453
17481
|
isDragReject: isDragReject,
|
|
17454
17482
|
}), { children: [jsx$1("input", __assign$2({}, getInputProps())), jsx$1(Icon, { type: "fileArrow", size: "large" }), jsx$1(Spacer, { vertical: 15 }), !isDragActive && (jsxs(Fragment$1, { children: [jsx$1(Heading, __assign$2({ type: "h6" }, { children: translations[locale]["Drag file(s) here..."] })), jsx$1(Spacer, { vertical: 5 }), jsx$1(Paragraph, { children: translations[locale]["or"] }), jsx$1(Spacer, { vertical: 10 }), jsx$1(Button$1, { label: translations[locale]["Select file(s)"], size: "small" })] })), isDragActive && !isDragReject && (jsx$1(Heading, __assign$2({ type: "h6" }, { children: translations[locale]["Upload file(s)..."] }))), isDragReject && (jsx$1(Heading, __assign$2({ type: "h6" }, { children: translations[locale]["File type not allowed"] })))] })), files && files.length > 0 && (jsx$1(FileList, { children: files.map(function (file, index) { return (jsx$1(Alert, { type: "success", message: file.name }, "".concat(file.name, "-").concat(index))); }) }))] }) }));
|
|
17455
17483
|
};
|
|
17456
17484
|
|
|
17457
|
-
var StyledIconButton = styled(StyledButton)(templateObject_1$
|
|
17485
|
+
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 pointer-events: none;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\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 pointer-events: none;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\n }\n"])), function (_a) {
|
|
17458
17486
|
var size = _a.size;
|
|
17459
17487
|
return (size === "small" ? "30px" : "40px");
|
|
17460
17488
|
}, function (_a) {
|
|
@@ -17473,15 +17501,15 @@ var StyledIconButton = styled(StyledButton)(templateObject_1$t || (templateObjec
|
|
|
17473
17501
|
var size = _a.size;
|
|
17474
17502
|
return (size === "small" ? "27px" : "37px");
|
|
17475
17503
|
});
|
|
17476
|
-
var templateObject_1$
|
|
17504
|
+
var templateObject_1$u;
|
|
17477
17505
|
|
|
17478
17506
|
var IconButton = function (props) {
|
|
17479
17507
|
return (jsx$1(StyledIconButton, __assign$2({}, props, { children: jsx$1(Icon, { type: props.icon, size: props.size === "small" ? "tiny" : "small", color: props.color === "white" ? "gray" : "white" }) })));
|
|
17480
17508
|
};
|
|
17481
17509
|
|
|
17482
|
-
var Container$
|
|
17483
|
-
var Label$9 = styled(StyledParagraph)(templateObject_2$
|
|
17484
|
-
var templateObject_1$
|
|
17510
|
+
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"])));
|
|
17511
|
+
var Label$9 = styled(StyledParagraph)(templateObject_2$p || (templateObject_2$p = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
17512
|
+
var templateObject_1$t, templateObject_2$p;
|
|
17485
17513
|
|
|
17486
17514
|
var InputField = function (props) {
|
|
17487
17515
|
var onChange = function (value) {
|
|
@@ -17492,10 +17520,10 @@ var InputField = function (props) {
|
|
|
17492
17520
|
if (props.onBlur)
|
|
17493
17521
|
props.onBlur(props.name);
|
|
17494
17522
|
};
|
|
17495
|
-
return (jsxs(Container$
|
|
17523
|
+
return (jsxs(Container$g, { children: [jsx$1(Label$9, __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))); })] })))] }));
|
|
17496
17524
|
};
|
|
17497
17525
|
|
|
17498
|
-
var Container$
|
|
17526
|
+
var Container$f = styled.div(templateObject_1$s || (templateObject_1$s = __makeTemplateObject$1(["\n min-width: 74px;\n max-width: ", ";\n min-height: 74px;\n max-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: ", ";\n min-height: 74px;\n max-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) {
|
|
17499
17527
|
var char = _a.char;
|
|
17500
17528
|
return (char.length === 1 ? "74px" : "");
|
|
17501
17529
|
}, function (_a) {
|
|
@@ -17542,23 +17570,23 @@ var Container$e = styled.div(templateObject_1$r || (templateObject_1$r = __makeT
|
|
|
17542
17570
|
return theme.colors.darkGray.light;
|
|
17543
17571
|
}
|
|
17544
17572
|
});
|
|
17545
|
-
var CheckIconWrapper = styled.div(templateObject_2$
|
|
17546
|
-
var templateObject_1$
|
|
17573
|
+
var CheckIconWrapper = styled.div(templateObject_2$o || (templateObject_2$o = __makeTemplateObject$1(["\n position: absolute;\n top: 0;\n right: 0;\n"], ["\n position: absolute;\n top: 0;\n right: 0;\n"])));
|
|
17574
|
+
var templateObject_1$s, templateObject_2$o;
|
|
17547
17575
|
|
|
17548
|
-
var Key$
|
|
17576
|
+
var Key$2 = 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: {
|
|
17549
17577
|
marginTop: "13px",
|
|
17550
17578
|
transform: "scale(2)",
|
|
17551
17579
|
} }, { 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 })))] }))); };
|
|
17552
17580
|
|
|
17553
|
-
var Wrapper$2 = styled.a(templateObject_1$
|
|
17581
|
+
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) {
|
|
17554
17582
|
var chevron = _a.chevron;
|
|
17555
17583
|
return (chevron === "left" ? "4px" : "");
|
|
17556
17584
|
}, function (_a) {
|
|
17557
17585
|
var chevron = _a.chevron;
|
|
17558
17586
|
return (chevron === "right" ? "4px" : "");
|
|
17559
17587
|
});
|
|
17560
|
-
var StyledLink = styled(StyledParagraph)(templateObject_2$
|
|
17561
|
-
var templateObject_1$
|
|
17588
|
+
var StyledLink = styled(StyledParagraph)(templateObject_2$n || (templateObject_2$n = __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);
|
|
17589
|
+
var templateObject_1$r, templateObject_2$n;
|
|
17562
17590
|
|
|
17563
17591
|
var Link = function (props) {
|
|
17564
17592
|
var onClick = function (e) {
|
|
@@ -17570,13 +17598,13 @@ var Link = function (props) {
|
|
|
17570
17598
|
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" }))] })));
|
|
17571
17599
|
};
|
|
17572
17600
|
|
|
17573
|
-
var Container$
|
|
17601
|
+
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) {
|
|
17574
17602
|
var text = _a.text;
|
|
17575
17603
|
return (text ? "20px" : "");
|
|
17576
17604
|
});
|
|
17577
|
-
var templateObject_1$
|
|
17605
|
+
var templateObject_1$q;
|
|
17578
17606
|
|
|
17579
|
-
var Loading = function (props) { return (jsxs(Container$
|
|
17607
|
+
var Loading = function (props) { return (jsxs(Container$e, __assign$2({}, props, { children: [jsx$1(_default$1, { 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 }))] }))] }))); };
|
|
17580
17608
|
|
|
17581
17609
|
var mappers = {};
|
|
17582
17610
|
|
|
@@ -17584,13 +17612,13 @@ var getCountryByLocale$1 = {};
|
|
|
17584
17612
|
|
|
17585
17613
|
Object.defineProperty(getCountryByLocale$1, "__esModule", { value: true });
|
|
17586
17614
|
getCountryByLocale$1.getCountryByLocale = void 0;
|
|
17587
|
-
var enums_1$
|
|
17615
|
+
var enums_1$3 = enums;
|
|
17588
17616
|
var getCountryByLocale = function (locale) {
|
|
17589
17617
|
var _a;
|
|
17590
17618
|
var countries = (_a = {},
|
|
17591
|
-
_a[enums_1$
|
|
17592
|
-
_a[enums_1$
|
|
17593
|
-
_a[enums_1$
|
|
17619
|
+
_a[enums_1$3.Locale.NL_NL] = enums_1$3.Country.NL,
|
|
17620
|
+
_a[enums_1$3.Locale.NL_BE] = enums_1$3.Country.BE,
|
|
17621
|
+
_a[enums_1$3.Locale.EN_GB] = enums_1$3.Country.GB,
|
|
17594
17622
|
_a);
|
|
17595
17623
|
return countries[locale];
|
|
17596
17624
|
};
|
|
@@ -17600,13 +17628,13 @@ var getCurrencyByLocale$1 = {};
|
|
|
17600
17628
|
|
|
17601
17629
|
Object.defineProperty(getCurrencyByLocale$1, "__esModule", { value: true });
|
|
17602
17630
|
getCurrencyByLocale$1.getCurrencyByLocale = void 0;
|
|
17603
|
-
var enums_1$
|
|
17631
|
+
var enums_1$2 = enums;
|
|
17604
17632
|
var getCurrencyByLocale = function (locale) {
|
|
17605
17633
|
var _a;
|
|
17606
17634
|
var currencies = (_a = {},
|
|
17607
|
-
_a[enums_1$
|
|
17608
|
-
_a[enums_1$
|
|
17609
|
-
_a[enums_1$
|
|
17635
|
+
_a[enums_1$2.Locale.NL_NL] = enums_1$2.Currency.EUR,
|
|
17636
|
+
_a[enums_1$2.Locale.NL_BE] = enums_1$2.Currency.EUR,
|
|
17637
|
+
_a[enums_1$2.Locale.EN_GB] = enums_1$2.Currency.GBP,
|
|
17610
17638
|
_a);
|
|
17611
17639
|
return currencies[locale];
|
|
17612
17640
|
};
|
|
@@ -17616,13 +17644,13 @@ var getKeyboardLayoutByLocale$1 = {};
|
|
|
17616
17644
|
|
|
17617
17645
|
Object.defineProperty(getKeyboardLayoutByLocale$1, "__esModule", { value: true });
|
|
17618
17646
|
getKeyboardLayoutByLocale$1.getKeyboardLayoutByLocale = void 0;
|
|
17619
|
-
var enums_1$
|
|
17647
|
+
var enums_1$1 = enums;
|
|
17620
17648
|
var getKeyboardLayoutByLocale = function (locale) {
|
|
17621
17649
|
var _a;
|
|
17622
17650
|
var keyboardLayouts = (_a = {},
|
|
17623
|
-
_a[enums_1$
|
|
17624
|
-
_a[enums_1$
|
|
17625
|
-
_a[enums_1$
|
|
17651
|
+
_a[enums_1$1.Locale.NL_NL] = enums_1$1.KeyboardLayout.QWERTY_NL,
|
|
17652
|
+
_a[enums_1$1.Locale.NL_BE] = enums_1$1.KeyboardLayout.AZERTY_BE,
|
|
17653
|
+
_a[enums_1$1.Locale.EN_GB] = enums_1$1.KeyboardLayout.QWERTY_UK,
|
|
17626
17654
|
_a);
|
|
17627
17655
|
return keyboardLayouts[locale];
|
|
17628
17656
|
};
|
|
@@ -17632,45 +17660,18 @@ var getNativeLanguageByLocale$1 = {};
|
|
|
17632
17660
|
|
|
17633
17661
|
Object.defineProperty(getNativeLanguageByLocale$1, "__esModule", { value: true });
|
|
17634
17662
|
getNativeLanguageByLocale$1.getNativeLanguageByLocale = void 0;
|
|
17635
|
-
var enums_1
|
|
17663
|
+
var enums_1 = enums;
|
|
17636
17664
|
var getNativeLanguageByLocale = function (locale) {
|
|
17637
17665
|
var _a;
|
|
17638
17666
|
var nativeLanguages = (_a = {},
|
|
17639
|
-
_a[enums_1
|
|
17640
|
-
_a[enums_1
|
|
17641
|
-
_a[enums_1
|
|
17667
|
+
_a[enums_1.Locale.NL_NL] = "Nederlands",
|
|
17668
|
+
_a[enums_1.Locale.NL_BE] = "Nederlands (BE)",
|
|
17669
|
+
_a[enums_1.Locale.EN_GB] = "English (UK)",
|
|
17642
17670
|
_a);
|
|
17643
17671
|
return nativeLanguages[locale];
|
|
17644
17672
|
};
|
|
17645
17673
|
getNativeLanguageByLocale$1.getNativeLanguageByLocale = getNativeLanguageByLocale;
|
|
17646
17674
|
|
|
17647
|
-
var getPricing$1 = {};
|
|
17648
|
-
|
|
17649
|
-
Object.defineProperty(getPricing$1, "__esModule", { value: true });
|
|
17650
|
-
getPricing$1.getPricing = void 0;
|
|
17651
|
-
var enums_1 = enums;
|
|
17652
|
-
var getPricing = function (currency) {
|
|
17653
|
-
var _a, _b, _c, _d;
|
|
17654
|
-
var plans = (_a = {},
|
|
17655
|
-
_a[enums_1.Plan.HOBBY] = (_b = {},
|
|
17656
|
-
_b[enums_1.Currency.EUR] = 0,
|
|
17657
|
-
_b[enums_1.Currency.GBP] = 0,
|
|
17658
|
-
_b[enums_1.Currency.USD] = 0,
|
|
17659
|
-
_b),
|
|
17660
|
-
_a[enums_1.Plan.PROFESSIONAL] = (_c = {},
|
|
17661
|
-
_c[enums_1.Currency.EUR] = 14.95,
|
|
17662
|
-
_c[enums_1.Currency.GBP] = 12.95,
|
|
17663
|
-
_c[enums_1.Currency.USD] = 15.95,
|
|
17664
|
-
_c),
|
|
17665
|
-
_a);
|
|
17666
|
-
var pricing = (_d = {},
|
|
17667
|
-
_d[enums_1.Plan.HOBBY] = plans.hobby[currency],
|
|
17668
|
-
_d[enums_1.Plan.PROFESSIONAL] = plans.professional[currency],
|
|
17669
|
-
_d);
|
|
17670
|
-
return pricing;
|
|
17671
|
-
};
|
|
17672
|
-
getPricing$1.getPricing = getPricing;
|
|
17673
|
-
|
|
17674
17675
|
(function (exports) {
|
|
17675
17676
|
var __createBinding = (commonjsGlobal && commonjsGlobal.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
17676
17677
|
if (k2 === undefined) k2 = k;
|
|
@@ -17691,12 +17692,11 @@ __exportStar(getCountryByLocale$1, exports);
|
|
|
17691
17692
|
__exportStar(getCurrencyByLocale$1, exports);
|
|
17692
17693
|
__exportStar(getKeyboardLayoutByLocale$1, exports);
|
|
17693
17694
|
__exportStar(getNativeLanguageByLocale$1, exports);
|
|
17694
|
-
__exportStar(getPricing$1, exports);
|
|
17695
17695
|
|
|
17696
17696
|
}(mappers));
|
|
17697
17697
|
|
|
17698
|
-
var Button = styled.button(templateObject_1$
|
|
17699
|
-
var templateObject_1$
|
|
17698
|
+
var Button = styled.button(templateObject_1$p || (templateObject_1$p = __makeTemplateObject$1(["\n all: unset;\n height: 46px;\n box-sizing: border-box;\n padding: 10px 15px;\n background-color: ", ";\n border-radius: 6px;\n border: 1px solid ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 10%);\n\n display: flex;\n align-items: center;\n gap: 10px;\n\n svg {\n pointer-events: none;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n }\n"], ["\n all: unset;\n height: 46px;\n box-sizing: border-box;\n padding: 10px 15px;\n background-color: ", ";\n border-radius: 6px;\n border: 1px solid ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 10%);\n\n display: flex;\n align-items: center;\n gap: 10px;\n\n svg {\n pointer-events: none;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n }\n"])), theme.colors.lightGray.light, theme.colors.lightGray.dark, theme.colors.lightGray.base);
|
|
17699
|
+
var templateObject_1$p;
|
|
17700
17700
|
|
|
17701
17701
|
var LocaleSelect = function (props) {
|
|
17702
17702
|
var _a = useState(props.defaultValue), selectedLocale = _a[0], setSelectedLocale = _a[1];
|
|
@@ -17712,17 +17712,17 @@ var LocaleSelect = function (props) {
|
|
|
17712
17712
|
}); }) }, { children: jsxs(Button, { children: [jsx$1(Flag, { locale: selectedLocale }), !props.iconOnly && (jsx$1(Heading, __assign$2({ type: "h6", as: "span" }, { children: mappers.getNativeLanguageByLocale(selectedLocale) })))] }) })));
|
|
17713
17713
|
};
|
|
17714
17714
|
|
|
17715
|
-
var Wrapper$1 = styled.div(templateObject_1$
|
|
17716
|
-
var templateObject_1$
|
|
17715
|
+
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"])));
|
|
17716
|
+
var templateObject_1$o;
|
|
17717
17717
|
|
|
17718
17718
|
var Medals = function (props) { return (jsxs(Wrapper$1, { children: [jsxs("div", { children: [jsx$1(Medal, { type: enums.Medal.GOLD }), jsx$1(Spacer, { horizontal: 5 }), jsxs(Heading, __assign$2({ type: "h6" }, { children: ["x ", props.gold || 0] }))] }), jsxs("div", { children: [jsx$1(Medal, { type: enums.Medal.SILVER }), jsx$1(Spacer, { horizontal: 5 }), jsxs(Heading, __assign$2({ type: "h6" }, { children: ["x ", props.silver || 0] }))] }), jsxs("div", { children: [jsx$1(Medal, { type: enums.Medal.BRONZE }), jsx$1(Spacer, { horizontal: 5 }), jsxs(Heading, __assign$2({ type: "h6" }, { children: ["x ", props.bronze || 0] }))] })] })); };
|
|
17719
17719
|
|
|
17720
|
-
var NotificationContainer = styled.div(templateObject_1$
|
|
17720
|
+
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) {
|
|
17721
17721
|
var contrast = _a.contrast;
|
|
17722
17722
|
return contrast ? theme.colors.lightGray.light : theme.colors.lightGray.base;
|
|
17723
17723
|
});
|
|
17724
|
-
var ButtonContainer = styled.div(templateObject_2$
|
|
17725
|
-
var templateObject_1$
|
|
17724
|
+
var ButtonContainer = styled.div(templateObject_2$m || (templateObject_2$m = __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"])));
|
|
17725
|
+
var templateObject_1$n, templateObject_2$m;
|
|
17726
17726
|
|
|
17727
17727
|
var Notification = function (props) {
|
|
17728
17728
|
if (!props.isVisible)
|
|
@@ -17730,9 +17730,9 @@ var Notification = function (props) {
|
|
|
17730
17730
|
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$1, __assign$2({}, button, { size: "small", color: index + 1 === props.buttons.length ? "blue" : "white", key: "button-".concat(index) }))); }) }))] })));
|
|
17731
17731
|
};
|
|
17732
17732
|
|
|
17733
|
-
var Container$
|
|
17734
|
-
var Label$8 = styled(StyledParagraph)(templateObject_2$
|
|
17735
|
-
var templateObject_1$
|
|
17733
|
+
var Container$d = 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"])));
|
|
17734
|
+
var Label$8 = styled(StyledParagraph)(templateObject_2$l || (templateObject_2$l = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
17735
|
+
var templateObject_1$m, templateObject_2$l;
|
|
17736
17736
|
|
|
17737
17737
|
var NumberField = function (props) {
|
|
17738
17738
|
var onChange = function (value) {
|
|
@@ -17743,12 +17743,12 @@ var NumberField = function (props) {
|
|
|
17743
17743
|
if (props.onBlur)
|
|
17744
17744
|
props.onBlur(props.name);
|
|
17745
17745
|
};
|
|
17746
|
-
return (jsxs(Container$
|
|
17746
|
+
return (jsxs(Container$d, { children: [jsx$1(Label$8, __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 })] }));
|
|
17747
17747
|
};
|
|
17748
17748
|
|
|
17749
|
-
var Container$
|
|
17750
|
-
var Label$7 = styled(StyledParagraph)(templateObject_2$
|
|
17751
|
-
var templateObject_1$
|
|
17749
|
+
var Container$c = 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"])));
|
|
17750
|
+
var Label$7 = styled(StyledParagraph)(templateObject_2$k || (templateObject_2$k = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
17751
|
+
var templateObject_1$l, templateObject_2$k;
|
|
17752
17752
|
|
|
17753
17753
|
var PasswordInputField = function (props) {
|
|
17754
17754
|
var onChange = function (value) {
|
|
@@ -17764,10 +17764,10 @@ var PasswordInputField = function (props) {
|
|
|
17764
17764
|
if (props.onBlur)
|
|
17765
17765
|
props.onBlur(props.name);
|
|
17766
17766
|
};
|
|
17767
|
-
return (jsxs(Container$
|
|
17767
|
+
return (jsxs(Container$c, { children: [jsx$1(Label$7, __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 })] }));
|
|
17768
17768
|
};
|
|
17769
17769
|
|
|
17770
|
-
var PopupContainer = styled.div(templateObject_1$
|
|
17770
|
+
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: 1px solid ", ";\n background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n pointer-events: none;\n z-index: 9;\n\n ", ";\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: 1px solid ", ";\n background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n pointer-events: none;\n z-index: 9;\n\n ", ";\n"])), function (_a) {
|
|
17771
17771
|
var isVisible = _a.isVisible;
|
|
17772
17772
|
return (isVisible ? "100%" : "0%");
|
|
17773
17773
|
}, function (_a) {
|
|
@@ -17784,7 +17784,7 @@ var PopupContainer = styled.div(templateObject_1$j || (templateObject_1$j = __ma
|
|
|
17784
17784
|
return noStyle &&
|
|
17785
17785
|
"\n max-width: 100%;\n padding: 0;\n border-radius: 0;\n border: none;\n background-color: transparent;\n box-shadow: none;\n ";
|
|
17786
17786
|
});
|
|
17787
|
-
var templateObject_1$
|
|
17787
|
+
var templateObject_1$k;
|
|
17788
17788
|
|
|
17789
17789
|
var Popup = function (props) {
|
|
17790
17790
|
var popupRef = useRef(null);
|
|
@@ -17826,25 +17826,25 @@ var Popup = function (props) {
|
|
|
17826
17826
|
props.content] }))] }));
|
|
17827
17827
|
};
|
|
17828
17828
|
|
|
17829
|
-
var Wrapper = styled.div(templateObject_1$
|
|
17830
|
-
var StyledProgressBar = styled.div(templateObject_2$
|
|
17829
|
+
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"])));
|
|
17830
|
+
var StyledProgressBar = styled.div(templateObject_2$j || (templateObject_2$j = __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) {
|
|
17831
17831
|
var showInfo = _a.showInfo;
|
|
17832
17832
|
return (showInfo ? "10px" : "");
|
|
17833
17833
|
});
|
|
17834
|
-
var Indicator$1 = styled.div(templateObject_3$
|
|
17834
|
+
var Indicator$1 = styled.div(templateObject_3$a || (templateObject_3$a = __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) {
|
|
17835
17835
|
var percent = _a.percent;
|
|
17836
17836
|
return "calc(".concat(percent, "% - 6px)");
|
|
17837
17837
|
}, function (_a) {
|
|
17838
17838
|
var color = _a.color;
|
|
17839
17839
|
return color ? theme.colors[color].base : theme.colors.green.base;
|
|
17840
17840
|
});
|
|
17841
|
-
var templateObject_1$
|
|
17841
|
+
var templateObject_1$j, templateObject_2$j, templateObject_3$a;
|
|
17842
17842
|
|
|
17843
17843
|
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, "%") })))] })); };
|
|
17844
17844
|
|
|
17845
|
-
var Container$
|
|
17846
|
-
var Step$2 = styled.li(templateObject_2$
|
|
17847
|
-
var Dot$2 = styled.div(templateObject_3$
|
|
17845
|
+
var Container$b = styled.ol(templateObject_1$i || (templateObject_1$i = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n gap: 20px;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n list-style-type: none;\n position: relative;\n\n :after {\n content: \"\";\n height: 4px;\n width: 100%;\n background-color: ", ";\n position: absolute;\n top: 14px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n gap: 20px;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n list-style-type: none;\n position: relative;\n\n :after {\n content: \"\";\n height: 4px;\n width: 100%;\n background-color: ", ";\n position: absolute;\n top: 14px;\n }\n"])), theme.colors.lightGray.dark);
|
|
17846
|
+
var Step$2 = styled.li(templateObject_2$i || (templateObject_2$i = __makeTemplateObject$1(["\n z-index: 1;\n\n p {\n margin-top: 10px;\n }\n"], ["\n z-index: 1;\n\n p {\n margin-top: 10px;\n }\n"])));
|
|
17847
|
+
var Dot$2 = styled.div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject$1(["\n width: 32px;\n height: 32px;\n border-radius: 50%;\n outline: 10px solid ", ";\n cursor: ", ";\n\n background-color: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n :hover {\n background-color: ", ";\n }\n\n > div {\n pointer-events: none;\n }\n"], ["\n width: 32px;\n height: 32px;\n border-radius: 50%;\n outline: 10px solid ", ";\n cursor: ", ";\n\n background-color: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n :hover {\n background-color: ", ";\n }\n\n > div {\n pointer-events: none;\n }\n"])), theme.colors.lightGray.light, function (_a) {
|
|
17848
17848
|
var status = _a.status;
|
|
17849
17849
|
return status === "passed" ? "pointer" : "not-allowed";
|
|
17850
17850
|
}, function (_a) {
|
|
@@ -17868,9 +17868,9 @@ var Dot$2 = styled.div(templateObject_3$8 || (templateObject_3$8 = __makeTemplat
|
|
|
17868
17868
|
return theme.colors.lightGray.base;
|
|
17869
17869
|
}
|
|
17870
17870
|
});
|
|
17871
|
-
var templateObject_1$
|
|
17871
|
+
var templateObject_1$i, templateObject_2$i, templateObject_3$9;
|
|
17872
17872
|
|
|
17873
|
-
var Steps$2 = function (props) { return (jsx$1(Container$
|
|
17873
|
+
var Steps$2 = function (props) { return (jsx$1(Container$b, { children: props.steps.map(function (_a, index) {
|
|
17874
17874
|
var title = _a.title, onClick = _a.onClick;
|
|
17875
17875
|
var step = index + 1;
|
|
17876
17876
|
var status = props.current > step
|
|
@@ -17885,8 +17885,8 @@ var Steps$2 = function (props) { return (jsx$1(Container$a, { children: props.st
|
|
|
17885
17885
|
return (jsxs(Step$2, { children: [jsx$1(Dot$2, __assign$2({ status: status, onClick: onClickStep }, { children: status === "passed" ? (jsx$1(Icon, { type: "check", size: "small", color: "white" })) : (jsx$1(Heading, __assign$2({ type: "h6", color: status === "active" ? "white" : "gray" }, { children: step }))) })), title && jsx$1(Paragraph, { children: title })] }, "step-".concat(step)));
|
|
17886
17886
|
}) })); };
|
|
17887
17887
|
|
|
17888
|
-
var Container$
|
|
17889
|
-
var Step$1 = styled.li(templateObject_2$
|
|
17888
|
+
var Container$a = 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"])));
|
|
17889
|
+
var Step$1 = styled.li(templateObject_2$h || (templateObject_2$h = __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 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 p {\n color: ", ";\n }\n\n :hover {\n background-color: ", ";\n }\n"])), theme.colors.lightGray.dark, function (_a) {
|
|
17890
17890
|
var status = _a.status;
|
|
17891
17891
|
return (!!status ? "pointer" : "not-allowed");
|
|
17892
17892
|
}, function (_a) {
|
|
@@ -17900,9 +17900,9 @@ var Step$1 = styled.li(templateObject_2$g || (templateObject_2$g = __makeTemplat
|
|
|
17900
17900
|
return theme.colors.lightGray.dark;
|
|
17901
17901
|
}
|
|
17902
17902
|
}, theme.colors.darkGray.base, theme.colors.lightGray.base);
|
|
17903
|
-
var templateObject_1$
|
|
17903
|
+
var templateObject_1$h, templateObject_2$h;
|
|
17904
17904
|
|
|
17905
|
-
var Steps$1 = function (props) { return (jsx$1(Container$
|
|
17905
|
+
var Steps$1 = function (props) { return (jsx$1(Container$a, { children: props.steps.map(function (_a, index) {
|
|
17906
17906
|
var title = _a.title, onClick = _a.onClick;
|
|
17907
17907
|
var step = index + 1;
|
|
17908
17908
|
var status = props.current > step
|
|
@@ -17921,15 +17921,15 @@ var Steps = function (props) {
|
|
|
17921
17921
|
return props.alignment === "vertical" ? (jsx$1(Steps$1, __assign$2({}, props))) : (jsx$1(Steps$2, __assign$2({}, props)));
|
|
17922
17922
|
};
|
|
17923
17923
|
|
|
17924
|
-
var TabsContainer$1 = styled.div(templateObject_1$
|
|
17925
|
-
var Tab$1 = styled.div(templateObject_2$
|
|
17924
|
+
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);
|
|
17925
|
+
var Tab$1 = styled.div(templateObject_2$g || (templateObject_2$g = __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) {
|
|
17926
17926
|
var isActive = _a.isActive;
|
|
17927
17927
|
return isActive ? "3px solid ".concat(theme.colors.blue.base) : "";
|
|
17928
17928
|
}, function (_a) {
|
|
17929
17929
|
var isActive = _a.isActive;
|
|
17930
17930
|
return isActive ? theme.colors.blue.base : "";
|
|
17931
17931
|
}, theme.colors.blue.base);
|
|
17932
|
-
var templateObject_1$
|
|
17932
|
+
var templateObject_1$g, templateObject_2$g;
|
|
17933
17933
|
|
|
17934
17934
|
var Tabs$2 = function (_a) {
|
|
17935
17935
|
var items = _a.items, activeKey = _a.activeKey, onChange = _a.onChange;
|
|
@@ -17949,15 +17949,15 @@ var Tabs$2 = function (_a) {
|
|
|
17949
17949
|
}) }));
|
|
17950
17950
|
};
|
|
17951
17951
|
|
|
17952
|
-
var TabsContainer = styled.div(templateObject_1$
|
|
17953
|
-
var Tab = styled.div(templateObject_2$
|
|
17952
|
+
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);
|
|
17953
|
+
var Tab = styled.div(templateObject_2$f || (templateObject_2$f = __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) {
|
|
17954
17954
|
var isActive = _a.isActive;
|
|
17955
17955
|
return (isActive ? "block" : "none");
|
|
17956
17956
|
}, theme.colors.blue.base, function (_a) {
|
|
17957
17957
|
var isActive = _a.isActive;
|
|
17958
17958
|
return isActive ? theme.colors.blue.base : "";
|
|
17959
17959
|
}, theme.colors.blue.base);
|
|
17960
|
-
var templateObject_1$
|
|
17960
|
+
var templateObject_1$f, templateObject_2$f;
|
|
17961
17961
|
|
|
17962
17962
|
var Tabs$1 = function (_a) {
|
|
17963
17963
|
var items = _a.items, activeKey = _a.activeKey, onChange = _a.onChange;
|
|
@@ -17981,14 +17981,14 @@ var Tabs = function (props) {
|
|
|
17981
17981
|
return props.alignment === "vertical" ? (jsx$1(Tabs$1, __assign$2({}, props))) : (jsx$1(Tabs$2, __assign$2({}, props)));
|
|
17982
17982
|
};
|
|
17983
17983
|
|
|
17984
|
-
var Fieldset = styled.fieldset(templateObject_1$
|
|
17985
|
-
var RadioContainer = styled.div(templateObject_2$
|
|
17986
|
-
var RadioWrapper = styled.div(templateObject_3$
|
|
17987
|
-
var Label$6 = styled(StyledParagraph)(templateObject_4$
|
|
17984
|
+
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"])));
|
|
17985
|
+
var RadioContainer = styled.div(templateObject_2$e || (templateObject_2$e = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
|
|
17986
|
+
var RadioWrapper = styled.div(templateObject_3$8 || (templateObject_3$8 = __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"])));
|
|
17987
|
+
var Label$6 = styled(StyledParagraph)(templateObject_4$5 || (templateObject_4$5 = __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) {
|
|
17988
17988
|
var weight = _a.weight;
|
|
17989
17989
|
return weight || 500;
|
|
17990
17990
|
}, theme.colors.darkGray.base);
|
|
17991
|
-
var templateObject_1$
|
|
17991
|
+
var templateObject_1$e, templateObject_2$e, templateObject_3$8, templateObject_4$5;
|
|
17992
17992
|
|
|
17993
17993
|
var RadioGroup = function (props) {
|
|
17994
17994
|
var onChange = function (value) {
|
|
@@ -18005,9 +18005,9 @@ var RadioGroup = function (props) {
|
|
|
18005
18005
|
}) })] }));
|
|
18006
18006
|
};
|
|
18007
18007
|
|
|
18008
|
-
var Container$
|
|
18009
|
-
var Label$5 = styled(StyledParagraph)(templateObject_2$
|
|
18010
|
-
var templateObject_1$
|
|
18008
|
+
var Container$9 = 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"])));
|
|
18009
|
+
var Label$5 = styled(StyledParagraph)(templateObject_2$d || (templateObject_2$d = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
18010
|
+
var templateObject_1$d, templateObject_2$d;
|
|
18011
18011
|
|
|
18012
18012
|
var SelectField = function (props) {
|
|
18013
18013
|
var onChange = function (value) {
|
|
@@ -18018,15 +18018,15 @@ var SelectField = function (props) {
|
|
|
18018
18018
|
if (props.onBlur)
|
|
18019
18019
|
props.onBlur(props.name);
|
|
18020
18020
|
};
|
|
18021
|
-
return (jsxs(Container$
|
|
18021
|
+
return (jsxs(Container$9, { children: [jsx$1(Label$5, __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) {
|
|
18022
18022
|
var value = _a.value, label = _a.label;
|
|
18023
18023
|
return (jsx$1("option", __assign$2({ value: value }, { children: label }), "".concat(value, "-").concat(value)));
|
|
18024
18024
|
}) }))] }));
|
|
18025
18025
|
};
|
|
18026
18026
|
|
|
18027
|
-
var Container$
|
|
18028
|
-
var Label$4 = styled(StyledParagraph)(templateObject_2$
|
|
18029
|
-
var templateObject_1$
|
|
18027
|
+
var Container$8 = 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"])));
|
|
18028
|
+
var Label$4 = styled(StyledParagraph)(templateObject_2$c || (templateObject_2$c = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
18029
|
+
var templateObject_1$c, templateObject_2$c;
|
|
18030
18030
|
|
|
18031
18031
|
var ToggleField = function (props) {
|
|
18032
18032
|
var onChange = function (value) {
|
|
@@ -18037,10 +18037,10 @@ var ToggleField = function (props) {
|
|
|
18037
18037
|
if (props.onBlur)
|
|
18038
18038
|
props.onBlur(props.name);
|
|
18039
18039
|
};
|
|
18040
|
-
return (jsxs(Container$
|
|
18040
|
+
return (jsxs(Container$8, { children: [jsx$1(Label$4, __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 })] }));
|
|
18041
18041
|
};
|
|
18042
18042
|
|
|
18043
|
-
var TooltipContainer = styled.div(templateObject_1$
|
|
18043
|
+
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) {
|
|
18044
18044
|
var isVisible = _a.isVisible;
|
|
18045
18045
|
return (isVisible ? "100%" : "0%");
|
|
18046
18046
|
}, function (_a) {
|
|
@@ -18050,7 +18050,7 @@ var TooltipContainer = styled.div(templateObject_1$a || (templateObject_1$a = __
|
|
|
18050
18050
|
var x = _a.x;
|
|
18051
18051
|
return (x ? "".concat(x, "px") : "");
|
|
18052
18052
|
});
|
|
18053
|
-
var TooltipTitle = styled.div(templateObject_2$
|
|
18053
|
+
var TooltipTitle = styled.div(templateObject_2$b || (templateObject_2$b = __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) {
|
|
18054
18054
|
var color = _a.color;
|
|
18055
18055
|
switch (color) {
|
|
18056
18056
|
default:
|
|
@@ -18060,7 +18060,7 @@ var TooltipTitle = styled.div(templateObject_2$a || (templateObject_2$a = __make
|
|
|
18060
18060
|
return theme.colors.lightGray.dark;
|
|
18061
18061
|
}
|
|
18062
18062
|
});
|
|
18063
|
-
var templateObject_1$
|
|
18063
|
+
var templateObject_1$b, templateObject_2$b;
|
|
18064
18064
|
|
|
18065
18065
|
var Tooltip$2 = function (props) {
|
|
18066
18066
|
var tooltipRef = useRef(null);
|
|
@@ -47880,13 +47880,13 @@ var xAxis = {
|
|
|
47880
47880
|
domain: ["dataMin", "dataMax"],
|
|
47881
47881
|
};
|
|
47882
47882
|
|
|
47883
|
-
var Container$
|
|
47884
|
-
var Label$2 = styled.div(templateObject_2$
|
|
47885
|
-
var Dot = styled.div(templateObject_3$
|
|
47883
|
+
var Container$7 = styled.div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject$1(["\n padding: 10px 15px 6px;\n background-color: ", ";\n border: 1px solid ", ";\n box-shadow: 0px 3px 0px rgba(0, 0, 0, 20%);\n border-radius: 4px;\n box-sizing: border-box;\n"], ["\n padding: 10px 15px 6px;\n background-color: ", ";\n border: 1px solid ", ";\n box-shadow: 0px 3px 0px rgba(0, 0, 0, 20%);\n border-radius: 4px;\n box-sizing: border-box;\n"])), theme.colors.lightGray.light, theme.colors.lightGray.dark);
|
|
47884
|
+
var Label$2 = styled.div(templateObject_2$a || (templateObject_2$a = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n align-items: baseline;\n gap: 15px;\n\n > div:first-child {\n display: flex;\n gap: 10px;\n align-items: baseline;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: baseline;\n gap: 15px;\n\n > div:first-child {\n display: flex;\n gap: 10px;\n align-items: baseline;\n }\n"])));
|
|
47885
|
+
var Dot = styled.div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject$1(["\n width: 10px;\n min-width: 10px;\n height: 10px;\n min-height: 10px;\n border-radius: 50%;\n background-color: ", ";\n"], ["\n width: 10px;\n min-width: 10px;\n height: 10px;\n min-height: 10px;\n border-radius: 50%;\n background-color: ", ";\n"])), function (_a) {
|
|
47886
47886
|
var color = _a.color;
|
|
47887
47887
|
return color;
|
|
47888
47888
|
});
|
|
47889
|
-
var templateObject_1$
|
|
47889
|
+
var templateObject_1$a, templateObject_2$a, templateObject_3$7;
|
|
47890
47890
|
|
|
47891
47891
|
var Tooltip = function (_a) {
|
|
47892
47892
|
var active = _a.active, label = _a.label, payload = _a.payload, locale = _a.locale, period = _a.period, valueFormatter = _a.valueFormatter;
|
|
@@ -47917,7 +47917,7 @@ var Tooltip = function (_a) {
|
|
|
47917
47917
|
return "".concat(format$1(fromUnixTime(label), "MMMM", options));
|
|
47918
47918
|
}
|
|
47919
47919
|
};
|
|
47920
|
-
return (jsxs(Container$
|
|
47920
|
+
return (jsxs(Container$7, { children: [payload.map(function (_a, index) {
|
|
47921
47921
|
var name = _a.name, value = _a.value, stroke = _a.stroke;
|
|
47922
47922
|
return (jsxs(Label$2, { children: [jsxs("div", { children: [jsx$1(Dot, { color: stroke }), jsx$1(Paragraph, __assign$2({ size: "small" }, { children: translations[locale][name] }))] }), jsx$1(Paragraph, __assign$2({ size: "small", color: "darkGray" }, { children: valueFormatter ? valueFormatter(parseInt("".concat(value))) : value }))] }, "".concat(name, "-").concat(value, "-").concat(index)));
|
|
47923
47923
|
}), jsx$1(Spacer, { vertical: 5 }), jsx$1(Paragraph, __assign$2({ size: "small", weight: "regular" }, { children: renderLabel() }))] }));
|
|
@@ -48123,9 +48123,9 @@ var Chart = function (_a) {
|
|
|
48123
48123
|
}) }), period))] }))), renderChart()] }));
|
|
48124
48124
|
};
|
|
48125
48125
|
|
|
48126
|
-
var Container$
|
|
48127
|
-
var Label$1 = styled(StyledParagraph)(templateObject_2$
|
|
48128
|
-
var templateObject_1$
|
|
48126
|
+
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"])));
|
|
48127
|
+
var Label$1 = styled(StyledParagraph)(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
48128
|
+
var templateObject_1$9, templateObject_2$9;
|
|
48129
48129
|
|
|
48130
48130
|
var TextareaField = function (props) {
|
|
48131
48131
|
var onChange = function (value) {
|
|
@@ -48136,12 +48136,12 @@ var TextareaField = function (props) {
|
|
|
48136
48136
|
if (props.onBlur)
|
|
48137
48137
|
props.onBlur(props.name);
|
|
48138
48138
|
};
|
|
48139
|
-
return (jsxs(Container$
|
|
48139
|
+
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))); })] })))] }));
|
|
48140
48140
|
};
|
|
48141
48141
|
|
|
48142
|
-
var Container$
|
|
48143
|
-
var Label = styled(StyledParagraph)(templateObject_2$
|
|
48144
|
-
var templateObject_1$
|
|
48142
|
+
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"])));
|
|
48143
|
+
var Label = 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);
|
|
48144
|
+
var templateObject_1$8, templateObject_2$8;
|
|
48145
48145
|
|
|
48146
48146
|
var RangeField = function (props) {
|
|
48147
48147
|
var onChange = function (value) {
|
|
@@ -48152,25 +48152,25 @@ var RangeField = function (props) {
|
|
|
48152
48152
|
if (props.onBlur)
|
|
48153
48153
|
props.onBlur(props.name);
|
|
48154
48154
|
};
|
|
48155
|
-
return (jsxs(Container$
|
|
48155
|
+
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 })] }));
|
|
48156
48156
|
};
|
|
48157
48157
|
|
|
48158
48158
|
var FeedbackColors = {
|
|
48159
48159
|
success: theme.colors.green.base,
|
|
48160
48160
|
error: theme.colors.red.base,
|
|
48161
48161
|
};
|
|
48162
|
-
var FieldWrapper = styled.div(templateObject_1$
|
|
48162
|
+
var FieldWrapper = styled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject$1(["\n input, textarea, select {\n border-color: ", ";\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"], ["\n input, textarea, select {\n border-color: ", ";\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"])), function (_a) {
|
|
48163
48163
|
var status = _a.status;
|
|
48164
48164
|
return FeedbackColors[status];
|
|
48165
48165
|
});
|
|
48166
|
-
var FeedbackWrapper = styled.div(templateObject_2$
|
|
48166
|
+
var FeedbackWrapper = styled.div(templateObject_2$7 || (templateObject_2$7 = __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) {
|
|
48167
48167
|
var status = _a.status;
|
|
48168
48168
|
return FeedbackColors[status];
|
|
48169
48169
|
}, function (_a) {
|
|
48170
48170
|
var status = _a.status;
|
|
48171
48171
|
return FeedbackColors[status];
|
|
48172
48172
|
});
|
|
48173
|
-
var templateObject_1$
|
|
48173
|
+
var templateObject_1$7, templateObject_2$7;
|
|
48174
48174
|
|
|
48175
48175
|
var WithValidation = function (_a) {
|
|
48176
48176
|
var status = _a.status, message = _a.message, children = _a.children;
|
|
@@ -48183,10 +48183,10 @@ var WithValidation = function (_a) {
|
|
|
48183
48183
|
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 }))] }))] })));
|
|
48184
48184
|
};
|
|
48185
48185
|
|
|
48186
|
-
var FormWrapper = styled.form(templateObject_1$
|
|
48187
|
-
var DescriptionWrapper = styled.div(templateObject_2$
|
|
48188
|
-
var ButtonWrapper = styled.div(templateObject_3$
|
|
48189
|
-
var templateObject_1$
|
|
48186
|
+
var FormWrapper = styled.form(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject$1([""], [""])));
|
|
48187
|
+
var DescriptionWrapper = styled.div(templateObject_2$6 || (templateObject_2$6 = __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);
|
|
48188
|
+
var ButtonWrapper = styled.div(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject$1(["\n padding-top: 30px;\n"], ["\n padding-top: 30px;\n"])));
|
|
48189
|
+
var templateObject_1$6, templateObject_2$6, templateObject_3$6;
|
|
48190
48190
|
|
|
48191
48191
|
var Form = forwardRef(function (props, ref) {
|
|
48192
48192
|
var _a = useState({}), values = _a[0], setValues = _a[1];
|
|
@@ -48415,11 +48415,224 @@ var Form = forwardRef(function (props, ref) {
|
|
|
48415
48415
|
}) })), props.button && (jsx$1(ButtonWrapper, { children: jsx$1(Button$1, __assign$2({}, props.button, { onClick: onSubmit, type: "button" })) }))] }));
|
|
48416
48416
|
});
|
|
48417
48417
|
|
|
48418
|
+
var Container$4 = styled.div(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject$1(["\n min-width: 720px;\n width: 100%;\n border-radius: 10px;\n padding: 15px;\n box-sizing: border-box;\n border: 1px solid ", ";\n background-color: ", ";\n box-shadow: 0 4px 0 ", ";\n\n display: flex;\n flex-direction: column;\n gap: 10px;\n"], ["\n min-width: 720px;\n width: 100%;\n border-radius: 10px;\n padding: 15px;\n box-sizing: border-box;\n border: 1px solid ", ";\n background-color: ", ";\n box-shadow: 0 4px 0 ", ";\n\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])), theme.colors.lightGray.darker, theme.colors.lightGray.base, theme.colors.lightGray.darker);
|
|
48419
|
+
var Row$1 = styled.div(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject$1(["\n min-height: 40px;\n display: grid;\n gap: 7px;\n"], ["\n min-height: 40px;\n display: grid;\n gap: 7px;\n"])));
|
|
48420
|
+
var Row1$1 = styled(Row$1)(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject$1(["\n grid-template-columns: repeat(13, 1fr) 1.75fr;\n"], ["\n grid-template-columns: repeat(13, 1fr) 1.75fr;\n"])));
|
|
48421
|
+
var Row2$1 = styled(Row$1)(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject$1(["\n grid-template-columns: 1.5fr repeat(12, 1fr) 1.25fr;\n\n > div:last-child {\n border-radius: 6px 6px 0;\n }\n"], ["\n grid-template-columns: 1.5fr repeat(12, 1fr) 1.25fr;\n\n > div:last-child {\n border-radius: 6px 6px 0;\n }\n"])));
|
|
48422
|
+
var Row3$1 = styled(Row$1)(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject$1(["\n grid-template-columns: 2fr repeat(12, 1fr) 0.75fr;\n\n > div:last-child {\n margin-top: -11px;\n border-top: none;\n border-radius: 0 0 6px 6px;\n }\n"], ["\n grid-template-columns: 2fr repeat(12, 1fr) 0.75fr;\n\n > div:last-child {\n margin-top: -11px;\n border-top: none;\n border-radius: 0 0 6px 6px;\n }\n"])));
|
|
48423
|
+
var Row4$1 = styled(Row$1)(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject$1(["\n grid-template-columns: 1.5fr repeat(11, 1fr) 2.5fr;\n"], ["\n grid-template-columns: 1.5fr repeat(11, 1fr) 2.5fr;\n"])));
|
|
48424
|
+
var Row5$1 = styled(Row$1)(templateObject_7$2 || (templateObject_7$2 = __makeTemplateObject$1(["\n grid-template-columns: 1.75fr repeat(3, 1fr) 6fr repeat(3, 1fr) 1.85fr;\n"], ["\n grid-template-columns: 1.75fr repeat(3, 1fr) 6fr repeat(3, 1fr) 1.85fr;\n"])));
|
|
48425
|
+
var Key$1 = styled.div(templateObject_8$2 || (templateObject_8$2 = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: ", ";\n\n border: 1px solid;\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n padding: 0 10px;\n\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n\n background-color: ", ";\n color: ", ";\n box-shadow: ", ";\n border-color: ", ";\n\n svg {\n fill: ", ";\n stroke: ", ";\n }\n"], ["\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: ", ";\n\n border: 1px solid;\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n padding: 0 10px;\n\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n\n background-color: ", ";\n color: ", ";\n box-shadow: ", ";\n border-color: ", ";\n\n svg {\n fill: ", ";\n stroke: ", ";\n }\n"])), function (_a) {
|
|
48426
|
+
var align = _a.align;
|
|
48427
|
+
if (!align)
|
|
48428
|
+
return "center";
|
|
48429
|
+
else if (align === "left")
|
|
48430
|
+
return "flex-start";
|
|
48431
|
+
else
|
|
48432
|
+
return "flex-end";
|
|
48433
|
+
}, theme.fonts.paragraph, theme.subheading.small.fontSize, theme.subheading.small.fontWeight, function (_a) {
|
|
48434
|
+
var color = _a.color, isActive = _a.isActive;
|
|
48435
|
+
if (isActive && color)
|
|
48436
|
+
return theme.colors[color].light;
|
|
48437
|
+
else if (color)
|
|
48438
|
+
return theme.colors.lightGray.light;
|
|
48439
|
+
else
|
|
48440
|
+
return theme.colors.lightGray.base;
|
|
48441
|
+
}, function (_a) {
|
|
48442
|
+
var color = _a.color, isActive = _a.isActive;
|
|
48443
|
+
if (isActive && color)
|
|
48444
|
+
return theme.colors[color].darker;
|
|
48445
|
+
else if (color)
|
|
48446
|
+
return theme.colors[color].dark;
|
|
48447
|
+
else
|
|
48448
|
+
return theme.colors.lightGray.darker;
|
|
48449
|
+
}, function (_a) {
|
|
48450
|
+
var color = _a.color, isActive = _a.isActive;
|
|
48451
|
+
if (isActive)
|
|
48452
|
+
return "0 2px 0 ".concat(theme.colors[color].dark);
|
|
48453
|
+
else if (color)
|
|
48454
|
+
return "0 2px 0 ".concat(theme.colors[color].base);
|
|
48455
|
+
else
|
|
48456
|
+
return "0 2px 0 ".concat(theme.colors.lightGray.darker);
|
|
48457
|
+
}, function (_a) {
|
|
48458
|
+
var color = _a.color, isActive = _a.isActive;
|
|
48459
|
+
if (isActive)
|
|
48460
|
+
return theme.colors[color].dark;
|
|
48461
|
+
else if (color)
|
|
48462
|
+
return theme.colors[color].base;
|
|
48463
|
+
else
|
|
48464
|
+
return theme.colors.lightGray.darker;
|
|
48465
|
+
}, function (_a) {
|
|
48466
|
+
var color = _a.color, isActive = _a.isActive;
|
|
48467
|
+
if (isActive && color)
|
|
48468
|
+
return theme.colors[color].darker;
|
|
48469
|
+
else if (color)
|
|
48470
|
+
return theme.colors[color].dark;
|
|
48471
|
+
else
|
|
48472
|
+
return theme.colors.lightGray.darker;
|
|
48473
|
+
}, function (_a) {
|
|
48474
|
+
var color = _a.color, isActive = _a.isActive;
|
|
48475
|
+
if (isActive && color)
|
|
48476
|
+
return theme.colors[color].darker;
|
|
48477
|
+
else if (color)
|
|
48478
|
+
return theme.colors[color].dark;
|
|
48479
|
+
else
|
|
48480
|
+
return theme.colors.lightGray.darker;
|
|
48481
|
+
});
|
|
48482
|
+
var templateObject_1$5, templateObject_2$5, templateObject_3$5, templateObject_4$4, templateObject_5$3, templateObject_6$3, templateObject_7$2, templateObject_8$2;
|
|
48483
|
+
|
|
48484
|
+
var ISOKeyboard = function (_a) {
|
|
48485
|
+
var keys = _a.keys, shiftKeys = _a.shiftKeys, activeKeys = _a.activeKeys;
|
|
48486
|
+
var containsAny = function (arr1, arr2) {
|
|
48487
|
+
return arr1.some(function (v) { return arr2.includes(v); });
|
|
48488
|
+
};
|
|
48489
|
+
return (jsxs(Container$4, { children: [jsxs(Row1$1, { children: [jsx$1(Key$1, {}), jsxs(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48490
|
+
keys[91].character,
|
|
48491
|
+
keys[45].character,
|
|
48492
|
+
]) }, { children: [keys[91].character, jsx$1("br", {}), keys[45].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48493
|
+
keys[89].character,
|
|
48494
|
+
keys[43].character,
|
|
48495
|
+
]) }, { children: [keys[89].character, jsx$1("br", {}), keys[43].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48496
|
+
keys[87].character,
|
|
48497
|
+
keys[41].character,
|
|
48498
|
+
]) }, { children: [keys[87].character, jsx$1("br", {}), keys[41].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48499
|
+
keys[85].character,
|
|
48500
|
+
keys[39].character,
|
|
48501
|
+
]) }, { children: [keys[85].character, jsx$1("br", {}), keys[39].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48502
|
+
keys[83].character,
|
|
48503
|
+
keys[37].character,
|
|
48504
|
+
]) }, { children: [keys[83].character, jsx$1("br", {}), keys[37].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48505
|
+
keys[93].character,
|
|
48506
|
+
keys[47].character,
|
|
48507
|
+
]) }, { children: [keys[93].character, jsx$1("br", {}), keys[47].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48508
|
+
keys[92].character,
|
|
48509
|
+
keys[46].character,
|
|
48510
|
+
]) }, { children: [keys[92].character, jsx$1("br", {}), keys[46].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48511
|
+
keys[82].character,
|
|
48512
|
+
keys[36].character,
|
|
48513
|
+
]) }, { children: [keys[82].character, jsx$1("br", {}), keys[36].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48514
|
+
keys[84].character,
|
|
48515
|
+
keys[38].character,
|
|
48516
|
+
]) }, { children: [keys[84].character, jsx$1("br", {}), keys[38].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48517
|
+
keys[86].character,
|
|
48518
|
+
keys[40].character,
|
|
48519
|
+
]) }, { children: [keys[86].character, jsx$1("br", {}), keys[40].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48520
|
+
keys[88].character,
|
|
48521
|
+
keys[42].character,
|
|
48522
|
+
]) }, { children: [keys[88].character, jsx$1("br", {}), keys[42].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48523
|
+
keys[90].character,
|
|
48524
|
+
keys[44].character,
|
|
48525
|
+
]) }, { children: [keys[90].character, jsx$1("br", {}), keys[44].character] })), jsx$1(Key$1, {})] }), jsxs(Row2$1, { children: [jsx$1(Key$1, {}), jsx$1(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48526
|
+
keys[67].character,
|
|
48527
|
+
keys[21].character,
|
|
48528
|
+
]) }, { children: keys[67].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48529
|
+
keys[65].character,
|
|
48530
|
+
keys[19].character,
|
|
48531
|
+
]) }, { children: keys[65].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48532
|
+
keys[63].character,
|
|
48533
|
+
keys[17].character,
|
|
48534
|
+
]) }, { children: keys[63].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48535
|
+
keys[61].character,
|
|
48536
|
+
keys[15].character,
|
|
48537
|
+
]) }, { children: keys[61].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48538
|
+
keys[71].character,
|
|
48539
|
+
keys[25].character,
|
|
48540
|
+
]) }, { children: keys[71].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48541
|
+
keys[70].character,
|
|
48542
|
+
keys[24].character,
|
|
48543
|
+
]) }, { children: keys[70].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48544
|
+
keys[60].character,
|
|
48545
|
+
keys[14].character,
|
|
48546
|
+
]) }, { children: keys[60].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48547
|
+
keys[62].character,
|
|
48548
|
+
keys[16].character,
|
|
48549
|
+
]) }, { children: keys[62].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48550
|
+
keys[64].character,
|
|
48551
|
+
keys[18].character,
|
|
48552
|
+
]) }, { children: keys[64].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48553
|
+
keys[66].character,
|
|
48554
|
+
keys[20].character,
|
|
48555
|
+
]) }, { children: keys[66].character })), jsxs(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48556
|
+
keys[69].character,
|
|
48557
|
+
keys[23].character,
|
|
48558
|
+
]) }, { children: [keys[69].character, jsx$1("br", {}), !["ğ", "q", "ü"].includes(keys[23].character) && keys[23].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48559
|
+
keys[68].character,
|
|
48560
|
+
keys[22].character,
|
|
48561
|
+
]) }, { children: [keys[68].character, jsx$1("br", {}), !["ü", "w"].includes(keys[22].character) && keys[22].character] })), jsx$1(Key$1, {})] }), jsxs(Row3$1, { children: [jsx$1(Key$1, {}), jsx$1(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48562
|
+
keys[55].character,
|
|
48563
|
+
keys[9].character,
|
|
48564
|
+
]) }, { children: keys[55].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48565
|
+
keys[53].character,
|
|
48566
|
+
keys[7].character,
|
|
48567
|
+
]) }, { children: keys[53].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48568
|
+
keys[51].character,
|
|
48569
|
+
keys[5].character,
|
|
48570
|
+
]) }, { children: keys[51].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48571
|
+
keys[49].character,
|
|
48572
|
+
keys[3].character,
|
|
48573
|
+
]) }, { children: keys[49].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48574
|
+
keys[59].character,
|
|
48575
|
+
keys[13].character,
|
|
48576
|
+
]) }, { children: keys[59].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48577
|
+
keys[58].character,
|
|
48578
|
+
keys[12].character,
|
|
48579
|
+
]) }, { children: keys[58].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48580
|
+
keys[48].character,
|
|
48581
|
+
keys[2].character,
|
|
48582
|
+
]) }, { children: keys[48].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48583
|
+
keys[50].character,
|
|
48584
|
+
keys[4].character,
|
|
48585
|
+
]) }, { children: keys[50].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48586
|
+
keys[52].character,
|
|
48587
|
+
keys[6].character,
|
|
48588
|
+
]) }, { children: keys[52].character })), jsxs(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48589
|
+
keys[54].character,
|
|
48590
|
+
keys[8].character,
|
|
48591
|
+
]) }, { children: [keys[54].character, jsx$1("br", {}), !["ş", "y", "ö", "m"].includes(keys[8].character) &&
|
|
48592
|
+
keys[8].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48593
|
+
keys[56].character,
|
|
48594
|
+
keys[10].character,
|
|
48595
|
+
]) }, { children: [keys[56].character, jsx$1("br", {}), !["i", "ş", "ä"].includes(keys[10].character) && keys[10].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48596
|
+
keys[57].character,
|
|
48597
|
+
keys[11].character,
|
|
48598
|
+
]) }, { children: [keys[57].character, jsx$1("br", {}), !["x"].includes(keys[11].character) && keys[11].character] })), jsx$1(Key$1, {})] }), jsxs(Row4$1, { children: [jsx$1(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, shiftKeys.right), align: "left" }, { children: jsx$1("svg", __assign$2({ viewBox: "0 0 50 50", width: 20, height: 20 }, { children: jsx$1("path", { d: "M22.7202 6.39735C23.9548 5.08044 26.0452 5.08044 27.2798 6.39735L47.1107 27.5503C48.9818 29.5461 47.5666 32.8126 44.8309 32.8126H35.9375V42.1876C35.9375 43.9135 34.5384 45.3126 32.8125 45.3126H17.1875C15.4616 45.3126 14.0625 43.9135 14.0625 42.1876V32.8126H5.1691C2.43335 32.8126 1.0182 29.5461 2.8893 27.5503L22.7202 6.39735ZM44.8309 29.6876L25 8.53467L5.1691 29.6876H14.0625C15.7884 29.6876 17.1875 31.0867 17.1875 32.8126V42.1876H32.8125V32.8126C32.8125 31.0867 34.2116 29.6876 35.9375 29.6876L44.8309 29.6876Z" }) })) })), jsx$1(Key$1, {}), jsx$1(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48599
|
+
keys[79].character,
|
|
48600
|
+
keys[33].character,
|
|
48601
|
+
]) }, { children: keys[79].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48602
|
+
keys[77].character,
|
|
48603
|
+
keys[31].character,
|
|
48604
|
+
]) }, { children: keys[77].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48605
|
+
keys[75].character,
|
|
48606
|
+
keys[29].character,
|
|
48607
|
+
]) }, { children: keys[75].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48608
|
+
keys[73].character,
|
|
48609
|
+
keys[27].character,
|
|
48610
|
+
]) }, { children: keys[73].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48611
|
+
keys[81].character,
|
|
48612
|
+
keys[35].character,
|
|
48613
|
+
]) }, { children: keys[81].character })), jsx$1(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48614
|
+
keys[80].character,
|
|
48615
|
+
keys[34].character,
|
|
48616
|
+
]) }, { children: keys[80].character })), jsxs(Key$1, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48617
|
+
keys[72].character,
|
|
48618
|
+
keys[26].character,
|
|
48619
|
+
]) }, { children: [keys[72].character, jsx$1("br", {}), !["m", "s"].includes(keys[26].character) && keys[26].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48620
|
+
keys[74].character,
|
|
48621
|
+
keys[28].character,
|
|
48622
|
+
]) }, { children: [keys[74].character, jsx$1("br", {}), !["ö", "b"].includes(keys[28].character) && keys[28].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48623
|
+
keys[76].character,
|
|
48624
|
+
keys[30].character,
|
|
48625
|
+
]) }, { children: [keys[76].character, jsx$1("br", {}), !["ç"].includes(keys[30].character) && keys[30].character] })), jsxs(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48626
|
+
keys[78].character,
|
|
48627
|
+
keys[32].character,
|
|
48628
|
+
]) }, { children: [keys[78].character, jsx$1("br", {}), keys[32].character] })), jsx$1(Key$1, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, shiftKeys.left), align: "right" }, { children: jsx$1("svg", __assign$2({ viewBox: "0 0 50 50", width: 20, height: 20 }, { children: jsx$1("path", { d: "M22.7202 6.39735C23.9548 5.08044 26.0452 5.08044 27.2798 6.39735L47.1107 27.5503C48.9818 29.5461 47.5666 32.8126 44.8309 32.8126H35.9375V42.1876C35.9375 43.9135 34.5384 45.3126 32.8125 45.3126H17.1875C15.4616 45.3126 14.0625 43.9135 14.0625 42.1876V32.8126H5.1691C2.43335 32.8126 1.0182 29.5461 2.8893 27.5503L22.7202 6.39735ZM44.8309 29.6876L25 8.53467L5.1691 29.6876H14.0625C15.7884 29.6876 17.1875 31.0867 17.1875 32.8126V42.1876H32.8125V32.8126C32.8125 31.0867 34.2116 29.6876 35.9375 29.6876L44.8309 29.6876Z" }) })) }))] }), jsxs(Row5$1, { children: [jsx$1(Key$1, {}), jsx$1(Key$1, {}), jsx$1(Key$1, {}), jsx$1(Key$1, {}), jsx$1(Key$1, __assign$2({ color: enums.Color.PINK, isActive: containsAny(activeKeys, [keys[1].character]) }, { children: jsx$1("svg", __assign$2({ width: "24", height: "6", viewBox: "0 0 28 7", style: { marginTop: 10 }, fill: theme.colors.pink.dark }, { 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(Key$1, {}), jsx$1(Key$1, {}), jsx$1(Key$1, {}), jsx$1(Key$1, {})] })] }));
|
|
48629
|
+
};
|
|
48630
|
+
|
|
48418
48631
|
var Container$3 = styled.div(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject$1(["\n min-width: 720px;\n width: 100%;\n border-radius: 10px;\n padding: 15px;\n box-sizing: border-box;\n border: 1px solid ", ";\n background-color: ", ";\n box-shadow: 0 4px 0 ", ";\n\n display: flex;\n flex-direction: column;\n gap: 10px;\n"], ["\n min-width: 720px;\n width: 100%;\n border-radius: 10px;\n padding: 15px;\n box-sizing: border-box;\n border: 1px solid ", ";\n background-color: ", ";\n box-shadow: 0 4px 0 ", ";\n\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])), theme.colors.lightGray.darker, theme.colors.lightGray.base, theme.colors.lightGray.darker);
|
|
48419
48632
|
var Row = styled.div(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject$1(["\n min-height: 40px;\n display: grid;\n gap: 7px;\n"], ["\n min-height: 40px;\n display: grid;\n gap: 7px;\n"])));
|
|
48420
48633
|
var Row1 = styled(Row)(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject$1(["\n grid-template-columns: repeat(13, 1fr) 1.75fr;\n"], ["\n grid-template-columns: repeat(13, 1fr) 1.75fr;\n"])));
|
|
48421
|
-
var Row2 = styled(Row)(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject$1(["\n grid-template-columns: 1.5fr repeat(12, 1fr) 1.25fr;\n
|
|
48422
|
-
var Row3 = styled(Row)(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject$1(["\n grid-template-columns: 2fr repeat(
|
|
48634
|
+
var Row2 = styled(Row)(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject$1(["\n grid-template-columns: 1.5fr repeat(12, 1fr) 1.25fr;\n"], ["\n grid-template-columns: 1.5fr repeat(12, 1fr) 1.25fr;\n"])));
|
|
48635
|
+
var Row3 = styled(Row)(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject$1(["\n grid-template-columns: 2fr repeat(11, 1fr) 2fr;\n"], ["\n grid-template-columns: 2fr repeat(11, 1fr) 2fr;\n"])));
|
|
48423
48636
|
var Row4 = styled(Row)(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject$1(["\n grid-template-columns: 1.5fr repeat(11, 1fr) 2.5fr;\n"], ["\n grid-template-columns: 1.5fr repeat(11, 1fr) 2.5fr;\n"])));
|
|
48424
48637
|
var Row5 = styled(Row)(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject$1(["\n grid-template-columns: 1.75fr repeat(3, 1fr) 6fr repeat(3, 1fr) 1.85fr;\n"], ["\n grid-template-columns: 1.75fr repeat(3, 1fr) 6fr repeat(3, 1fr) 1.85fr;\n"])));
|
|
48425
48638
|
var Key = styled.div(templateObject_8$1 || (templateObject_8$1 = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: ", ";\n\n border: 1px solid;\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n padding: 0 10px;\n\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n\n background-color: ", ";\n color: ", ";\n box-shadow: ", ";\n border-color: ", ";\n\n svg {\n fill: ", ";\n stroke: ", ";\n }\n"], ["\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: ", ";\n\n border: 1px solid;\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n padding: 0 10px;\n\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n\n background-color: ", ";\n color: ", ";\n box-shadow: ", ";\n border-color: ", ";\n\n svg {\n fill: ", ";\n stroke: ", ";\n }\n"])), function (_a) {
|
|
@@ -48481,168 +48694,179 @@ var Key = styled.div(templateObject_8$1 || (templateObject_8$1 = __makeTemplateO
|
|
|
48481
48694
|
});
|
|
48482
48695
|
var templateObject_1$4, templateObject_2$4, templateObject_3$4, templateObject_4$3, templateObject_5$2, templateObject_6$2, templateObject_7$1, templateObject_8$1;
|
|
48483
48696
|
|
|
48484
|
-
var
|
|
48485
|
-
var
|
|
48486
|
-
var _b = useState(), shiftKeys = _b[0], setShiftKeys = _b[1];
|
|
48487
|
-
useEffect(function () {
|
|
48488
|
-
if (!!props.keys) {
|
|
48489
|
-
var keys_1 = {};
|
|
48490
|
-
var shiftKeys_1 = { left: [], right: [] };
|
|
48491
|
-
for (var _i = 0, _a = props.keys; _i < _a.length; _i++) {
|
|
48492
|
-
var _b = _a[_i], index = _b.index, key = _b.key, color = _b.color, hand = _b.hand, isShiftKey = _b.isShiftKey;
|
|
48493
|
-
keys_1[index] = { character: key, color: color };
|
|
48494
|
-
if (isShiftKey)
|
|
48495
|
-
shiftKeys_1[hand].push(key);
|
|
48496
|
-
}
|
|
48497
|
-
setKeys(keys_1);
|
|
48498
|
-
setShiftKeys(shiftKeys_1);
|
|
48499
|
-
}
|
|
48500
|
-
}, [props.keys]);
|
|
48697
|
+
var ISANSIKeyboard = function (_a) {
|
|
48698
|
+
var keys = _a.keys, shiftKeys = _a.shiftKeys, activeKeys = _a.activeKeys;
|
|
48501
48699
|
var containsAny = function (arr1, arr2) {
|
|
48502
48700
|
return arr1.some(function (v) { return arr2.includes(v); });
|
|
48503
48701
|
};
|
|
48504
|
-
|
|
48505
|
-
return jsx$1(Fragment$1, {});
|
|
48506
|
-
return (jsxs(Container$3, { children: [jsxs(Row1, { children: [jsx$1(Key, {}), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(props.activeKeys, [
|
|
48702
|
+
return (jsxs(Container$3, { children: [jsxs(Row1, { children: [jsx$1(Key, {}), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48507
48703
|
keys[91].character,
|
|
48508
48704
|
keys[45].character,
|
|
48509
|
-
]) }, { children: [keys[91].character, jsx$1("br", {}), keys[45].character] })), jsxs(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(
|
|
48705
|
+
]) }, { children: [keys[91].character, jsx$1("br", {}), keys[45].character] })), jsxs(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48510
48706
|
keys[89].character,
|
|
48511
48707
|
keys[43].character,
|
|
48512
|
-
]) }, { children: [keys[89].character, jsx$1("br", {}), keys[43].character] })), jsxs(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(
|
|
48708
|
+
]) }, { children: [keys[89].character, jsx$1("br", {}), keys[43].character] })), jsxs(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48513
48709
|
keys[87].character,
|
|
48514
48710
|
keys[41].character,
|
|
48515
|
-
]) }, { children: [keys[87].character, jsx$1("br", {}), keys[41].character] })), jsxs(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(
|
|
48711
|
+
]) }, { children: [keys[87].character, jsx$1("br", {}), keys[41].character] })), jsxs(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48516
48712
|
keys[85].character,
|
|
48517
48713
|
keys[39].character,
|
|
48518
|
-
]) }, { children: [keys[85].character, jsx$1("br", {}), keys[39].character] })), jsxs(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48714
|
+
]) }, { children: [keys[85].character, jsx$1("br", {}), keys[39].character] })), jsxs(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48519
48715
|
keys[83].character,
|
|
48520
48716
|
keys[37].character,
|
|
48521
|
-
]) }, { children: [keys[83].character, jsx$1("br", {}), keys[37].character] })), jsxs(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48717
|
+
]) }, { children: [keys[83].character, jsx$1("br", {}), keys[37].character] })), jsxs(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48522
48718
|
keys[93].character,
|
|
48523
48719
|
keys[47].character,
|
|
48524
|
-
]) }, { children: [keys[93].character, jsx$1("br", {}), keys[47].character] })), jsxs(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48720
|
+
]) }, { children: [keys[93].character, jsx$1("br", {}), keys[47].character] })), jsxs(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48525
48721
|
keys[92].character,
|
|
48526
48722
|
keys[46].character,
|
|
48527
|
-
]) }, { children: [keys[92].character, jsx$1("br", {}), keys[46].character] })), jsxs(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48723
|
+
]) }, { children: [keys[92].character, jsx$1("br", {}), keys[46].character] })), jsxs(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48528
48724
|
keys[82].character,
|
|
48529
48725
|
keys[36].character,
|
|
48530
|
-
]) }, { children: [keys[82].character, jsx$1("br", {}), keys[36].character] })), jsxs(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(
|
|
48726
|
+
]) }, { children: [keys[82].character, jsx$1("br", {}), keys[36].character] })), jsxs(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48531
48727
|
keys[84].character,
|
|
48532
48728
|
keys[38].character,
|
|
48533
|
-
]) }, { children: [keys[84].character, jsx$1("br", {}), keys[38].character] })), jsxs(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(
|
|
48729
|
+
]) }, { children: [keys[84].character, jsx$1("br", {}), keys[38].character] })), jsxs(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48534
48730
|
keys[86].character,
|
|
48535
48731
|
keys[40].character,
|
|
48536
|
-
]) }, { children: [keys[86].character, jsx$1("br", {}), keys[40].character] })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(
|
|
48732
|
+
]) }, { children: [keys[86].character, jsx$1("br", {}), keys[40].character] })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48537
48733
|
keys[88].character,
|
|
48538
48734
|
keys[42].character,
|
|
48539
|
-
]) }, { children: [keys[88].character, jsx$1("br", {}), keys[42].character] })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(
|
|
48735
|
+
]) }, { children: [keys[88].character, jsx$1("br", {}), keys[42].character] })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48540
48736
|
keys[90].character,
|
|
48541
48737
|
keys[44].character,
|
|
48542
|
-
]) }, { children: [keys[90].character, jsx$1("br", {}), keys[44].character] })), jsx$1(Key, {})] }), jsxs(Row2, { children: [jsx$1(Key, {}), jsx$1(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(
|
|
48738
|
+
]) }, { children: [keys[90].character, jsx$1("br", {}), keys[44].character] })), jsx$1(Key, {})] }), jsxs(Row2, { children: [jsx$1(Key, {}), jsx$1(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48543
48739
|
keys[67].character,
|
|
48544
48740
|
keys[21].character,
|
|
48545
|
-
]) }, { children: keys[67].character })), jsx$1(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(
|
|
48741
|
+
]) }, { children: keys[67].character })), jsx$1(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48546
48742
|
keys[65].character,
|
|
48547
48743
|
keys[19].character,
|
|
48548
|
-
]) }, { children: keys[65].character })), jsx$1(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(
|
|
48744
|
+
]) }, { children: keys[65].character })), jsx$1(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48549
48745
|
keys[63].character,
|
|
48550
48746
|
keys[17].character,
|
|
48551
|
-
]) }, { children: keys[63].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48747
|
+
]) }, { children: keys[63].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48552
48748
|
keys[61].character,
|
|
48553
48749
|
keys[15].character,
|
|
48554
|
-
]) }, { children: keys[61].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48750
|
+
]) }, { children: keys[61].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48555
48751
|
keys[71].character,
|
|
48556
48752
|
keys[25].character,
|
|
48557
|
-
]) }, { children: keys[71].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48753
|
+
]) }, { children: keys[71].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48558
48754
|
keys[70].character,
|
|
48559
48755
|
keys[24].character,
|
|
48560
|
-
]) }, { children: keys[70].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48756
|
+
]) }, { children: keys[70].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48561
48757
|
keys[60].character,
|
|
48562
48758
|
keys[14].character,
|
|
48563
|
-
]) }, { children: keys[60].character })), jsx$1(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(
|
|
48759
|
+
]) }, { children: keys[60].character })), jsx$1(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48564
48760
|
keys[62].character,
|
|
48565
48761
|
keys[16].character,
|
|
48566
|
-
]) }, { children: keys[62].character })), jsx$1(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(
|
|
48762
|
+
]) }, { children: keys[62].character })), jsx$1(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48567
48763
|
keys[64].character,
|
|
48568
48764
|
keys[18].character,
|
|
48569
|
-
]) }, { children: keys[64].character })), jsx$1(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(
|
|
48765
|
+
]) }, { children: keys[64].character })), jsx$1(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48570
48766
|
keys[66].character,
|
|
48571
48767
|
keys[20].character,
|
|
48572
|
-
]) }, { children: keys[66].character })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(
|
|
48768
|
+
]) }, { children: keys[66].character })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48573
48769
|
keys[69].character,
|
|
48574
48770
|
keys[23].character,
|
|
48575
|
-
]) }, { children: [keys[69].character, jsx$1("br", {}), !["ğ", "q", "ü"].includes(keys[23].character) && keys[23].character] })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(
|
|
48771
|
+
]) }, { children: [keys[69].character, jsx$1("br", {}), !["ğ", "q", "ü"].includes(keys[23].character) && keys[23].character] })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48576
48772
|
keys[68].character,
|
|
48577
48773
|
keys[22].character,
|
|
48578
|
-
]) }, { children: [keys[68].character, jsx$1("br", {}), !["ü", "w"].includes(keys[22].character) && keys[22].character] })),
|
|
48774
|
+
]) }, { children: [keys[68].character, jsx$1("br", {}), !["ü", "w"].includes(keys[22].character) && keys[22].character] })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48775
|
+
keys[57].character,
|
|
48776
|
+
keys[11].character,
|
|
48777
|
+
]) }, { children: [keys[57].character, jsx$1("br", {}), !["x"].includes(keys[11].character) && keys[11].character] }))] }), jsxs(Row3, { children: [jsx$1(Key, {}), jsx$1(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48579
48778
|
keys[55].character,
|
|
48580
48779
|
keys[9].character,
|
|
48581
|
-
]) }, { children: keys[55].character })), jsx$1(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(
|
|
48780
|
+
]) }, { children: keys[55].character })), jsx$1(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48582
48781
|
keys[53].character,
|
|
48583
48782
|
keys[7].character,
|
|
48584
|
-
]) }, { children: keys[53].character })), jsx$1(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(
|
|
48783
|
+
]) }, { children: keys[53].character })), jsx$1(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48585
48784
|
keys[51].character,
|
|
48586
48785
|
keys[5].character,
|
|
48587
|
-
]) }, { children: keys[51].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48786
|
+
]) }, { children: keys[51].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48588
48787
|
keys[49].character,
|
|
48589
48788
|
keys[3].character,
|
|
48590
|
-
]) }, { children: keys[49].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48789
|
+
]) }, { children: keys[49].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48591
48790
|
keys[59].character,
|
|
48592
48791
|
keys[13].character,
|
|
48593
|
-
]) }, { children: keys[59].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48792
|
+
]) }, { children: keys[59].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48594
48793
|
keys[58].character,
|
|
48595
48794
|
keys[12].character,
|
|
48596
|
-
]) }, { children: keys[58].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48795
|
+
]) }, { children: keys[58].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48597
48796
|
keys[48].character,
|
|
48598
48797
|
keys[2].character,
|
|
48599
|
-
]) }, { children: keys[48].character })), jsx$1(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(
|
|
48798
|
+
]) }, { children: keys[48].character })), jsx$1(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48600
48799
|
keys[50].character,
|
|
48601
48800
|
keys[4].character,
|
|
48602
|
-
]) }, { children: keys[50].character })), jsx$1(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(
|
|
48801
|
+
]) }, { children: keys[50].character })), jsx$1(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48603
48802
|
keys[52].character,
|
|
48604
48803
|
keys[6].character,
|
|
48605
|
-
]) }, { children: keys[52].character })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(
|
|
48804
|
+
]) }, { children: keys[52].character })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48606
48805
|
keys[54].character,
|
|
48607
48806
|
keys[8].character,
|
|
48608
48807
|
]) }, { children: [keys[54].character, jsx$1("br", {}), !["ş", "y", "ö", "m"].includes(keys[8].character) &&
|
|
48609
|
-
keys[8].character] })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(
|
|
48808
|
+
keys[8].character] })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48610
48809
|
keys[56].character,
|
|
48611
48810
|
keys[10].character,
|
|
48612
|
-
]) }, { children: [keys[56].character, jsx$1("br", {}), !["i", "ş", "ä"].includes(keys[10].character) && keys[10].character] })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(
|
|
48613
|
-
keys[57].character,
|
|
48614
|
-
keys[11].character,
|
|
48615
|
-
]) }, { children: [keys[57].character, jsx$1("br", {}), !["x"].includes(keys[11].character) && keys[11].character] })), jsx$1(Key, {})] }), jsxs(Row4, { children: [jsx$1(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(props.activeKeys, shiftKeys.right), align: "left" }, { children: jsx$1("svg", __assign$2({ viewBox: "0 0 50 50", width: 20, height: 20 }, { children: jsx$1("path", { d: "M22.7202 6.39735C23.9548 5.08044 26.0452 5.08044 27.2798 6.39735L47.1107 27.5503C48.9818 29.5461 47.5666 32.8126 44.8309 32.8126H35.9375V42.1876C35.9375 43.9135 34.5384 45.3126 32.8125 45.3126H17.1875C15.4616 45.3126 14.0625 43.9135 14.0625 42.1876V32.8126H5.1691C2.43335 32.8126 1.0182 29.5461 2.8893 27.5503L22.7202 6.39735ZM44.8309 29.6876L25 8.53467L5.1691 29.6876H14.0625C15.7884 29.6876 17.1875 31.0867 17.1875 32.8126V42.1876H32.8125V32.8126C32.8125 31.0867 34.2116 29.6876 35.9375 29.6876L44.8309 29.6876Z" }) })) })), jsx$1(Key, {}), jsx$1(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(props.activeKeys, [
|
|
48811
|
+
]) }, { children: [keys[56].character, jsx$1("br", {}), !["i", "ş", "ä"].includes(keys[10].character) && keys[10].character] })), jsx$1(Key, {})] }), jsxs(Row4, { children: [jsx$1(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, shiftKeys.right), align: "left" }, { children: jsx$1("svg", __assign$2({ viewBox: "0 0 50 50", width: 20, height: 20 }, { children: jsx$1("path", { d: "M22.7202 6.39735C23.9548 5.08044 26.0452 5.08044 27.2798 6.39735L47.1107 27.5503C48.9818 29.5461 47.5666 32.8126 44.8309 32.8126H35.9375V42.1876C35.9375 43.9135 34.5384 45.3126 32.8125 45.3126H17.1875C15.4616 45.3126 14.0625 43.9135 14.0625 42.1876V32.8126H5.1691C2.43335 32.8126 1.0182 29.5461 2.8893 27.5503L22.7202 6.39735ZM44.8309 29.6876L25 8.53467L5.1691 29.6876H14.0625C15.7884 29.6876 17.1875 31.0867 17.1875 32.8126V42.1876H32.8125V32.8126C32.8125 31.0867 34.2116 29.6876 35.9375 29.6876L44.8309 29.6876Z" }) })) })), jsx$1(Key, {}), jsx$1(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48616
48812
|
keys[79].character,
|
|
48617
48813
|
keys[33].character,
|
|
48618
|
-
]) }, { children: keys[79].character })), jsx$1(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(
|
|
48814
|
+
]) }, { children: keys[79].character })), jsx$1(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48619
48815
|
keys[77].character,
|
|
48620
48816
|
keys[31].character,
|
|
48621
|
-
]) }, { children: keys[77].character })), jsx$1(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(
|
|
48817
|
+
]) }, { children: keys[77].character })), jsx$1(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48622
48818
|
keys[75].character,
|
|
48623
48819
|
keys[29].character,
|
|
48624
|
-
]) }, { children: keys[75].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48820
|
+
]) }, { children: keys[75].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48625
48821
|
keys[73].character,
|
|
48626
48822
|
keys[27].character,
|
|
48627
|
-
]) }, { children: keys[73].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48823
|
+
]) }, { children: keys[73].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48628
48824
|
keys[81].character,
|
|
48629
48825
|
keys[35].character,
|
|
48630
|
-
]) }, { children: keys[81].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48826
|
+
]) }, { children: keys[81].character })), jsx$1(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48631
48827
|
keys[80].character,
|
|
48632
48828
|
keys[34].character,
|
|
48633
|
-
]) }, { children: keys[80].character })), jsxs(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(
|
|
48829
|
+
]) }, { children: keys[80].character })), jsxs(Key, __assign$2({ color: enums.Color.YELLOW, isActive: containsAny(activeKeys, [
|
|
48634
48830
|
keys[72].character,
|
|
48635
48831
|
keys[26].character,
|
|
48636
|
-
]) }, { children: [keys[72].character, jsx$1("br", {}), !["m", "s"].includes(keys[26].character) && keys[26].character] })), jsxs(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(
|
|
48832
|
+
]) }, { children: [keys[72].character, jsx$1("br", {}), !["m", "s"].includes(keys[26].character) && keys[26].character] })), jsxs(Key, __assign$2({ color: enums.Color.PURPLE, isActive: containsAny(activeKeys, [
|
|
48637
48833
|
keys[74].character,
|
|
48638
48834
|
keys[28].character,
|
|
48639
|
-
]) }, { children: [keys[74].character, jsx$1("br", {}), !["ö", "b"].includes(keys[28].character) && keys[28].character] })), jsxs(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(
|
|
48835
|
+
]) }, { children: [keys[74].character, jsx$1("br", {}), !["ö", "b"].includes(keys[28].character) && keys[28].character] })), jsxs(Key, __assign$2({ color: enums.Color.GREEN, isActive: containsAny(activeKeys, [
|
|
48640
48836
|
keys[76].character,
|
|
48641
48837
|
keys[30].character,
|
|
48642
|
-
]) }, { children: [keys[76].character, jsx$1("br", {}), !["ç"].includes(keys[30].character) && keys[30].character] })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(
|
|
48838
|
+
]) }, { children: [keys[76].character, jsx$1("br", {}), !["ç"].includes(keys[30].character) && keys[30].character] })), jsxs(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, [
|
|
48643
48839
|
keys[78].character,
|
|
48644
48840
|
keys[32].character,
|
|
48645
|
-
]) }, { children: [keys[78].character, jsx$1("br", {}), keys[32].character] })), jsx$1(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(
|
|
48841
|
+
]) }, { children: [keys[78].character, jsx$1("br", {}), keys[32].character] })), jsx$1(Key, __assign$2({ color: enums.Color.BLUE, isActive: containsAny(activeKeys, shiftKeys.left), align: "right" }, { children: jsx$1("svg", __assign$2({ viewBox: "0 0 50 50", width: 20, height: 20 }, { children: jsx$1("path", { d: "M22.7202 6.39735C23.9548 5.08044 26.0452 5.08044 27.2798 6.39735L47.1107 27.5503C48.9818 29.5461 47.5666 32.8126 44.8309 32.8126H35.9375V42.1876C35.9375 43.9135 34.5384 45.3126 32.8125 45.3126H17.1875C15.4616 45.3126 14.0625 43.9135 14.0625 42.1876V32.8126H5.1691C2.43335 32.8126 1.0182 29.5461 2.8893 27.5503L22.7202 6.39735ZM44.8309 29.6876L25 8.53467L5.1691 29.6876H14.0625C15.7884 29.6876 17.1875 31.0867 17.1875 32.8126V42.1876H32.8125V32.8126C32.8125 31.0867 34.2116 29.6876 35.9375 29.6876L44.8309 29.6876Z" }) })) }))] }), jsxs(Row5, { children: [jsx$1(Key, {}), jsx$1(Key, {}), jsx$1(Key, {}), jsx$1(Key, {}), jsx$1(Key, __assign$2({ color: enums.Color.PINK, isActive: containsAny(activeKeys, [keys[1].character]) }, { children: jsx$1("svg", __assign$2({ width: "24", height: "6", viewBox: "0 0 28 7", style: { marginTop: 10 }, fill: theme.colors.pink.dark }, { 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(Key, {}), jsx$1(Key, {}), jsx$1(Key, {}), jsx$1(Key, {})] })] }));
|
|
48842
|
+
};
|
|
48843
|
+
|
|
48844
|
+
var Keyboard = function (props) {
|
|
48845
|
+
var _a = useState(), keys = _a[0], setKeys = _a[1];
|
|
48846
|
+
var _b = useState(), shiftKeys = _b[0], setShiftKeys = _b[1];
|
|
48847
|
+
useEffect(function () {
|
|
48848
|
+
if (!!props.keys) {
|
|
48849
|
+
var keys_1 = {};
|
|
48850
|
+
var shiftKeys_1 = { left: [], right: [] };
|
|
48851
|
+
for (var _i = 0, _a = props.keys; _i < _a.length; _i++) {
|
|
48852
|
+
var _b = _a[_i], index = _b.index, key = _b.key, color = _b.color, hand = _b.hand, isShiftKey = _b.isShiftKey;
|
|
48853
|
+
keys_1[index] = { character: key, color: color };
|
|
48854
|
+
if (isShiftKey)
|
|
48855
|
+
shiftKeys_1[hand].push(key);
|
|
48856
|
+
}
|
|
48857
|
+
setKeys(keys_1);
|
|
48858
|
+
setShiftKeys(shiftKeys_1);
|
|
48859
|
+
}
|
|
48860
|
+
}, [props.keys]);
|
|
48861
|
+
if (!keys)
|
|
48862
|
+
return jsx$1(Fragment$1, {});
|
|
48863
|
+
switch (props.variant) {
|
|
48864
|
+
default:
|
|
48865
|
+
case enums.KeyboardVariant.ISO:
|
|
48866
|
+
return (jsx$1(ISOKeyboard, { keys: keys, shiftKeys: shiftKeys, activeKeys: props.activeKeys }));
|
|
48867
|
+
case enums.KeyboardVariant.ISANSI:
|
|
48868
|
+
return (jsx$1(ISANSIKeyboard, { keys: keys, shiftKeys: shiftKeys, activeKeys: props.activeKeys }));
|
|
48869
|
+
}
|
|
48646
48870
|
};
|
|
48647
48871
|
|
|
48648
48872
|
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 overflow: auto;\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 overflow: auto;\n"])));
|
|
@@ -48851,5 +49075,5 @@ var Transfer = function (props) {
|
|
|
48851
49075
|
}) }) }, selectedTargetKeys)] }))] }));
|
|
48852
49076
|
};
|
|
48853
49077
|
|
|
48854
|
-
export { Alert, Button$1 as Button, Card, Chart, Period as ChartPeriod, Checkbox, Checkboxes, Collapse, Countdown, DataSummary, DateInputField, Dropdown, FileUpload, Flag, Form, Heading, Icon, IconButton, Illustration, Input, InputField, Key$
|
|
49078
|
+
export { Alert, Button$1 as Button, Card, Chart, Period as ChartPeriod, Checkbox, Checkboxes, Collapse, Countdown, DataSummary, DateInputField, Dropdown, FileUpload, Flag, Form, Heading, Icon, IconButton, Illustration, Input, InputField, Key$2 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, Textarea, Toggle, ToggleField, Tooltip$2 as Tooltip, Transfer, Trophy, theme };
|
|
48855
49079
|
//# sourceMappingURL=index.es.js.map
|