@typeolymp/ui-components 1.14.2 → 1.15.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/build/index.js CHANGED
@@ -3408,14 +3408,14 @@ Object.defineProperty(BeatLoader, "__esModule", { value: true });
3408
3408
  var React$2 = __importStar$2(React__default["default"]);
3409
3409
  var react_1 = require$$1;
3410
3410
  var helpers_1 = helpers$1;
3411
- var beat = react_1.keyframes(templateObject_1$S || (templateObject_1$S = __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"])));
3411
+ var beat = react_1.keyframes(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n 50% {transform: scale(0.75);opacity: 0.2}\n 100% {transform: scale(1);opacity: 1}\n"], ["\n 50% {transform: scale(0.75);opacity: 0.2}\n 100% {transform: scale(1);opacity: 1}\n"])));
3412
3412
  var Loader = /** @class */ (function (_super) {
3413
3413
  __extends$1(Loader, _super);
3414
3414
  function Loader() {
3415
3415
  var _this = _super !== null && _super.apply(this, arguments) || this;
3416
3416
  _this.style = function (i) {
3417
3417
  var _a = _this.props, color = _a.color, size = _a.size, margin = _a.margin, speedMultiplier = _a.speedMultiplier;
3418
- return react_1.css(templateObject_2$y || (templateObject_2$y = __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");
3418
+ return react_1.css(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n display: inline-block;\n background-color: ", ";\n width: ", ";\n height: ", ";\n margin: ", ";\n border-radius: 100%;\n animation: ", " ", "s ", "\n infinite linear;\n animation-fill-mode: both;\n "], ["\n display: inline-block;\n background-color: ", ";\n width: ", ";\n height: ", ";\n margin: ", ";\n border-radius: 100%;\n animation: ", " ", "s ", "\n infinite linear;\n animation-fill-mode: both;\n "])), color, helpers_1.cssValue(size), helpers_1.cssValue(size), helpers_1.cssValue(margin), beat, 0.7 / speedMultiplier, i % 2 ? "0s" : 0.35 / speedMultiplier + "s");
3419
3419
  };
3420
3420
  return _this;
3421
3421
  }
@@ -3430,9 +3430,9 @@ var Loader = /** @class */ (function (_super) {
3430
3430
  return Loader;
3431
3431
  }(React$2.PureComponent));
3432
3432
  var _default = BeatLoader.default = Loader;
3433
- var templateObject_1$S, templateObject_2$y;
3433
+ var templateObject_1$T, templateObject_2$z;
3434
3434
 
3435
- var StyledButton = styled__default["default"].button(templateObject_1$R || (templateObject_1$R = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 13px 20px 16px;\n background-color: ", ";\n box-shadow: ", ";\n\n border: ", ";\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n cursor: pointer;\n\n span {\n color: ", ";\n font-family: ", ";\n font-style: normal;\n font-weight: bold;\n font-size: ", ";\n }\n\n :hover {\n opacity: 0.85;\n }\n\n :active {\n box-shadow: none;\n margin-top: ", ";\n height: ", ";\n }\n"], ["\n width: ", ";\n height: ", ";\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 13px 20px 16px;\n background-color: ", ";\n box-shadow: ", ";\n\n border: ", ";\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n cursor: pointer;\n\n span {\n color: ", ";\n font-family: ", ";\n font-style: normal;\n font-weight: bold;\n font-size: ", ";\n }\n\n :hover {\n opacity: 0.85;\n }\n\n :active {\n box-shadow: none;\n margin-top: ", ";\n height: ", ";\n }\n"])), function (_a) {
3435
+ var StyledButton = styled__default["default"].button(templateObject_1$S || (templateObject_1$S = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 13px 20px 16px;\n background-color: ", ";\n box-shadow: ", ";\n\n border: ", ";\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n cursor: pointer;\n\n span {\n color: ", ";\n font-family: ", ";\n font-style: normal;\n font-weight: bold;\n font-size: ", ";\n }\n\n :hover {\n opacity: 0.85;\n }\n\n :active {\n box-shadow: none;\n margin-top: ", ";\n height: ", ";\n }\n"], ["\n width: ", ";\n height: ", ";\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n padding: 13px 20px 16px;\n background-color: ", ";\n box-shadow: ", ";\n\n border: ", ";\n border-radius: 6px;\n box-sizing: border-box;\n text-decoration: none;\n cursor: pointer;\n\n span {\n color: ", ";\n font-family: ", ";\n font-style: normal;\n font-weight: bold;\n font-size: ", ";\n }\n\n :hover {\n opacity: 0.85;\n }\n\n :active {\n box-shadow: none;\n margin-top: ", ";\n height: ", ";\n }\n"])), function (_a) {
3436
3436
  var fluid = _a.fluid;
3437
3437
  return (fluid ? "100%" : "fit-content");
3438
3438
  }, function (_a) {
@@ -3486,11 +3486,11 @@ var StyledButton = styled__default["default"].button(templateObject_1$R || (temp
3486
3486
  ? theme.button.medium.heightActive
3487
3487
  : theme.button[size].heightActive;
3488
3488
  });
3489
- var DisabledButton = styled__default["default"](StyledButton)(templateObject_2$x || (templateObject_2$x = __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) {
3489
+ var DisabledButton = styled__default["default"](StyledButton)(templateObject_2$y || (templateObject_2$y = __makeTemplateObject$1(["\n background-color: ", ";\n border: 1px solid ", ";\n box-shadow: none;\n padding: 16px 20px;\n cursor: not-allowed;\n\n span {\n color: ", ";\n }\n\n :active {\n margin-top: 0;\n height: ", ";\n }\n"], ["\n background-color: ", ";\n border: 1px solid ", ";\n box-shadow: none;\n padding: 16px 20px;\n cursor: not-allowed;\n\n span {\n color: ", ";\n }\n\n :active {\n margin-top: 0;\n height: ", ";\n }\n"])), theme.colors.lightGray.dark, theme.colors.lightGray.darker, theme.colors.lightGray.darker, function (_a) {
3490
3490
  var size = _a.size;
3491
3491
  return !size ? theme.button.medium.height : theme.button[size].height;
3492
3492
  });
3493
- var GhostButton = styled__default["default"](StyledButton)(templateObject_3$b || (templateObject_3$b = __makeTemplateObject$1(["\n height: ", ";\n padding: 16px 18px;\n\n :active {\n box-shadow: none;\n height: ", ";\n margin-top: ", ";\n margin-bottom: -2.5px;\n }\n"], ["\n height: ", ";\n padding: 16px 18px;\n\n :active {\n box-shadow: none;\n height: ", ";\n margin-top: ", ";\n margin-bottom: -2.5px;\n }\n"])), function (_a) {
3493
+ var GhostButton = styled__default["default"](StyledButton)(templateObject_3$c || (templateObject_3$c = __makeTemplateObject$1(["\n height: ", ";\n padding: 16px 18px;\n\n :active {\n box-shadow: none;\n height: ", ";\n margin-top: ", ";\n margin-bottom: -2.5px;\n }\n"], ["\n height: ", ";\n padding: 16px 18px;\n\n :active {\n box-shadow: none;\n height: ", ";\n margin-top: ", ";\n margin-bottom: -2.5px;\n }\n"])), function (_a) {
3494
3494
  var size = _a.size;
3495
3495
  return !size
3496
3496
  ? "calc(".concat(theme.button.medium.height, " - 2.5px)")
@@ -3513,7 +3513,7 @@ var LoaderWrapper = styled__default["default"].div(templateObject_4$8 || (templa
3513
3513
  var size = _a.size;
3514
3514
  return (size === "small" ? "3px" : "");
3515
3515
  });
3516
- var templateObject_1$R, templateObject_2$x, templateObject_3$b, templateObject_4$8;
3516
+ var templateObject_1$S, templateObject_2$y, templateObject_3$c, templateObject_4$8;
3517
3517
 
3518
3518
  var Button = React$3.forwardRef(function (_a, ref) {
3519
3519
  var label = _a.label, color = _a.color, size = _a.size, fluid = _a.fluid, disabled = _a.disabled, type = _a.type, tabIndex = _a.tabIndex, href = _a.href, asAnchor = _a.asAnchor, props = __rest(_a, ["label", "color", "size", "fluid", "disabled", "type", "tabIndex", "href", "asAnchor"]);
@@ -3549,7 +3549,7 @@ var Button = React$3.forwardRef(function (_a, ref) {
3549
3549
  return (jsxRuntime.jsx(StyledButton, __assign$2({ color: color, size: size, fluid: fluid, type: type, tabIndex: tabIndex, as: as, href: href, ref: ref ? ref : buttonRef, onClick: onClick }, { children: isLoading ? jsxRuntime.jsx(Loader, {}) : jsxRuntime.jsx("span", { children: label }) })));
3550
3550
  });
3551
3551
 
3552
- var StyledCheckbox = styled__default["default"].div(templateObject_1$Q || (templateObject_1$Q = __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) {
3552
+ var StyledCheckbox = styled__default["default"].div(templateObject_1$R || (templateObject_1$R = __makeTemplateObject$1(["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
3553
3553
  var checked = _a.checked, disabled = _a.disabled;
3554
3554
  if (disabled)
3555
3555
  return theme.colors.lightGray.darker;
@@ -3570,7 +3570,7 @@ var StyledCheckbox = styled__default["default"].div(templateObject_1$Q || (templ
3570
3570
  return theme.colors.green.base;
3571
3571
  return theme.colors.lightGray.darker;
3572
3572
  }, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
3573
- var templateObject_1$Q;
3573
+ var templateObject_1$R;
3574
3574
 
3575
3575
  var Checkbox = function (props) {
3576
3576
  var _a;
@@ -3603,7 +3603,7 @@ var Checkbox = function (props) {
3603
3603
  return (jsxRuntime.jsxs(StyledCheckbox, __assign$2({ checked: checked, disabled: props.disabled, tabIndex: 0, onClick: toggle, onBlur: props.onBlur, onKeyPress: function (e) { return (e.key === "Enter" ? toggle() : null); }, ref: wrapperRef }, { children: [checked && (jsxRuntime.jsx("svg", __assign$2({ width: 16, height: 12, viewBox: "0 0 16 12", fill: "none" }, { children: jsxRuntime.jsx("path", { d: "M12.61.563l-6.585 6.6L3.439 4.57a1.997 1.997 0 00-3.374.885c-.183.7.026 1.446.546 1.949l4 4.008a1.997 1.997 0 002.828 0l8-8.017a2.007 2.007 0 00-.025-2.809 1.997 1.997 0 00-2.803-.024z" }) }))), jsxRuntime.jsx("input", { type: "checkbox", disabled: !!props.disabled, id: props.id, name: props.name, value: props.value, ref: inputRef })] })));
3604
3604
  };
3605
3605
 
3606
- var Wrapper$a = styled__default["default"].div(templateObject_1$P || (templateObject_1$P = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
3606
+ var Wrapper$a = styled__default["default"].div(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
3607
3607
  var size = _a.size;
3608
3608
  switch (size) {
3609
3609
  case "small":
@@ -3626,7 +3626,7 @@ var Wrapper$a = styled__default["default"].div(templateObject_1$P || (templateOb
3626
3626
  return "27px";
3627
3627
  }
3628
3628
  });
3629
- var templateObject_1$P;
3629
+ var templateObject_1$Q;
3630
3630
 
3631
3631
  var parsers = {};
3632
3632
 
@@ -3894,7 +3894,7 @@ var flags = {
3894
3894
  };
3895
3895
  var Flag = function (props) { return (jsxRuntime.jsx(Wrapper$a, __assign$2({}, props, { children: flags[getCountryCodeByLocale_1(props.locale)] }))); };
3896
3896
 
3897
- var StyledHeading = styled__default["default"].span(templateObject_1$O || (templateObject_1$O = __makeTemplateObject$1(["\n font-family: ", ";\n font-size: ", ";\n font-weight: 700;\n font-style: normal;\n line-height: ", ";\n letter-spacing: ", ";\n margin: 0;\n color: ", ";\n text-align: ", ";\n"], ["\n font-family: ", ";\n font-size: ", ";\n font-weight: 700;\n font-style: normal;\n line-height: ", ";\n letter-spacing: ", ";\n margin: 0;\n color: ", ";\n text-align: ", ";\n"])), theme.fonts.heading, function (_a) {
3897
+ var StyledHeading = styled__default["default"].span(templateObject_1$P || (templateObject_1$P = __makeTemplateObject$1(["\n font-family: ", ";\n font-size: ", ";\n font-weight: 700;\n font-style: normal;\n line-height: ", ";\n letter-spacing: ", ";\n margin: 0;\n color: ", ";\n text-align: ", ";\n"], ["\n font-family: ", ";\n font-size: ", ";\n font-weight: 700;\n font-style: normal;\n line-height: ", ";\n letter-spacing: ", ";\n margin: 0;\n color: ", ";\n text-align: ", ";\n"])), theme.fonts.heading, function (_a) {
3898
3898
  var type = _a.type;
3899
3899
  return theme.heading[type].fontSize;
3900
3900
  }, function (_a) {
@@ -3918,14 +3918,14 @@ var StyledHeading = styled__default["default"].span(templateObject_1$O || (templ
3918
3918
  var align = _a.align;
3919
3919
  return align;
3920
3920
  });
3921
- var templateObject_1$O;
3921
+ var templateObject_1$P;
3922
3922
 
3923
3923
  var Heading = function (props) {
3924
3924
  var element = !!props.as ? props.as : props.type;
3925
3925
  return (jsxRuntime.jsx(StyledHeading, __assign$2({}, props, { as: element }, { children: props.children })));
3926
3926
  };
3927
3927
 
3928
- var Wrapper$9 = styled__default["default"].div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n }\n"], ["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n }\n"])), function (_a) {
3928
+ var Wrapper$9 = styled__default["default"].div(templateObject_1$O || (templateObject_1$O = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n }\n"], ["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n }\n"])), function (_a) {
3929
3929
  var size = _a.size;
3930
3930
  return theme.icon[size] || theme.icon.medium;
3931
3931
  }, function (_a) {
@@ -3955,7 +3955,7 @@ var Wrapper$9 = styled__default["default"].div(templateObject_1$N || (templateOb
3955
3955
  return theme.colors.lightGray.light;
3956
3956
  }
3957
3957
  });
3958
- var templateObject_1$N;
3958
+ var templateObject_1$O;
3959
3959
 
3960
3960
  var icons = {
3961
3961
  check: (jsxRuntime.jsx("path", { d: "M16.6107 6.5626L10.0247 13.1623L7.43866 10.5709C6.9365 10.0499 6.19289 9.841 5.49363 10.0244C4.79436 10.2078 4.24826 10.7551 4.06523 11.4558C3.8822 12.1565 4.09071 12.9017 4.61063 13.4049L8.61067 17.4132C9.39168 18.1956 10.6577 18.1956 11.4387 17.4132L19.4388 9.3965C20.1967 8.6101 20.1859 7.36009 19.4144 6.58701C18.6429 5.81393 17.3955 5.80307 16.6107 6.5626Z" })),
@@ -3972,7 +3972,7 @@ var icons = {
3972
3972
  cross: (jsxRuntime.jsx("path", { d: "M4.58585 4.58579C5.36689 3.80474 6.63322 3.80474 7.41427 4.58579L12 9.17153L16.5858 4.58579C17.3668 3.80474 18.6331 3.80474 19.4142 4.58579C20.1952 5.36683 20.1952 6.63316 19.4142 7.41421L14.7615 12.0669L19.3934 16.5652C20.1858 17.3347 20.2043 18.6009 19.4348 19.3933C18.6652 20.1857 17.3991 20.2042 16.6067 19.4347L12 14.9609L7.39337 19.4347C6.60098 20.2042 5.33478 20.1857 4.56525 19.3933C3.79571 18.6009 3.81424 17.3347 4.60663 16.5652L9.23853 12.0669L4.58585 7.41421C3.8048 6.63316 3.8048 5.36683 4.58585 4.58579Z" })),
3973
3973
  bulb: (jsxRuntime.jsx("path", { d: "M16.9999 9.03553C16.9967 7.88562 16.6951 6.75388 16.1213 5.73887C15.5475 4.72386 14.719 3.85637 13.7079 3.21192C12.6967 2.56746 11.5337 2.1656 10.3199 2.04132C9.10621 1.91704 7.87864 2.07411 6.74411 2.49886C5.61082 2.92007 4.60229 3.59282 3.80424 4.45988C3.00515 5.32808 2.44858 6.3703 2.18491 7.49217C1.91452 8.61242 1.94102 9.77811 2.2621 10.8864C2.58317 11.9948 3.18891 13.0116 4.02592 13.8473C4.27491 14.1044 4.50062 14.3808 4.70066 14.6734C4.46084 14.9466 4.28577 15.2649 4.18718 15.6069C4.08858 15.949 4.06875 16.3069 4.12899 16.6568C4.18923 17.0067 4.32815 17.3404 4.53646 17.6356C4.74477 17.9308 5.01763 18.1807 5.3368 18.3684C5.12981 18.7505 5.03079 19.1763 5.04929 19.6048C5.0678 20.0334 5.20322 20.4502 5.44246 20.8151C5.68171 21.18 6.01673 21.4808 6.41524 21.6883C6.81374 21.8958 7.2623 22.0031 7.71765 21.9999H11.2744C11.9809 21.9999 12.6585 21.7362 13.159 21.2666C13.6594 20.7969 13.9418 20.1596 13.9444 19.4942C13.9436 19.1085 13.8445 18.7287 13.6552 18.3866C14.0375 18.1632 14.3532 17.8517 14.5724 17.4817C14.7916 17.1116 14.9072 16.695 14.9082 16.2713C14.9084 15.7054 14.7007 15.1569 14.3203 14.7188C14.5467 14.3744 14.8047 14.0494 15.0914 13.7474C16.327 12.4547 17.0074 10.7749 16.9999 9.03553ZM12.2383 15.554C12.4351 15.554 12.6239 15.6277 12.7631 15.7588C12.9023 15.8899 12.9805 16.0677 12.9805 16.2531C12.9805 16.3445 12.9612 16.435 12.9238 16.5193C12.8864 16.6036 12.8316 16.68 12.7626 16.7442C12.6935 16.8084 12.6116 16.8591 12.5216 16.8932C12.4316 16.9273 12.3353 16.9443 12.2383 16.9431H6.75375C6.55947 16.9431 6.37313 16.8704 6.23574 16.741C6.09836 16.6116 6.02119 16.4361 6.02119 16.2531C6.02117 16.0693 6.09804 15.8928 6.23516 15.762C6.37227 15.6311 6.55859 15.5564 6.75375 15.554H12.2383ZM11.2744 20.166H7.71765C7.52336 20.166 7.33702 20.0933 7.19964 19.964C7.06226 19.8346 6.98508 19.659 6.98508 19.476C6.98506 19.2922 7.06194 19.1158 7.19905 18.9849C7.33616 18.8541 7.52248 18.7794 7.71765 18.777H11.2744C11.4713 18.777 11.66 18.8506 11.7992 18.9817C11.9384 19.1128 12.0166 19.2906 12.0166 19.476C12.0166 19.5674 11.9973 19.6579 11.9599 19.7422C11.9225 19.8265 11.8677 19.903 11.7987 19.9672C11.7296 20.0314 11.6477 20.082 11.5577 20.1161C11.4677 20.1503 11.3714 20.1672 11.2744 20.166ZM14.4841 10.6788C14.2574 11.2921 13.9036 11.8568 13.4432 12.3402C13.0264 12.7745 12.6551 13.2458 12.3347 13.7474H6.70557C6.39922 13.2738 6.04404 12.8299 5.64525 12.4219C4.97469 11.7557 4.51703 10.925 4.32473 10.0251C4.12802 9.12397 4.2045 8.18889 4.5454 7.32676C4.88631 6.46463 5.47789 5.71024 6.25251 5.14984C7.0192 4.57901 7.94129 4.22343 8.91286 4.12394C9.65469 4.04111 10.4067 4.10608 11.1202 4.31462C11.8317 4.53062 12.4881 4.88299 13.0479 5.34957C13.5623 5.78316 13.9815 6.30752 14.2818 6.89297C14.585 7.47727 14.7588 8.11359 14.7926 8.76318C14.8258 9.41467 14.721 10.0659 14.4841 10.6788Z" })),
3974
3974
  star: (jsxRuntime.jsx("path", { d: "M2.52642 11.0247L6.42532 13.9834C6.87081 14.3213 7.05746 14.9203 6.88764 15.4672L5.39751 20.2558C5.01734 21.479 6.35757 22.4963 7.35438 21.7405L11.2533 18.7814C11.6988 18.443 12.3015 18.443 12.7469 18.7814L16.6458 21.7405C17.6422 22.4963 18.9829 21.479 18.6027 20.2558L17.1132 15.4672C16.9425 14.9203 17.1292 14.3213 17.5751 13.9834L21.4736 11.0247C22.4695 10.2684 21.9583 8.62247 20.7267 8.62247H15.9074C15.357 8.62247 14.8679 8.25197 14.6983 7.705L13.2093 2.9181C12.8286 1.69397 11.172 1.69397 10.791 2.9181L9.30106 7.70524C9.13146 8.2522 8.64412 8.6227 8.0928 8.6227H3.27326C2.04175 8.6227 1.5305 10.2687 2.52642 11.0247Z" })),
3975
- setting: (jsxRuntime.jsx("path", { d: "M10.5145 2H13.4674C13.7167 2.00125 13.9575 2.09128 14.1467 2.25398C14.3364 2.41792 14.4643 2.642 14.509 2.88889L14.6811 3.94104C15.0485 4.06092 15.4059 4.20952 15.75 4.38548L16.6558 3.75963C16.8336 3.63488 17.0456 3.56835 17.2626 3.56916H17.3533C17.604 3.58716 17.8394 3.69692 18.0145 3.87755L20.1341 5.97277C20.3138 6.14482 20.4235 6.37749 20.442 6.62583C20.4621 6.87658 20.3949 7.12657 20.2518 7.3333L19.6268 8.24033C19.797 8.5843 19.9453 8.93877 20.0707 9.30156L21.1213 9.48294C21.3663 9.51899 21.5892 9.64511 21.7464 9.8367C21.9102 10.0289 22.0001 10.2733 22 10.526V13.492C22.0001 13.7447 21.9102 13.9891 21.7464 14.1813C21.6107 14.3456 21.4269 14.463 21.221 14.5169H21.1213L20.0707 14.6983C19.9453 15.0611 19.797 15.4156 19.6268 15.7596L20.2428 16.6666C20.3856 16.8706 20.4529 17.1181 20.433 17.3664C20.4132 17.6148 20.3075 17.8485 20.1341 18.0271L18.0326 20.1314C17.8575 20.312 17.6221 20.4218 17.3713 20.4398H17.2808C17.0637 20.4406 16.8517 20.3741 16.6739 20.2493L15.7681 19.6235C15.424 19.7994 15.0666 19.948 14.6993 20.0679L14.5272 21.1201C14.4824 21.367 14.3545 21.591 14.1648 21.755C13.9756 21.9165 13.7341 22.0036 13.4855 21.9999H10.4873C10.2389 22.002 9.99801 21.9151 9.80796 21.755C9.6439 21.6192 9.52665 21.4351 9.47282 21.2289V21.1291L9.30072 20.077C8.93397 19.9554 8.57672 19.8069 8.23188 19.6325L7.32609 20.2584C7.1483 20.3831 6.93631 20.4497 6.71922 20.4489H6.62861C6.37785 20.4309 6.1425 20.3211 5.96739 20.1405L3.86594 18.0362C3.69251 17.8575 3.58674 17.6239 3.5669 17.3755C3.54706 17.1272 3.61439 16.8796 3.75725 16.6756L4.37318 15.7686C4.20296 15.4246 4.05472 15.0702 3.92935 14.7074L2.8786 14.526C2.63444 14.4875 2.41244 14.3619 2.25359 14.1723C2.08979 13.9801 1.99989 13.7356 2 13.4829V10.517C1.99989 10.2643 2.08979 10.0198 2.25359 9.82762C2.38922 9.66333 2.57303 9.54593 2.77897 9.49202H2.8786L3.92935 9.31061C4.05472 8.94782 4.20296 8.59338 4.37318 8.24941L3.75725 7.34238C3.61439 7.13839 3.54706 6.89088 3.5669 6.64252C3.58674 6.39415 3.69251 6.1605 3.86594 5.98185L5.96739 3.87755C6.1425 3.69692 6.37785 3.58716 6.62861 3.56916H6.71922C6.93631 3.56835 7.1483 3.63488 7.32609 3.75963L8.23188 4.38548C8.57672 4.21112 8.93397 4.06257 9.30072 3.94104L9.47282 2.88889C9.51756 2.642 9.6454 2.41792 9.83511 2.25398C10.0243 2.09128 10.2651 2.00125 10.5145 2ZM12.5797 4.1043H11.4202L11.3297 4.08616L11.1938 4.90249C11.1599 5.10978 11.0653 5.30232 10.9221 5.45576C10.7796 5.60618 10.5974 5.7131 10.3968 5.76414C9.75859 5.91381 9.14747 6.16167 8.58516 6.49886C8.42145 6.59897 8.23347 6.65228 8.04165 6.65304C7.83358 6.64211 7.63273 6.57298 7.46192 6.45349L6.78258 5.96369L5.94926 6.80724L6.43837 7.47843C6.55492 7.65022 6.62086 7.85137 6.62861 8.05891C6.63703 8.2664 6.58343 8.47171 6.47464 8.6485C6.13986 9.19635 5.89233 9.79305 5.74094 10.4172C5.6974 10.6211 5.58938 10.8056 5.43295 10.9433C5.28314 11.0865 5.09381 11.1813 4.88949 11.2154L4.06519 11.3605V12.594L4.88949 12.7301C5.09167 12.7651 5.27995 12.8562 5.43295 12.9931C5.58565 13.1338 5.69291 13.317 5.74094 13.5192C5.89041 14.1582 6.13791 14.7702 6.47464 15.3333C6.58727 15.5059 6.64724 15.7076 6.64724 15.9137C6.64724 16.1199 6.58727 16.3216 6.47464 16.4942L5.98547 17.1745L6.81884 18.018L7.49819 17.5282C7.66574 17.409 7.86362 17.3398 8.06885 17.3287C8.26067 17.3295 8.4486 17.3828 8.6123 17.4829C9.17462 17.8201 9.78574 18.0679 10.4239 18.2176C10.6242 18.2695 10.8062 18.3763 10.9493 18.526C11.0881 18.6777 11.1794 18.867 11.2119 19.0702L11.3569 19.8956H12.5344L12.6703 19.0702C12.7063 18.8663 12.8008 18.6772 12.942 18.526C13.0852 18.3763 13.267 18.2695 13.4674 18.2176C14.1055 18.0679 14.7166 17.8201 15.279 17.4829C15.4427 17.3828 15.6306 17.3295 15.8225 17.3287C16.0305 17.3396 16.2313 17.4088 16.4021 17.5282L17.0815 18.009L17.9148 17.1745L17.4257 16.4942C17.3131 16.3216 17.2531 16.1199 17.2531 15.9137C17.2531 15.7076 17.3131 15.5059 17.4257 15.3333C17.7624 14.7702 18.0099 14.1582 18.1594 13.5192C18.2074 13.317 18.3147 13.1338 18.4674 12.9931C18.618 12.8527 18.8074 12.7611 19.0108 12.7301L19.8351 12.594V11.4058L19.0108 11.2698C18.8092 11.233 18.6214 11.142 18.4674 11.0067C18.3147 10.866 18.2074 10.6828 18.1594 10.4807C18.0099 9.84166 17.7624 9.2297 17.4257 8.66663C17.3169 8.48984 17.2633 8.28456 17.2717 8.07707C17.2768 7.87042 17.3466 7.67057 17.471 7.50564L17.9511 6.82537L17.1177 5.98185L16.4384 6.47162C16.2708 6.59082 16.073 6.66001 15.8677 6.67117C15.6759 6.67041 15.488 6.6171 15.3243 6.51699C14.762 6.1798 14.1508 5.93197 13.5127 5.7823C13.3138 5.72702 13.1327 5.62073 12.9873 5.47392C12.8485 5.32214 12.7571 5.13292 12.7246 4.9297L12.5797 4.1043ZM9.67144 8.44754C10.3629 7.98301 11.1764 7.73413 12.009 7.73234C13.1263 7.7324 14.1979 8.17597 14.9891 8.96588C15.7754 9.76053 16.2208 10.8313 16.2301 11.95C16.2301 12.7838 15.9832 13.5989 15.5208 14.2923C15.0584 14.9857 14.4011 15.5262 13.632 15.8457C12.8629 16.1652 12.0165 16.2493 11.1997 16.0873C10.3829 15.9253 9.63237 15.5245 9.04296 14.9355C8.45355 14.3466 8.0517 13.5959 7.88815 12.7784C7.72461 11.9608 7.80676 11.1131 8.12417 10.3422C8.44157 9.57141 8.97998 8.91207 9.67144 8.44754ZM10.6474 13.595C11.0315 13.9099 11.5126 14.0819 12.009 14.0815V14.1359C12.2958 14.1287 12.5782 14.0639 12.8396 13.9455C13.1009 13.8271 13.336 13.6575 13.5308 13.4466C13.8805 13.0939 14.0975 12.6307 14.1446 12.1359C14.1917 11.641 14.0661 11.1451 13.7892 10.7326C13.5122 10.3201 13.1011 10.0164 12.6257 9.87326C12.1503 9.73013 11.6401 9.7564 11.1818 9.94758C10.7236 10.1388 10.3457 10.4831 10.1125 10.9218C9.87927 11.3606 9.80507 11.8668 9.90259 12.3542C10.0001 12.8416 10.2633 13.2801 10.6474 13.595Z" })),
3975
+ setting: (jsxRuntime.jsx("path", { d: "M11.9 0c-.8 0-1.4.3-1.9.7-.4.4-.6 1-.8 1.5-.4.9-.7 1.8-1.6 2.4s-1.8.3-2.8.1c-.5-.1-1.1-.2-1.7 0-.6.2-1.1.6-1.5 1.3s-.5 1.4-.3 2c.2.6.5 1 .8 1.5.7.8 1.3 1.5 1.3 2.5s-.6 1.7-1.3 2.5c-.3.5-.7.9-.8 1.5-.2.6-.1 1.3.3 2s.9 1.1 1.5 1.3c.6.2 1.1.1 1.7 0 1-.2 1.9-.4 2.8.2.9.5 1.2 1.4 1.5 2.4.2.5.4 1 .8 1.5.4.4 1.1.7 1.9.7.8 0 1.4-.3 1.9-.7.4-.4.6-1 .8-1.5.4-1 .6-1.9 1.5-2.4s1.8-.3 2.8-.2c.5.1 1.1.2 1.7 0 .6-.2 1.1-.6 1.5-1.3.4-.7.5-1.4.3-2s-.5-1-.8-1.5c-.7-.8-1.3-1.5-1.3-2.5s.6-1.7 1.3-2.5c.5-.5.8-.9 1-1.5.2-.6.1-1.3-.3-2s-.9-1.1-1.5-1.3c-.6-.2-1.1-.1-1.7 0-1 .2-1.9.4-2.8-.2-.9-.5-1.2-1.4-1.5-2.4-.2-.5-.4-1-.8-1.5-.6-.3-1.3-.6-2-.6zm0 8c2.2 0 4 1.8 4 4s-1.8 4-4 4-4-1.8-4-4 1.8-4 4-4z" })),
3976
3976
  reload: (jsxRuntime.jsx("path", { d: "M20.6354 11.2888C20.4446 11.2757 20.253 11.2998 20.0716 11.3597C19.8903 11.4195 19.7226 11.514 19.5783 11.6377C19.434 11.7614 19.3158 11.9119 19.2306 12.0806C19.1453 12.2493 19.0947 12.4329 19.0815 12.6209C18.9739 14.1387 18.3662 15.5804 17.3506 16.7268C16.335 17.8732 14.9672 18.6615 13.4551 18.9718C11.943 19.2821 10.3695 19.0975 8.97365 18.446C7.57786 17.7945 6.43622 16.7118 5.72234 15.3626C5.00847 14.0133 4.76142 12.4713 5.01877 10.971C5.27612 9.47075 6.02378 8.09431 7.14805 7.05103C8.27233 6.00774 9.71171 5.35469 11.2473 5.19118C12.7829 5.02767 14.3307 5.36264 15.6553 6.14516L15.0687 6.1882C14.8324 6.20792 14.6055 6.28802 14.4104 6.42057C14.2152 6.55313 14.0585 6.73355 13.9558 6.94402C13.853 7.15449 13.8078 7.38773 13.8246 7.62068C13.8414 7.85363 13.9196 8.07824 14.0514 8.27231C14.1758 8.45551 14.3442 8.60561 14.5416 8.70929C14.739 8.81296 14.9594 8.867 15.1831 8.8666H15.2601L19.2729 8.58175C19.4513 8.56929 19.6255 8.52227 19.7855 8.44339C19.9455 8.36452 20.0881 8.25533 20.2052 8.12209C20.3223 7.98884 20.4116 7.83415 20.4679 7.66688C20.5242 7.4996 20.5465 7.32303 20.5335 7.14726L20.2527 3.20036C20.2154 2.85494 20.0436 2.53721 19.7735 2.31395C19.5033 2.0907 19.1558 1.9793 18.8041 2.00318C18.4523 2.02706 18.1236 2.18436 17.8871 2.44201C17.6506 2.69966 17.5247 3.0376 17.5359 3.38479L17.5754 3.9422C15.7452 2.7363 13.5624 2.1585 11.3651 2.29828C9.16781 2.43806 7.07861 3.28763 5.42104 4.71541C3.76347 6.1432 2.63001 8.06953 2.19621 10.1961C1.7624 12.3226 2.05246 14.5308 3.02144 16.4785C3.99043 18.4263 5.58428 20.0049 7.55618 20.9701C9.52807 21.9352 11.768 22.2329 13.929 21.8171C16.09 21.4013 18.0516 20.2953 19.51 18.6702C20.9683 17.0451 21.8421 14.9916 21.9959 12.8278C22.0103 12.6386 21.9865 12.4483 21.9257 12.2682C21.865 12.088 21.7685 11.9216 21.642 11.7784C21.5154 11.6353 21.3613 11.5183 21.1885 11.4342C21.0157 11.3502 20.8277 11.3008 20.6354 11.2888Z" })),
3977
3977
  expand: (jsxRuntime.jsx("path", { d: "M13.1519 2.65848C12.2656 2.65848 11.5471 3.37694 11.5471 4.26321C11.5471 5.14947 12.2656 5.86793 13.1519 5.86793L15.8968 5.86793L5.82737 15.9374L5.8678 13.1752C5.88077 12.2891 5.1729 11.5602 4.28672 11.5472C3.40055 11.5342 2.67166 12.2421 2.65869 13.1283L2.56131 19.7822C2.55612 20.1373 2.66667 20.4671 2.85807 20.7358C3.13154 21.2301 3.65827 21.5648 4.26318 21.5648L11.0715 21.5648C11.9577 21.5648 12.6762 20.8463 12.6762 19.9601C12.6762 19.0738 11.9577 18.3553 11.0715 18.3553L8.1374 18.3553L18.3988 8.09397L18.3555 11.048C18.3426 11.9342 19.0504 12.6631 19.9366 12.6761C20.8228 12.689 21.5517 11.9812 21.5646 11.095L21.662 4.44109C21.6672 4.08598 21.5567 3.75612 21.3653 3.48747C21.0918 2.99317 20.5651 2.65848 19.9602 2.65848L13.1519 2.65848Z" })),
3978
3978
  calendar: (jsxRuntime.jsx("path", { d: "M21 3h-2V2c0-1.1-.9-2-2-2s-2 .9-2 2v1H9V2c0-1.1-.9-2-2-2S5 .9 5 2v1H3C1.3 3 0 4.3 0 6v14c0 1.7 1.3 3 3 3h18c1.7 0 3-1.3 3-3V6c0-1.7-1.3-3-3-3zM3 6h2v1c0 1.1.9 2 2 2s2-.9 2-2V6h6v1c0 1.1.9 2 2 2s2-.9 2-2V6h2v4H3V6zm0 14v-7h18v7H3z" })),
@@ -3985,12 +3985,15 @@ var icons = {
3985
3985
  heart: (jsxRuntime.jsx("path", { d: "M22 3.5a6.64 6.64 0 00-9.4 0l-.6.6-.6-.6a6.64 6.64 0 00-9.4 0c-1.3 1.3-2 3-2 4.7s.6 3.4 2 4.7l.6.6 8.5 8.5c.5.5 1.4.5 1.9 0l9.1-9.1c1.3-1.3 2-3 2-4.7-.1-1.7-.7-3.4-2.1-4.7z" })),
3986
3986
  thunder: (jsxRuntime.jsx("path", { d: "M20.3 8.7h-6.9l.6-7.6c0-.3-.1-.6-.3-.8-.2-.2-.5-.3-.7-.3-.3 0-.6.2-.7.4L2.9 13.6c-.1.2-.2.4-.2.7 0 .2.1.5.3.6.2.2.4.2.7.2h7.1l-.7 7.8c0 .2 0 .4.2.6.1.2.3.3.5.4l.2.1c.3 0 .6-.2.8-.5L21 10.2c.1-.2.2-.4.2-.7 0-.2-.1-.5-.3-.6-.1-.1-.4-.2-.6-.2z" })),
3987
3987
  fire: (jsxRuntime.jsx("path", { d: "M17.3 9.2c-.7-.6-1.3-1.2-1.8-1.9C12.4 3.3 14 0 14 0 8.3 2.4 7 6.2 7 9c0 0 .1 1.7.8 3.5.2.6-.2 1.2-.8 1.3-.4.1-.8-.2-1-.6-.3-.7-.8-1.8-.6-2.6-.9 1.2-1.5 2.8-1.7 4.4-.3 4.2 2.6 8 6.7 8.8 4.8 1 9.3-2.3 10-7.1.3-2.9-.9-5.7-3.1-7.5z" })),
3988
+ control: (jsxRuntime.jsx("path", { d: "M1.4 5.3h2.4c.5 1.6 2 2.8 3.8 2.8 1.8 0 3.3-1.2 3.8-2.8h11.2c.7 0 1.2-.5 1.2-1.2s-.5-1.2-1.2-1.2H11.5C10.9 1.2 9.4 0 7.6 0 5.8 0 4.3 1.2 3.8 2.8H1.4C.7 2.8.2 3.3.2 4s.5 1.3 1.2 1.3zm6.2-2.8c.9 0 1.6.7 1.6 1.6s-.7 1.6-1.6 1.6S6 5 6 4.1c0-.9.7-1.6 1.6-1.6zM22.6 10.8h-2.4c-.5-1.6-2-2.8-3.8-2.8-1.8 0-3.3 1.2-3.8 2.8H1.4c-.7 0-1.2.5-1.2 1.2s.5 1.2 1.2 1.2h11.2c.5 1.6 2 2.8 3.8 2.8 1.8 0 3.3-1.2 3.8-2.8h2.4c.7 0 1.2-.5 1.2-1.2.1-.7-.5-1.2-1.2-1.2zm-6.2 2.8c-.9 0-1.6-.7-1.6-1.6 0-.9.7-1.6 1.6-1.6.9 0 1.6.7 1.6 1.6 0 .9-.7 1.6-1.6 1.6zM22.6 18.7H11.5c-.5-1.6-2-2.8-3.8-2.8-1.8 0-3.3 1.2-3.8 2.8H1.4c-.7 0-1.2.5-1.2 1.2s.5 1.2 1.2 1.2h2.4c.5 1.6 2 2.8 3.8 2.8 1.8 0 3.3-1.2 3.8-2.8h11.2c.7 0 1.2-.5 1.2-1.2s-.5-1.2-1.2-1.2zm-15 2.8c-.9 0-1.6-.7-1.6-1.6 0-.9.7-1.6 1.6-1.6.9 0 1.6.7 1.6 1.6 0 .9-.7 1.6-1.6 1.6z" })),
3988
3989
  };
3989
3990
  var Icon = function (props) { return (jsxRuntime.jsx(Wrapper$9, __assign$2({}, props, { children: jsxRuntime.jsx("svg", __assign$2({ viewBox: "0 0 24 24", fill: "none" }, { children: icons[props.type] })) }))); };
3990
3991
 
3991
- var Wrapper$8 = styled__default["default"].div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject$1(["\n > svg {\n height: ", ";\n }\n"], ["\n > svg {\n height: ", ";\n }\n"])), function (_a) {
3992
+ var Wrapper$8 = styled__default["default"].div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject$1(["\n > svg {\n height: ", ";\n }\n"], ["\n > svg {\n height: ", ";\n }\n"])), function (_a) {
3992
3993
  var size = _a.size;
3993
3994
  switch (size) {
3995
+ case "tiny":
3996
+ return "28px";
3994
3997
  default:
3995
3998
  case "small":
3996
3999
  return "46px";
@@ -4000,7 +4003,7 @@ var Wrapper$8 = styled__default["default"].div(templateObject_1$M || (templateOb
4000
4003
  return "118px";
4001
4004
  }
4002
4005
  });
4003
- var templateObject_1$M;
4006
+ var templateObject_1$N;
4004
4007
 
4005
4008
  var illustrations = {
4006
4009
  keyboard: (jsxRuntime.jsxs("svg", __assign$2({ viewBox: "0 0 32.9 20.8" }, { children: [jsxRuntime.jsx("path", { d: "M31.5 1H1.4C.6 1 0 1.6 0 2.4v17.1c0 .8.6 1.4 1.4 1.4h30.1c.8 0 1.4-.6 1.4-1.4V2.4c0-.8-.6-1.4-1.4-1.4z", fill: "#829190" }), jsxRuntime.jsx("path", { d: "M31.5 0H1.4C.6 0 0 .6 0 1.4v17.1c0 .8.6 1.4 1.4 1.4h30.1c.8 0 1.4-.6 1.4-1.4V1.4c0-.8-.6-1.4-1.4-1.4z", fill: "#99adac" }), jsxRuntime.jsx("path", { d: "M27.1 14.2H5.7c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h21.4c.3 0 .5-.2.5-.5v-3.4c-.1-.3-.3-.5-.5-.5zM8.4 8.6H2.1c-.3 0-.5.2-.5.4v3.4c0 .3.2.5.5.5h6.3c.3 0 .5-.2.5-.5V9c0-.2-.2-.4-.5-.4zM13.8 8.6h-3.3c-.3 0-.5.2-.5.4v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V9c-.1-.2-.3-.4-.5-.4zM5.4 3.3H2.1c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c-.1-.3-.3-.5-.5-.5zM10.5 3.3H7.2c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c-.1-.3-.3-.5-.5-.5zM15.5 3.3h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c0-.3-.2-.5-.5-.5zM20.6 3.3h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c0-.3-.2-.5-.5-.5zM25.7 3.3h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c0-.3-.2-.5-.5-.5zM30.8 3.3h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.8c0-.3-.2-.5-.5-.5zM18.9 8.6h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V9c-.1-.2-.3-.4-.5-.4zM23.9 8.6h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V9.1c0-.3-.2-.5-.5-.5zM30.7 8.6h-4.9c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h4.9c.3 0 .5-.2.5-.5V9.1c0-.3-.2-.5-.5-.5z", fill: "#899a99" }), jsxRuntime.jsx("path", { d: "M27.1 13.7H5.7c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h21.4c.3 0 .5-.2.5-.5v-3.4c-.1-.3-.3-.5-.5-.5zM8.4 8.1H2.1c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h6.3c.3 0 .5-.2.5-.5V8.6c0-.3-.2-.5-.5-.5zM13.8 8.1h-3.3c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V8.6c-.1-.3-.3-.5-.5-.5z", fill: "#eeeded" }), jsxRuntime.jsx("path", { d: "M5.4 2.8H2.1c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c-.1-.3-.3-.5-.5-.5z", fill: "#e62944" }), jsxRuntime.jsx("path", { d: "M10.5 2.8H7.2c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c-.1-.3-.3-.5-.5-.5zM15.5 2.8h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c0-.3-.2-.5-.5-.5zM20.6 2.8h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c0-.3-.2-.5-.5-.5zM25.7 2.8h-3.3c-.2 0-.4.2-.4.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c-.1-.3-.3-.5-.6-.5zM30.8 2.8h-3.3c-.3 0-.5.2-.5.5v3.4c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V3.3c0-.3-.2-.5-.5-.5zM18.9 8.1h-3.3c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V8.6c-.1-.3-.3-.5-.5-.5zM23.9 8.1h-3.3c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h3.3c.3 0 .5-.2.5-.5V8.6c0-.3-.2-.5-.5-.5zM30.7 8.1h-4.9c-.3 0-.5.2-.5.5V12c0 .3.2.5.5.5h4.9c.3 0 .5-.2.5-.5V8.6c0-.3-.2-.5-.5-.5z", fill: "#eeeded" })] }))),
@@ -4017,10 +4020,11 @@ var illustrations = {
4017
4020
  student: (jsxRuntime.jsxs("svg", __assign$2({ viewBox: "0 0 160 201" }, { children: [jsxRuntime.jsx("path", { d: "M80 137c-18.8 0-34 15.5-34 34.5V201h68v-29.5c0-19-15.2-34.5-34-34.5z", fill: "#53b476" }), jsxRuntime.jsx("path", { d: "M147.9 64c1.2-2.2 2.1-4.5 2.7-7.1 4.4-17.3-6-34.9-23.3-39.3-6.9-1.8-13.9-1.2-20 1.3-4-8.6-11.6-15.4-21.5-17.9-14.7-3.8-29.7 3.3-36.5 16.2-.8-.3-1.7-.5-2.5-.8-17.3-4.4-34.9 6-39.3 23.3-2.3 9.1-.5 18.4 4.3 25.7-5.2 4.3-9 10-10.8 16.9-4.4 17.3 6 34.9 23.3 39.3 14.1 3.6 28.4-2.6 35.6-14.4 3.6 3 7.9 5.3 12.8 6.6 10.3 2.6 20.7 0 28.3-6.2 4.3 6.2 10.7 10.9 18.6 12.9 17.3 4.4 34.9-6 39.3-23.3 3.3-12.7-1.4-25.5-11-33.2z", fill: "#75301c" }), jsxRuntime.jsx("path", { d: "M88.9 125.6H71.1v14c0 4.1 3.3 7.4 7.4 7.4h3c4.1 0 7.4-3.3 7.4-7.4v-14z", fill: "#f7b58e" }), jsxRuntime.jsx("path", { d: "M130.7 72.9c-.5 0-1 .1-1.5.1-5.4-22.1-25.4-38.5-49.1-38.5C56.3 34.6 36.4 51 31 73.1c-.5-.1-1-.1-1.5-.1-4.8 0-8.6 3.9-8.6 8.6 0 4.8 3.9 8.6 8.6 8.6h.2c2.5 25.6 24.1 45.6 50.4 45.6 26.3 0 47.9-20 50.4-45.6h.2c4.8 0 8.6-3.9 8.6-8.6 0-4.8-3.8-8.7-8.6-8.7z", fill: "#f7b58e" }), jsxRuntime.jsx("path", { d: "M114.4 102.2c0-15-14-6.9-32.7-6.9-18.7 0-34.9-8.1-34.9 6.9s15.1 27.1 33.8 27.1 33.8-12.2 33.8-27.1z", fill: "#220f0c" }), jsxRuntime.jsx("path", { d: "M80.6 129.3c7.3 0 14.1-1.9 19.6-5-2.6-3.6-6.9-6.2-11.9-6.9-2.1-.3-4.2-.2-6.1.1-1.1.2-2.2.2-3.3 0-1.9-.3-4-.4-6.1-.1-5 .7-9.3 3.3-11.9 6.9 5.6 3.1 12.4 5 19.7 5z", fill: "#e62743" }), jsxRuntime.jsx("path", { d: "M85.8 85.2c0-2.9-2.3-5.2-5.2-5.2-2.9 0-5.2 2.3-5.2 5.2s2.3 3.5 5.2 3.5c2.9.1 5.2-.6 5.2-3.5z", opacity: 0.37, fill: "#f7b58e" }), jsxRuntime.jsx("path", { d: "M53.7 54.7c-8 0-14.5 6.5-14.5 14.5v7c0 8 6.5 11 14.5 11s14.5-6.1 14.5-14.1v-3.9c-.1-8-6.6-14.5-14.5-14.5z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M53.7 62.8c-2.8 0-5 2.3-5 5V77c0 2.8 2.3 5 5 5s5-2.3 5-5v-9.2c0-2.7-2.3-5-5-5z", fill: "#23292f" }), jsxRuntime.jsx("path", { d: "M48.6 70.9c1.7 0 3-1.4 3-3 0-1.7-1.4-3-3-3-1.7 0-3 1.4-3 3 0 1.7 1.4 3 3 3zM106.3 54.7c8 0 14.5 6.5 14.5 14.5v7c0 8-6.5 11-14.5 11s-14.5-6.1-14.5-14.1v-3.9c0-8 6.5-14.5 14.5-14.5z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M106.3 62.8c2.8 0 5 2.3 5 5V77c0 2.8-2.3 5-5 5-2.8 0-5-2.3-5-5v-9.2c0-2.7 2.2-5 5-5z", fill: "#23292f" }), jsxRuntime.jsx("path", { d: "M111.3 70.9c1.7 0 3-1.4 3-3 0-1.7-1.4-3-3-3-1.7 0-3 1.4-3 3 0 1.7 1.3 3 3 3z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M107.1 27.1c-8.3 0-15.8 2.2-20.8 5.6-2-.3-4.2-.4-6.3-.4-3.9 0-7.5.4-10.8 1.2-5-3.3-12.4-5.4-20.8-5.4-15 0-27.1 6.7-27.1 15s12.1 15 27.1 15c4.6 0 8.9-.6 12.6-1.7 4.9 2.5 11.6 4 19 4 6.3 0 12.1-1.1 16.7-3 3.2.8 6.7 1.2 10.4 1.2 15 0 27.1-7.1 27.1-15.8 0-8.6-12.1-15.7-27.1-15.7z", fill: "#75301c" }), jsxRuntime.jsx("path", { d: "M27.7 81.7l.6-.6c.4-.4.4-1.2 0-1.6-.4-.4-1.2-.4-1.6 0l-.6.6-.6-.6c-.4-.4-1.2-.4-1.6 0-.4.4-.4 1.2 0 1.6l.6.6-.6.6c-.4.4-.4 1.2 0 1.6.2.2.5.3.8.3.3 0 .6-.1.8-.3l.6-.6.6.6c.2.2.5.3.8.3s.6-.1.8-.3c.4-.4.4-1.2 0-1.6l-.6-.6zM135.4 81.7l.6-.6c.4-.4.4-1.2 0-1.6-.4-.4-1.2-.4-1.6 0l-.6.6-.6-.6c-.4-.4-1.2-.4-1.6 0-.4.4-.4 1.2 0 1.6l.6.6-.6.6c-.4.4-.4 1.2 0 1.6.2.2.5.3.8.3.3 0 .6-.1.8-.3l.6-.6.6.6c.2.2.5.3.8.3.3 0 .6-.1.8-.3.4-.4.4-1.2 0-1.6l-.6-.6z", opacity: 0.57, fill: "#f7b58e" })] }))),
4018
4021
  school: (jsxRuntime.jsxs("svg", __assign$2({ viewBox: "0 0 340.6 317" }, { children: [jsxRuntime.jsx("path", { fill: "#ededed", d: "M58 97H282.7V286.9H58z" }), jsxRuntime.jsx("path", { d: "M204.5 286.9h-68.4c-5 0-9.1-4.1-9.1-9.1V156.6c0-5 4.1-9.1 9.1-9.1h68.4c5 0 9.1 4.1 9.1 9.1v121.2c0 5.1-4 9.1-9.1 9.1z", fill: "#f59b1a" }), jsxRuntime.jsx("path", { d: "M164.9 1.3L6.3 83.7c-10.8 5.6-6.8 22 5.4 22H329c12.2 0 16.2-16.4 5.4-22L175.7 1.3c-3.4-1.7-7.4-1.7-10.8 0z", fill: "#7c7f82" }), jsxRuntime.jsx("path", { d: "M100.1 243.4h-6.7V139.7h6.7c9.4 0 17-7.6 17-17s-7.6-17-17-17H37.8c-9.4 0-17 7.6-17 17s7.6 17 17 17h6.7v103.7h-6.7c-9.4 0-17 7.6-17 17s7.6 17 17 17h62.3c9.4 0 17-7.6 17-17s-7.7-17-17-17zM302.9 243.4h-6.7V139.7h6.7c9.4 0 17-7.6 17-17s-7.6-17-17-17h-62.3c-9.4 0-17 7.6-17 17s7.6 17 17 17h6.7v103.7h-6.7c-9.4 0-17 7.6-17 17s7.6 17 17 17h62.3c9.4 0 17-7.6 17-17s-7.6-17-17-17z", fill: "#c4c4c4" }), jsxRuntime.jsx("circle", { cx: 170.3, cy: 59.1, r: 25, fill: "#ededed" }), jsxRuntime.jsx("path", { d: "M319.9 317H20.8c-11 0-20-9-20-20s9-20 20-20h299.1c11 0 20 9 20 20s-9 20-20 20z", fill: "#7c7f82" })] }))),
4019
4022
  organisation: (jsxRuntime.jsxs("svg", __assign$2({ viewBox: "0 0 721 464.5" }, { children: [jsxRuntime.jsx("path", { fill: "#ededed", d: "M58 97H282.7V286.9H58z" }), jsxRuntime.jsx("path", { d: "M204.5 286.9h-68.4c-5 0-9.1-4.1-9.1-9.1V156.6c0-5 4.1-9.1 9.1-9.1h68.4c5 0 9.1 4.1 9.1 9.1v121.2c0 5.1-4 9.1-9.1 9.1z", fill: "#f59b1a" }), jsxRuntime.jsx("path", { d: "M164.9 1.3L6.3 83.7c-10.8 5.6-6.8 22 5.4 22H329c12.2 0 16.2-16.4 5.4-22L175.7 1.3c-3.4-1.7-7.4-1.7-10.8 0z", fill: "#7c7f82" }), jsxRuntime.jsx("path", { d: "M100.1 243.4h-6.7V139.7h6.7c9.4 0 17-7.6 17-17s-7.6-17-17-17H37.8c-9.4 0-17 7.6-17 17s7.6 17 17 17h6.7v103.7h-6.7c-9.4 0-17 7.6-17 17s7.6 17 17 17h62.3c9.4 0 17-7.6 17-17s-7.7-17-17-17zM302.9 243.4h-6.7V139.7h6.7c9.4 0 17-7.6 17-17s-7.6-17-17-17h-62.3c-9.4 0-17 7.6-17 17s7.6 17 17 17h6.7v103.7h-6.7c-9.4 0-17 7.6-17 17s7.6 17 17 17h62.3c9.4 0 17-7.6 17-17s-7.6-17-17-17z", fill: "#c4c4c4" }), jsxRuntime.jsx("circle", { cx: 170.3, cy: 59.1, r: 25, fill: "#ededed" }), jsxRuntime.jsx("path", { d: "M319.9 317H20.8c-11 0-20-9-20-20s9-20 20-20h299.1c11 0 20 9 20 20s-9 20-20 20z", fill: "#7c7f82" }), jsxRuntime.jsxs("g", { children: [jsxRuntime.jsx("path", { fill: "#ededed", d: "M438.3 97H663V286.9H438.3z" }), jsxRuntime.jsx("path", { d: "M584.9 286.9h-68.4c-5 0-9.1-4.1-9.1-9.1V156.6c0-5 4.1-9.1 9.1-9.1h68.4c5 0 9.1 4.1 9.1 9.1v121.2c-.1 5.1-4.1 9.1-9.1 9.1z", fill: "#f59b1a" }), jsxRuntime.jsx("path", { d: "M545.3 1.3L386.6 83.7c-10.8 5.6-6.8 22 5.4 22h317.3c12.2 0 16.2-16.4 5.4-22L556 1.3c-3.4-1.7-7.4-1.7-10.7 0z", fill: "#7c7f82" }), jsxRuntime.jsx("path", { d: "M480.4 243.4h-6.7V139.7h6.7c9.4 0 17-7.6 17-17s-7.6-17-17-17h-62.3c-9.4 0-17 7.6-17 17s7.6 17 17 17h6.7v103.7h-6.7c-9.4 0-17 7.6-17 17s7.6 17 17 17h62.3c9.4 0 17-7.6 17-17s-7.6-17-17-17zM683.2 243.4h-6.7V139.7h6.7c9.4 0 17-7.6 17-17s-7.6-17-17-17h-62.3c-9.4 0-17 7.6-17 17s7.6 17 17 17h6.7v103.7h-6.7c-9.4 0-17 7.6-17 17s7.6 17 17 17h62.3c9.4 0 17-7.6 17-17s-7.6-17-17-17z", fill: "#c4c4c4" }), jsxRuntime.jsx("circle", { cx: 550.6, cy: 59.1, r: 25, fill: "#ededed" }), jsxRuntime.jsx("path", { d: "M700.2 317H401.1c-11 0-20-9-20-20s9-20 20-20h299.1c11 0 20 9 20 20s-9 20-20 20z", fill: "#7c7f82" })] }), jsxRuntime.jsxs("g", { children: [jsxRuntime.jsx("path", { d: "M210.9 477c-17.9 0-32.5-14.6-32.5-32.5 0-13.7 8.6-25.5 20.7-30.3-.4-2-.7-4.1-.7-6.3 0-14.3 10.2-26.2 23.7-28.9v-79.8c-13.5-2.7-23.7-14.6-23.7-28.9 0-1.6.1-3.2.4-4.7-10-1.2-18-8.2-20.4-18.2-2.7-11 2.3-21.9 12.3-27.2l158.6-82.4c3.4-1.8 7.3-2.7 11.1-2.7 3.9 0 7.7.9 11.1 2.7l158.6 82.4c10.1 5.2 15 16.2 12.3 27.2-2.4 10-10.5 17-20.4 18.2.2 1.5.4 3.1.4 4.7 0 14.3-10.2 26.2-23.7 28.9V379c13.5 2.7 23.7 14.6 23.7 28.9 0 2.1-.2 4.2-.7 6.3 12.1 4.7 20.7 16.5 20.7 30.3 0 17.9-14.6 32.5-32.5 32.5h-299z", fill: "#7c7f82" }), jsxRuntime.jsx("path", { d: "M360.5 147.5c1.8 0 3.7.4 5.4 1.3l158.6 82.4c10.8 5.6 6.8 22-5.4 22H493c9.4 0 17 7.6 17 17s-7.6 17-17 17h-6.7v103.7h6.7c9.4 0 17 7.6 17 17 0 8.1-5.6 14.8-13.1 16.5H510c11 0 20 9 20 20s-9 20-20 20H210.9c-11 0-20-9-20-20s9-20 20-20H224c-7.5-1.7-13.1-8.5-13.1-16.5 0-9.4 7.6-17 17-17h6.7V287.2h-6.7c-9.4 0-17-7.6-17-17s7.6-17 17-17h-26.1c-12.2 0-16.2-16.4-5.4-22L355 148.8c1.8-.8 3.6-1.3 5.5-1.3m0-25c-5.9 0-11.7 1.4-16.9 4.1L184.9 209c-7.7 4-13.8 10.6-17 18.5-2.9 7.1-3.5 15.2-1.7 22.7 1.8 7.6 6.1 14.5 12 19.4 2.4 2 5.1 3.8 8 5.1 1.6 14.7 10.8 27.1 23.5 33.3v62.1c-13.8 6.7-23.4 20.7-23.7 37-12.1 8.1-20 21.8-20 37.4 0 24.8 20.2 45 45 45h299c24.8 0 45-20.2 45-45 0-15.6-8-29.3-20-37.4-.3-16.3-9.9-30.3-23.7-37V308c12.7-6.2 21.9-18.6 23.5-33.3 2.9-1.3 5.5-3 8-5.1 5.9-5 10.1-11.9 12-19.4 1.8-7.6 1.3-15.6-1.7-22.7-3.3-7.9-9.3-14.5-17-18.5l-158.6-82.4c-5.3-2.6-11.2-4.1-17-4.1z", fill: "#fff" })] }), jsxRuntime.jsxs("g", { children: [jsxRuntime.jsx("path", { fill: "#ededed", d: "M248.1 244.6H472.79999999999995V434.5H248.1z" }), jsxRuntime.jsx("path", { d: "M394.7 434.5h-68.4c-5 0-9.1-4.1-9.1-9.1V304.1c0-5 4.1-9.1 9.1-9.1h68.4c5 0 9.1 4.1 9.1 9.1v121.2c0 5.1-4.1 9.2-9.1 9.2z", fill: "#f59b1a" }), jsxRuntime.jsx("path", { d: "M355.1 148.8l-158.6 82.4c-10.8 5.6-6.8 22 5.4 22h317.3c12.2 0 16.2-16.4 5.4-22L366 148.8c-3.5-1.7-7.5-1.7-10.9 0z", fill: "#7c7f82" }), jsxRuntime.jsx("path", { d: "M290.2 390.9h-6.7V287.2h6.7c9.4 0 17-7.6 17-17s-7.6-17-17-17h-62.3c-9.4 0-17 7.6-17 17s7.6 17 17 17h6.7v103.7h-6.7c-9.4 0-17 7.6-17 17s7.6 17 17 17h62.3c9.4 0 17-7.6 17-17s-7.6-17-17-17zM493 390.9h-6.7V287.2h6.7c9.4 0 17-7.6 17-17s-7.6-17-17-17h-62.3c-9.4 0-17 7.6-17 17s7.6 17 17 17h6.7v103.7h-6.7c-9.4 0-17 7.6-17 17s7.6 17 17 17H493c9.4 0 17-7.6 17-17s-7.6-17-17-17z", fill: "#c4c4c4" }), jsxRuntime.jsx("circle", { cx: 360.5, cy: 206.6, r: 25, fill: "#ededed" }), jsxRuntime.jsx("path", { d: "M510 464.5H210.9c-11 0-20-9-20-20s9-20 20-20H510c11 0 20 9 20 20s-8.9 20-20 20z", fill: "#7c7f82" })] })] }))),
4023
+ coach: (jsxRuntime.jsxs("svg", __assign$2({ viewBox: "0 0 137.6 201" }, { children: [jsxRuntime.jsx("path", { d: "M68.8 118.5c-24.6 0-44.6 19.9-44.6 44.5v38h89.1v-38c0-24.6-19.9-44.5-44.5-44.5z", fill: "#d8d7d7" }), jsxRuntime.jsx("path", { d: "M78.9 101.2H58.3v16.3c0 4.7 3.8 8.6 8.6 8.6h3.5c4.7 0 8.6-3.8 8.6-8.6v-16.3z", fill: "#f9b467" }), jsxRuntime.jsx("path", { d: "M127.6 44.6c-.6 0-1.1.1-1.7.2C119.6 19.1 96.4 0 68.8 0S18 19.1 11.7 44.7c-.6-.1-1.1-.2-1.7-.2-5.5 0-10 4.5-10 10s4.5 10 10 10h.3c2.9 29.7 28 53 58.5 53s55.6-23.2 58.5-53h.3c5.5 0 10-4.5 10-10s-4.5-9.9-10-9.9z", fill: "#f9b467" }), jsxRuntime.jsx("path", { d: "M99.8 85.3c0-13.5-12.6-6.2-29.5-6.2-16.8 0-31.5-7.3-31.5 6.2s13.6 24.4 30.5 24.4 30.5-10.9 30.5-24.4z", fill: "#25120f" }), jsxRuntime.jsx("path", { d: "M69.3 109.7c6.6 0 12.7-1.7 17.6-4.5-2.3-3.2-6.2-5.5-10.7-6.2-1.9-.3-3.7-.2-5.5.1-1 .2-2 .2-2.9 0-1.7-.3-3.6-.3-5.5-.1-4.5.6-8.3 3-10.7 6.2 5.1 2.8 11.2 4.5 17.7 4.5z", fill: "#e62a44" }), jsxRuntime.jsx("path", { d: "M75.4 58.9c0-3.3-2.7-6.1-6.1-6.1-3.3 0-6.1 2.7-6.1 6.1 0 3.3 2.7 4.1 6.1 4.1 3.4-.1 6.1-.8 6.1-4.1z", opacity: 0.37, fill: "#f9b467" }), jsxRuntime.jsx("path", { d: "M38 23.4c-9.3 0-16.8 7.6-16.8 16.8v8.1c0 9.2 7.6 12.8 16.8 12.8 9.3 0 16.8-7.1 16.8-16.3v-4.6c.1-9.3-7.5-16.8-16.8-16.8z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M38 32.8c-3.2 0-5.8 2.6-5.8 5.8v10.7c0 3.2 2.6 5.8 5.8 5.8 3.2 0 5.8-2.6 5.8-5.8V38.6c.1-3.2-2.6-5.8-5.8-5.8z", fill: "#40abe1" }), jsxRuntime.jsx("path", { d: "M99.2 23.4c9.3 0 16.8 7.6 16.8 16.8v8.1c0 9.2-7.6 12.8-16.8 12.8-9.3 0-16.8-7.1-16.8-16.3v-4.6c0-9.3 7.5-16.8 16.8-16.8z", fill: "#fff" }), jsxRuntime.jsx("path", { d: "M99.2 32.8c3.2 0 5.8 2.6 5.8 5.8v10.7c0 3.2-2.6 5.8-5.8 5.8s-5.8-2.6-5.8-5.8V38.6c0-3.2 2.6-5.8 5.8-5.8z", fill: "#40abe1" }), jsxRuntime.jsx("path", { d: "M17.1 26.7c3.2-3.3 7.7-6.5 13.8-9 2.2-.9 2.7-3.7 1.1-5.3l-4.7-4.8c-1.2-1.2-3.2-1.3-4.5-.2-3 2.6-8.1 7.8-11.1 15.9-1.3 3.3 2.9 5.9 5.4 3.4zM119.9 26.7c-3.2-3.3-7.7-6.5-13.8-9-2.2-.9-2.7-3.7-1.1-5.3l4.7-4.8c1.2-1.2 3.2-1.3 4.5-.2 3 2.6 8.1 7.8 11.1 15.9 1.3 3.3-2.9 5.9-5.4 3.4z", fill: "#91878a" }), jsxRuntime.jsx("path", { d: "M7.9 54.7l.7-.7c.5-.5.5-1.4 0-1.9s-1.4-.5-1.9 0l-.7.7-.7-.7c-.5-.5-1.4-.5-1.9 0s-.5 1.4 0 1.9l.7.7-.7.7c-.5.5-.5 1.4 0 1.9.3.3.6.4.9.4.3 0 .7-.1.9-.4l.8-.7.7.7c.3.3.6.4.9.4.3 0 .7-.1.9-.4.5-.5.5-1.4 0-1.9l-.6-.7zM133.1 54.7l.7-.7c.5-.5.5-1.4 0-1.9s-1.4-.5-1.9 0l-.7.7-.7-.7c-.5-.5-1.4-.5-1.9 0s-.5 1.4 0 1.9l.7.7-.7.7c-.5.5-.5 1.4 0 1.9.3.3.6.4.9.4.3 0 .7-.1.9-.4l.7-.7.7.7c.3.3.6.4.9.4.3 0 .7-.1.9-.4.5-.5.5-1.4 0-1.9l-.5-.7z", opacity: 0.57, fill: "#f9b467" }), jsxRuntime.jsx("path", { d: "M61.7 23.2H27.1c-7.1 0-12.9 5.8-12.9 12.9v13.6c0 7.1 5.8 12.9 12.9 12.9h26.4c7.1 0 12.9-5.8 12.9-12.9V27.8c0-2.5-2.1-4.6-4.7-4.6zm.2 26.4c0 4.6-3.7 8.3-8.3 8.3H27.1c-4.6 0-8.3-3.7-8.3-8.3V36c0-4.6 3.7-8.3 8.3-8.3h34.6c.1 0 .1.1.1.1v21.8z", fill: "#1e1e1e" }), jsxRuntime.jsx("path", { d: "M61.9 27.8v21.8c0 4.6-3.7 8.3-8.3 8.3H27.1c-4.6 0-8.3-3.7-8.3-8.3V36c0-4.6 3.7-8.3 8.3-8.3h34.6c.1 0 .2.1.2.1z", opacity: 0.4, fill: "#ededee" }), jsxRuntime.jsx("path", { d: "M111.1 23.2H76.5c-2.6 0-4.7 2.1-4.7 4.7v21.8c0 7.1 5.8 12.9 12.9 12.9h26.4c7.1 0 12.9-5.8 12.9-12.9V36c0-7.1-5.8-12.8-12.9-12.8zm8.4 26.4c0 4.6-3.7 8.3-8.3 8.3H84.7c-4.6 0-8.3-3.7-8.3-8.3V27.8c0-.1.1-.1.1-.1h34.6c4.6 0 8.3 3.7 8.3 8.3v13.6z", fill: "#1e1e1e" }), jsxRuntime.jsx("path", { d: "M119.5 36v13.6c0 4.6-3.7 8.3-8.3 8.3H84.7c-4.6 0-8.3-3.7-8.3-8.3V27.8c0-.1.1-.1.1-.1h34.6c4.6 0 8.4 3.7 8.4 8.3z", opacity: 0.4, fill: "#ededee" }), jsxRuntime.jsx("path", { d: "M84.2 23.2H55.7v4.5h28.5v-4.5zM75.1 32.9H63.8v4.5h11.3v-4.5z", fill: "#1e1e1e" }), jsxRuntime.jsx("path", { d: "M83.4 120.8l-4.2-1.4c-.3-.1-.6-.1-.8.1l-9.7 6.1h-.1l-9.7-6.1c-.2-.2-.6-.2-.8-.1l-4.2 1.4c-.6.2-.8.9-.4 1.3l4.5 6.1c.5.7 1.4 1 2.2.7l6.4-2.1c.4-.1.7.1.7.5v6.6c0 .4.3.8.8.8h1.4c.4 0 .8-.3.8-.8v-6.6c0-.4.4-.6.7-.5l6.4 2.1c.8.3 1.7 0 2.2-.7l4.5-6.1c0-.5-.2-1.1-.7-1.3z", fill: "#353432" }), jsxRuntime.jsx("path", { d: "M69 141.8c9.6 0 18-7.3 21.5-17.7-.2-.1-.3-.2-.5-.3-3.5 10.2-11.6 17.4-21 17.4-9.5 0-17.7-7.3-21.1-17.6-.2.1-.3.2-.5.3 3.5 10.5 11.9 17.9 21.6 17.9z", fill: "#3a3b3a" }), jsxRuntime.jsx("path", { d: "M69.7 140.9c-.2 0-.3.2-.2.4l.3 1.2c0 .2.2.3.4.2.2 0 .3-.2.2-.4l-.3-1.2c-.1-.1-.3-.2-.4-.2zM76.2 154.1l-3.5.9c-.4.1-.8-.1-.9-.5l-1.9-7.8 4.9-1.2 1.9 7.8c.2.3-.1.7-.5.8z", fill: "#6d7171" }), jsxRuntime.jsx("path", { d: "M70.7 151.6c2.8 0 5-2.2 5-5s-2.2-5-5-5-5 2.2-5 5 2.2 5 5 5z", fill: "#888989" }), jsxRuntime.jsx("path", { d: "M76.9 154l-3.5.9c-.4.1-.8-.1-.9-.5l-1.9-7.8 4.9-1.2 1.9 7.8c.1.3-.2.7-.5.8z", fill: "#888989" })] }))),
4020
4024
  };
4021
4025
  var Illustration = function (props) { return (jsxRuntime.jsx(Wrapper$8, __assign$2({}, props, { children: illustrations[props.type] }))); };
4022
4026
 
4023
- var StyledParagraph = styled__default["default"].p(templateObject_1$L || (templateObject_1$L = __makeTemplateObject$1(["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n text-transform: ", ";\n"], ["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n text-transform: ", ";\n"])), theme.fonts.paragraph, function (_a) {
4027
+ var StyledParagraph = styled__default["default"].p(templateObject_1$M || (templateObject_1$M = __makeTemplateObject$1(["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n text-transform: ", ";\n"], ["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n line-height: ", ";\n color: ", ";\n margin: 0;\n text-align: ", ";\n text-transform: ", ";\n"])), theme.fonts.paragraph, function (_a) {
4024
4028
  var size = _a.size;
4025
4029
  return size ? theme.paragraph[size].fontSize : theme.paragraph.medium.fontSize;
4026
4030
  }, function (_a) {
@@ -4055,17 +4059,17 @@ var StyledParagraph = styled__default["default"].p(templateObject_1$L || (templa
4055
4059
  var transform = _a.transform;
4056
4060
  return transform;
4057
4061
  });
4058
- var templateObject_1$L;
4062
+ var templateObject_1$M;
4059
4063
 
4060
- var Container$l = styled__default["default"].div(templateObject_1$K || (templateObject_1$K = __makeTemplateObject$1(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
4061
- var InputIconWrapper = styled__default["default"].div(templateObject_2$w || (templateObject_2$w = __makeTemplateObject$1(["\n position: relative;\n width: 100%;\n\n input {\n padding-right: 43px;\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"], ["\n position: relative;\n width: 100%;\n\n input {\n padding-right: 43px;\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"])), function (_a) {
4064
+ var Container$m = styled__default["default"].div(templateObject_1$L || (templateObject_1$L = __makeTemplateObject$1(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
4065
+ var InputIconWrapper = styled__default["default"].div(templateObject_2$x || (templateObject_2$x = __makeTemplateObject$1(["\n position: relative;\n width: 100%;\n\n input {\n padding-right: 43px;\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"], ["\n position: relative;\n width: 100%;\n\n input {\n padding-right: 43px;\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"])), function (_a) {
4062
4066
  var isChanged = _a.isChanged;
4063
4067
  return !isChanged ? theme.colors.lightGray.darker : "";
4064
4068
  }, function (_a) {
4065
4069
  var disabled = _a.disabled;
4066
4070
  return (disabled ? "not-allowed" : "pointer");
4067
4071
  });
4068
- var StyledInput = styled__default["default"].input(templateObject_3$a || (templateObject_3$a = __makeTemplateObject$1(["\n width: 100%;\n min-width: 228px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 100%;\n min-width: 228px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
4072
+ var StyledInput = styled__default["default"].input(templateObject_3$b || (templateObject_3$b = __makeTemplateObject$1(["\n width: 100%;\n min-width: 228px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 100%;\n min-width: 228px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
4069
4073
  var disabled = _a.disabled;
4070
4074
  return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
4071
4075
  }, function (_a) {
@@ -4084,7 +4088,7 @@ var Helper = styled__default["default"](StyledParagraph)(templateObject_6$3 || (
4084
4088
  var isOk = _a.isOk;
4085
4089
  return isOk ? theme.colors.green.base : theme.colors.darkGray.light;
4086
4090
  }, fadeIn);
4087
- var templateObject_1$K, templateObject_2$w, templateObject_3$a, templateObject_4$7, templateObject_5$3, templateObject_6$3;
4091
+ var templateObject_1$L, templateObject_2$x, templateObject_3$b, templateObject_4$7, templateObject_5$3, templateObject_6$3;
4088
4092
 
4089
4093
  var expressions = {};
4090
4094
 
@@ -4182,7 +4186,7 @@ var PasswordInput = function (props) {
4182
4186
  if (props.onKeyPress)
4183
4187
  props.onKeyPress(e);
4184
4188
  };
4185
- return (jsxRuntime.jsxs(Container$l, { children: [jsxRuntime.jsxs(InputIconWrapper, __assign$2({ disabled: props.disabled }, { children: [jsxRuntime.jsx(Icon, { type: isVisible ? "eyeInvisible" : "eye", color: "gray", size: "small", onClick: toggle }), jsxRuntime.jsx(StyledInput, __assign$2({ type: isVisible ? "text" : "password" }, props, { onChange: onChange, onKeyPress: onKeyPress }))] })), props.helperLocale && value.length ? (jsxRuntime.jsxs(HelperContainer, { children: [jsxRuntime.jsxs(Helper, __assign$2({ isOk: expressions.hasCapitalLetter(value) }, { children: ["\u2022 ", translations[props.helperLocale].capitalLetter] })), jsxRuntime.jsxs(Helper, __assign$2({ isOk: expressions.hasNumber(value) }, { children: ["\u2022 ", translations[props.helperLocale].number] })), jsxRuntime.jsxs(Helper, __assign$2({ isOk: expressions.hasSpecialCharacter(value) }, { children: ["\u2022 ", translations[props.helperLocale].specialCharacter] })), jsxRuntime.jsxs(Helper, __assign$2({ isOk: value.length >= 8 }, { children: ["\u2022 ", translations[props.helperLocale].length] }))] })) : null] }));
4189
+ return (jsxRuntime.jsxs(Container$m, { children: [jsxRuntime.jsxs(InputIconWrapper, __assign$2({ disabled: props.disabled }, { children: [jsxRuntime.jsx(Icon, { type: isVisible ? "eyeInvisible" : "eye", color: "gray", size: "small", onClick: toggle }), jsxRuntime.jsx(StyledInput, __assign$2({ type: isVisible ? "text" : "password" }, props, { onChange: onChange, onKeyPress: onKeyPress }))] })), props.helperLocale && value.length ? (jsxRuntime.jsxs(HelperContainer, { children: [jsxRuntime.jsxs(Helper, __assign$2({ isOk: expressions.hasCapitalLetter(value) }, { children: ["\u2022 ", translations[props.helperLocale].capitalLetter] })), jsxRuntime.jsxs(Helper, __assign$2({ isOk: expressions.hasNumber(value) }, { children: ["\u2022 ", translations[props.helperLocale].number] })), jsxRuntime.jsxs(Helper, __assign$2({ isOk: expressions.hasSpecialCharacter(value) }, { children: ["\u2022 ", translations[props.helperLocale].specialCharacter] })), jsxRuntime.jsxs(Helper, __assign$2({ isOk: value.length >= 8 }, { children: ["\u2022 ", translations[props.helperLocale].length] }))] })) : null] }));
4186
4190
  };
4187
4191
 
4188
4192
  function requiredArgs(required, args) {
@@ -4516,7 +4520,7 @@ Input.Date = DateInput;
4516
4520
 
4517
4521
  var Logo = function (props) { return (jsxRuntime.jsxs("svg", __assign$2({ width: 396, height: 66, viewBox: "0 0 662.8 118.1", fill: "none", xmlSpace: "preserve" }, props, { children: [jsxRuntime.jsxs("g", { children: [jsxRuntime.jsx("path", { d: "M61.6 23.5c-.4-.5-.9-1.1-1.3-1.5l-4.9-4.8L42 4c-1.3-1.3-2.8-2.3-4.5-3-1.7-.7-3.5-1-5.3-1-1.8 0-3.6.4-5.3 1-1.7.7-3.2 1.7-4.5 3L4.1 22C1.5 24.6 0 28 0 31.7c0 3.6 1.5 7.1 4.1 9.7l18.3 18c2.6 2.6 6.2 4 9.8 4 3.7 0 7.2-1.4 9.8-4l13.4-13.2-4.9-4.8c-.5-.5-.9-1-1.3-1.5L35.7 53.1c-.5.5-1 .8-1.6 1.1-.6.2-1.3.4-1.9.4-.7 0-1.3-.1-1.9-.4-.6-.2-1.2-.6-1.6-1.1l-18.3-18c-.9-.9-1.5-2.2-1.5-3.5 0-1.3.5-2.5 1.5-3.5l18.3-18c.5-.5 1-.8 1.6-1.1.6-.2 1.3-.4 1.9-.4.7 0 1.3.1 1.9.4.6.2 1.2.6 1.6 1.1l13.5 13.3 4.8 4.7c.5.4.8 1 1.1 1.6.2.6.4 1.2.4 1.9v.1c0 1.3.5 2.5 1.5 3.4l4.8 4.7c1.8-2.4 2.7-5.2 2.7-8.1-.1-3-1.1-5.8-2.9-8.2z", fill: "#e62743" }), jsxRuntime.jsx("path", { d: "M153.3 22L135 4c-1.3-1.3-2.8-2.3-4.5-3-1.7-.7-3.5-1-5.3-1-1.8 0-3.6.4-5.3 1-1.7.7-3.2 1.7-4.5 3L102 17.2 97.1 22c-.5.5-.9 1-1.3 1.5-1.8 2.4-2.8 5.2-2.8 8.2 0 2.9 1 5.8 2.7 8.1l4.8-4.7c.9-.9 1.4-2.1 1.5-3.4 0-.6.1-1.3.4-1.9.2-.6.6-1.1 1.1-1.6l4.8-4.7 13.5-13.3c.5-.5 1-.8 1.6-1.1.6-.2 1.2-.4 1.9-.4s1.3.1 1.9.4c.6.2 1.1.6 1.6 1.1l18.3 18c.5.5.8 1 1.1 1.6.3.6.4 1.2.4 1.9 0 .6-.1 1.3-.4 1.9-.3.6-.6 1.1-1.1 1.6l-18.3 18c-.5.5-1 .8-1.6 1.1-.6.2-1.2.4-1.9.4s-1.3-.1-1.9-.4c-.6-.2-1.1-.6-1.6-1.1l-13.5-13.3c-.4.5-.8 1.1-1.3 1.5l-4.9 4.8 13.4 13.2c1.3 1.3 2.8 2.3 4.5 3 1.7.7 3.5 1 5.3 1 1.8 0 3.6-.4 5.3-1 1.7-.7 3.2-1.7 4.5-3l18.3-18c1.3-1.3 2.3-2.8 3-4.5.7-1.7 1.1-3.5 1.1-5.3 0-1.8-.4-3.6-1.1-5.3-.8-1.5-1.8-3-3.1-4.3z", fill: "#53b476" }), jsxRuntime.jsx("path", { d: "M61.9 23.3l-.3.3c-.4-.5-.9-1.1-1.3-1.5l-4.9-4.8L68.8 4c1.3-1.3 2.8-2.3 4.5-3 1.7-.7 3.5-1 5.3-1s3.6.4 5.3 1c1.7.7 3.2 1.7 4.5 3l13.4 13.1-4.7 4.9c-.5.5-.9 1-1.3 1.5L82.2 10.2c-.5-.5-1-.8-1.6-1.1-.6-.2-1.3-.4-1.9-.4-.7 0-1.3.1-1.9.4-.6.2-1.2.6-1.6 1.1L61.9 23.3zm41.5 4.9l4.8-4.7c1.8 2.4 2.7 5.2 2.7 8.2 0 2.9-1 5.8-2.7 8.2-.4.5-.8 1.1-1.3 1.5l-4.9 4.8-13.5 13.2c-2.6 2.6-6.2 4-9.8 4s-7.2-1.4-9.8-4L55.4 46.1l-4.9-4.8c-.5-.5-.9-1-1.3-1.5-1.8-2.4-2.7-5.2-2.7-8.1 0-2.9 1-5.8 2.7-8.1l4.8 4.7c.5.4.8 1 1.1 1.6.2.6.4 1.2.4 1.9v.1c0 1.3.5 2.5 1.5 3.4l4.8 4.7 13.5 13.3c.5.5 1 .8 1.6 1.1s1.3.4 1.9.4 1.3-.1 1.9-.4 1.2-.6 1.6-1.1L95.8 40l4.8-4.7c.9-.9 1.4-2.1 1.5-3.4 0-.6.1-1.3.4-1.9 0-.8.4-1.3.9-1.8z", fillRule: "evenodd", clipRule: "evenodd", fill: "#ffd800" }), jsxRuntime.jsx("path", { d: "M130 76.6l-18.3-18c-2.6-2.6-6.2-4-9.8-4-3.7 0-7.2 1.4-9.8 4L78.7 71.9l-4.9 4.8c-.5.5-.9 1-1.3 1.5-1.8 2.4-2.7 5.2-2.7 8.1 0 2.9 1 5.8 2.7 8.1l4.8-4.7c.9-.9 1.4-2.1 1.5-3.4 0-1.3.5-2.5 1.5-3.4l4.8-4.7 13.5-13.3c.9-.9 2.2-1.4 3.5-1.4 1.3 0 2.6.5 3.5 1.4l18.3 18c.9.9 1.5 2.2 1.5 3.5 0 1.3-.5 2.5-1.5 3.5l-18.3 18c-.9.9-2.2 1.4-3.5 1.4-1.3 0-2.6-.5-3.5-1.4L84.9 94.5c-.4.6-.8 1.1-1.3 1.5l-4.9 4.8L92.1 114c2.6 2.6 6.2 4 9.8 4 3.7 0 7.2-1.4 9.8-4L130 96c1.3-1.3 2.3-2.8 3-4.5.7-1.7 1.1-3.5 1.1-5.3 0-1.8-.4-3.6-1.1-5.3-.6-1.5-1.7-3-3-4.3z", fill: "#8c5ca2" }), jsxRuntime.jsx("path", { d: "M84.9 78.2l-4.8 4.7c-.9.9-1.4 2.1-1.5 3.4 0 1.3-.5 2.5-1.5 3.4l-4.8 4.7-13.5 13.3c-.9.9-2.2 1.4-3.5 1.4s-2.6-.5-3.5-1.4l-18.3-18c-.9-.9-1.4-2.2-1.4-3.5s.5-2.5 1.4-3.5l18.3-18c.9-.9 2.2-1.4 3.5-1.4s2.6.5 3.5 1.4L72.3 78c.4-.5.8-1.1 1.3-1.5l4.9-4.8-13.3-13c-2.6-2.6-6.2-4-9.8-4-3.7 0-7.2 1.4-9.8 4l-18.3 18c-2.6 2.6-4.1 6.1-4.1 9.7s1.5 7.1 4.1 9.7l18.3 18c2.6 2.6 6.2 4 9.8 4 3.7 0 7.2-1.4 9.8-4l13.4-13.2 4.9-4.8c.5-.5.9-1 1.3-1.5 1.8-2.4 2.7-5.2 2.7-8.1.1-3.1-.9-5.9-2.6-8.3z", fill: "#3da9e1" })] }), jsxRuntime.jsxs("g", __assign$2({ fill: "#23292f" }, { children: [jsxRuntime.jsx("path", { d: "M236.6 21.5c-1.1-1-2.4-1.5-3.9-1.5h-40.2c-1.6 0-2.9.5-3.9 1.4-1.1.9-1.6 2.2-1.6 3.8 0 1.6.5 2.8 1.6 3.8s2.4 1.5 3.9 1.5h14.2V78c0 1.6.5 2.9 1.6 3.9 1.1 1.1 2.5 1.6 4.2 1.6 1.8 0 3.2-.5 4.3-1.6 1.1-1.1 1.7-2.4 1.7-3.9V30.4h14.2c1.6 0 2.9-.5 3.9-1.4 1.1-.9 1.6-2.2 1.6-3.8 0-1.5-.5-2.8-1.6-3.7z" }), jsxRuntime.jsx("path", { d: "M270.6 36.6c-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9v23.2c0 2.3-.4 4.2-1.2 5.8-.8 1.6-1.9 2.8-3.4 3.6-1.5.8-3.2 1.2-5.3 1.2-3.1 0-5.5-.8-7.2-2.4-1.7-1.6-2.6-4.4-2.6-8.3V40.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9V67c0 3.4.7 6.4 2 9 1.3 2.6 3.2 4.7 5.6 6.2 2.4 1.5 5.2 2.2 8.4 2.2 2.7 0 5.1-.3 7.3-1 2.1-.7 3.9-1.6 5.5-2.9.7-.6 1.3-1.3 1.9-2v1c0 3.1-.5 5.5-1.4 7.3-.9 1.8-2.3 3.1-4.2 3.8-1.8.8-4.2 1.1-6.9 1.1-2.1 0-3.9-.3-5.4-1-1.6-.6-2.8-1.1-3.8-1.4-1.3-.5-2.6-.4-3.8.2-1.2.6-2.1 1.8-2.6 3.6-.4 1.3-.3 2.6.4 3.8.7 1.2 1.9 2.2 3.8 2.9 1.4.6 3.2 1.1 5.3 1.4 2.2.3 4.2.5 6.2.5 4.4 0 8.3-.7 11.8-2.2 3.5-1.4 6.3-3.8 8.4-7.1 2.1-3.3 3.1-7.7 3.1-13.3V40.5c-.3-1.6-.8-2.9-1.8-3.9zM327.5 46.1c-2-3.7-4.6-6.7-8-8.8-3.4-2.1-7.1-3.2-11.4-3.2-2.1 0-4.1.4-6 1.1-1.9.7-3.6 1.6-5 2.8-1.3 1-2.4 2-3.2 3.1v-.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9v55.6c0 1.6.5 3 1.5 4s2.3 1.5 3.9 1.5 2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V78.3c.6.6 1.4 1.3 2.2 1.9 1.6 1.2 3.5 2.2 5.6 3 2.1.8 4.4 1.2 6.8 1.2 4.1 0 7.8-1.1 11.1-3.2s5.9-5.1 7.9-8.9c2-3.8 2.9-8.1 2.9-13.1s-1-9.3-2.9-13.1zm-9.2 20.8c-1.1 2.3-2.7 4.2-4.6 5.5-2 1.3-4.3 2-6.9 2s-5-.7-7-2-3.6-3.2-4.7-5.5-1.7-4.9-1.7-7.8c0-2.9.6-5.5 1.7-7.8s2.7-4.1 4.7-5.4c2-1.3 4.3-2 7-2s5 .7 6.9 2c2 1.3 3.5 3.1 4.6 5.4 1.1 2.3 1.7 4.8 1.7 7.8 0 2.9-.6 5.5-1.7 7.8zM380.4 61.6c1.1-.9 1.7-2.1 1.7-3.5 0-3.3-.6-6.3-1.9-9.2-1.2-2.9-2.9-5.5-5-7.7s-4.5-3.9-7.3-5.2c-2.8-1.3-5.7-1.9-8.7-1.9-4 0-7.8 1-11.3 3.1-3.6 2.1-6.5 5-8.7 8.8-2.2 3.8-3.3 8.5-3.3 13.9 0 4.7 1 8.8 3 12.5 2 3.7 4.9 6.6 8.7 8.7 3.8 2.1 8.2 3.2 13.4 3.2 3 0 6-.5 8.8-1.5 2.8-1 5-2.2 6.6-3.5 1.7-1.3 2.5-2.8 2.5-4.4 0-1.2-.4-2.3-1.3-3.2-.9-.9-2-1.4-3.3-1.4-1 0-2 .3-3.1.8-.7.4-1.4.8-2.2 1.3-.8.5-1.9 1-3.2 1.3-1.3.4-3.1.5-5.3.5-2.4 0-4.7-.6-6.8-1.8-2.1-1.2-3.9-2.9-5.3-5.2-.8-1.3-1.3-2.8-1.7-4.5h29.9c1.4.3 2.7-.2 3.8-1.1zM350 47.2c1.1-1.1 2.5-2 4.1-2.4 1.6-.5 3.3-.7 5.1-.7 1.9 0 3.6.4 5.3 1.2 1.7.8 3.1 1.9 4.2 3.3s1.7 3 1.9 4.7v.6h-23.7c.1-.7.3-1.5.5-2.1.5-1.9 1.5-3.4 2.6-4.6zM447.3 39.1c-1.5-3.9-3.6-7.4-6.4-10.4-2.8-3-6-5.3-9.8-7-3.8-1.7-7.9-2.5-12.4-2.5s-8.6.8-12.3 2.5c-3.7 1.7-7 4-9.7 7-2.8 3-4.9 6.5-6.4 10.4-1.5 3.9-2.3 8.2-2.3 12.7s.8 8.8 2.3 12.7c1.5 3.9 3.6 7.4 6.4 10.4 2.7 3 6 5.3 9.7 7 3.7 1.7 7.9 2.5 12.3 2.5 4.5 0 8.6-.8 12.4-2.5 3.8-1.7 7-4 9.8-7 2.8-3 4.9-6.5 6.4-10.4 1.5-3.9 2.3-8.2 2.3-12.7-.1-4.6-.8-8.8-2.3-12.7zm-12 23.7c-1.6 3.3-3.9 5.9-6.7 7.8-2.8 1.9-6.1 2.9-9.9 2.9-3.7 0-7-1-9.9-2.9-2.8-1.9-5.1-4.5-6.7-7.8-1.6-3.3-2.4-7-2.4-11 0-4.1.8-7.8 2.4-11.1 1.6-3.3 3.8-5.9 6.7-7.8 2.8-1.9 6.1-2.9 9.9-2.9 3.7 0 7 1 9.9 2.9 2.8 1.9 5.1 4.5 6.7 7.8 1.6 3.3 2.4 7 2.4 11 .1 4.1-.8 7.8-2.4 11.1zM468.4 18c-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6c-1.1 1.1-1.6 2.4-1.6 3.9v56c0 1.6.5 2.9 1.5 3.9 1 1.1 2.3 1.6 3.8 1.6 1.6 0 2.9-.5 3.9-1.6 1.1-1.1 1.6-2.4 1.6-3.9v-56c.1-1.5-.4-2.9-1.4-3.9zM520.2 36.6c-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9v23.2c0 2.3-.4 4.2-1.2 5.8-.8 1.6-1.9 2.8-3.4 3.6-1.4.8-3.2 1.2-5.3 1.2-3.1 0-5.5-.8-7.2-2.4-1.7-1.6-2.6-4.4-2.6-8.3V40.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9V67c0 3.4.7 6.4 2 9 1.3 2.6 3.2 4.7 5.6 6.2 2.4 1.5 5.2 2.2 8.4 2.2 2.7 0 5.1-.3 7.3-1 2.1-.7 3.9-1.6 5.5-2.9.7-.6 1.3-1.3 1.9-2v1c0 3.1-.5 5.5-1.4 7.3-.9 1.8-2.3 3.1-4.2 3.8-1.8.8-4.2 1.1-6.9 1.1-2.1 0-3.9-.3-5.4-1-1.6-.6-2.8-1.1-3.8-1.4-1.3-.5-2.6-.4-3.8.2-1.2.6-2.1 1.8-2.6 3.6-.4 1.3-.3 2.6.4 3.8.7 1.2 1.9 2.2 3.8 2.9 1.4.6 3.2 1.1 5.3 1.4 2.2.3 4.2.5 6.2.5 4.4 0 8.3-.7 11.8-2.2 3.5-1.4 6.3-3.8 8.4-7.1 2.1-3.3 3.1-7.7 3.1-13.3V40.5c-.2-1.6-.7-2.9-1.8-3.9zM603.2 44.4c-.8-3.1-2.4-5.6-4.7-7.5s-5.6-2.8-9.9-2.8c-2.7 0-5.1.6-7.2 1.7-2.1 1.1-4 2.5-5.5 4.1-1.4 1.5-2.5 2.9-3.2 4.2-.8-2.6-2.1-4.7-3.9-6.5-2.3-2.3-5.9-3.5-10.7-3.5-2 0-3.8.3-5.5 1-1.7.6-3.2 1.5-4.6 2.5-1.4 1-2.6 2.1-3.5 3.3l-.9 1.2v-1.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9V78c0 1.6.5 2.9 1.5 3.9 1 1.1 2.3 1.6 3.9 1.6s2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V54.7c0-2 .4-3.8 1.2-5.4.8-1.6 2-2.9 3.7-3.9 1.6-1 3.6-1.4 5.9-1.4 2.4 0 4.2.5 5.4 1.4 1.3 1 2.1 2.3 2.6 3.9s.7 3.4.7 5.4v23.2c0 1.6.5 2.9 1.5 3.9 1 1.1 2.3 1.6 3.9 1.6s2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V54.7c0-2 .4-3.8 1.2-5.4.8-1.6 2-2.9 3.7-3.9 1.6-1 3.6-1.4 5.9-1.4 2.4 0 4.2.5 5.4 1.4 1.3 1 2.1 2.3 2.6 3.9s.7 3.4.7 5.4v23.2c0 1.6.5 2.9 1.5 3.9 1 1.1 2.3 1.6 3.9 1.6s2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V54.7c.3-3.8-.2-7.2-1-10.3zM659.8 46.1c-2-3.7-4.6-6.7-8-8.8-3.4-2.1-7.1-3.2-11.4-3.2-2.1 0-4.1.4-6 1.1-1.9.7-3.6 1.6-5 2.8-1.3 1-2.4 2-3.2 3.1v-.5c0-1.6-.5-2.9-1.5-3.9-1-1.1-2.3-1.6-3.9-1.6s-2.9.5-3.9 1.6-1.5 2.4-1.5 3.9v55.6c0 1.6.5 3 1.5 4s2.3 1.5 3.9 1.5 2.9-.5 3.9-1.6 1.5-2.4 1.5-3.9V78.3c.6.6 1.4 1.3 2.2 1.9 1.6 1.2 3.5 2.2 5.6 3s4.4 1.2 6.8 1.2c4.1 0 7.8-1.1 11.1-3.2s5.9-5.1 7.9-8.9c2-3.8 2.9-8.1 2.9-13.1.1-5-.9-9.3-2.9-13.1zm-9.1 20.8c-1.1 2.3-2.7 4.2-4.6 5.5-2 1.3-4.3 2-6.9 2s-5-.7-7-2-3.5-3.2-4.7-5.5c-1.1-2.3-1.7-4.9-1.7-7.8 0-2.9.6-5.5 1.7-7.8s2.7-4.1 4.7-5.4c2-1.3 4.3-2 7-2s5 .7 6.9 2c2 1.3 3.5 3.1 4.6 5.4 1.1 2.3 1.7 4.8 1.7 7.8-.1 2.9-.6 5.5-1.7 7.8z" })] }))] }))); };
4518
4522
 
4519
- var Wrapper$7 = styled__default["default"].div(templateObject_1$J || (templateObject_1$J = __makeTemplateObject$1(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
4523
+ var Wrapper$7 = styled__default["default"].div(templateObject_1$K || (templateObject_1$K = __makeTemplateObject$1(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
4520
4524
  var size = _a.size;
4521
4525
  switch (size) {
4522
4526
  default:
@@ -4526,7 +4530,7 @@ var Wrapper$7 = styled__default["default"].div(templateObject_1$J || (templateOb
4526
4530
  return "116px";
4527
4531
  }
4528
4532
  });
4529
- var templateObject_1$J;
4533
+ var templateObject_1$K;
4530
4534
 
4531
4535
  var medals = {
4532
4536
  small: {
@@ -4542,11 +4546,11 @@ var medals = {
4542
4546
  };
4543
4547
  var Medal = function (props) { return (jsxRuntime.jsx(Wrapper$7, __assign$2({}, props, { children: medals[props.size || "small"][props.type] }))); };
4544
4548
 
4545
- var Wrapper$6 = styled__default["default"].div(templateObject_1$I || (templateObject_1$I = __makeTemplateObject$1(["\n width: fit-content;\n display: flex;\n\n button:first-child {\n border-radius: 6px 0 0 6px;\n border-width: 2px 1px 2px 2px;\n }\n\n button:last-child {\n border-radius: 0 6px 6px 0;\n border-width: 2px 2px 2px 1px;\n }\n\n button {\n width: ", ";\n }\n"], ["\n width: fit-content;\n display: flex;\n\n button:first-child {\n border-radius: 6px 0 0 6px;\n border-width: 2px 1px 2px 2px;\n }\n\n button:last-child {\n border-radius: 0 6px 6px 0;\n border-width: 2px 2px 2px 1px;\n }\n\n button {\n width: ", ";\n }\n"])), function (_a) {
4549
+ var Wrapper$6 = styled__default["default"].div(templateObject_1$J || (templateObject_1$J = __makeTemplateObject$1(["\n width: fit-content;\n display: flex;\n\n button:first-child {\n border-radius: 6px 0 0 6px;\n border-width: 2px 1px 2px 2px;\n }\n\n button:last-child {\n border-radius: 0 6px 6px 0;\n border-width: 2px 2px 2px 1px;\n }\n\n button {\n width: ", ";\n }\n"], ["\n width: fit-content;\n display: flex;\n\n button:first-child {\n border-radius: 6px 0 0 6px;\n border-width: 2px 1px 2px 2px;\n }\n\n button:last-child {\n border-radius: 0 6px 6px 0;\n border-width: 2px 2px 2px 1px;\n }\n\n button {\n width: ", ";\n }\n"])), function (_a) {
4546
4550
  var disabled = _a.disabled;
4547
4551
  return (disabled ? "49.5px" : "");
4548
4552
  });
4549
- var StyledInputNumber = styled__default["default"].input(templateObject_2$v || (templateObject_2$v = __makeTemplateObject$1(["\n width: 50px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n text-align: center;\n -moz-appearance: textfield;\n\n ::-webkit-inner-spin-button {\n -webkit-appearance: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 50px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n text-align: center;\n -moz-appearance: textfield;\n\n ::-webkit-inner-spin-button {\n -webkit-appearance: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
4553
+ var StyledInputNumber = styled__default["default"].input(templateObject_2$w || (templateObject_2$w = __makeTemplateObject$1(["\n width: 50px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n text-align: center;\n -moz-appearance: textfield;\n\n ::-webkit-inner-spin-button {\n -webkit-appearance: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 50px;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 400;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n text-align: center;\n -moz-appearance: textfield;\n\n ::-webkit-inner-spin-button {\n -webkit-appearance: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
4550
4554
  var disabled = _a.disabled;
4551
4555
  return disabled ? theme.colors.lightGray.base : theme.colors.lightGray.light;
4552
4556
  }, function (_a) {
@@ -4559,7 +4563,7 @@ var StyledInputNumber = styled__default["default"].input(templateObject_2$v || (
4559
4563
  var disabled = _a.disabled;
4560
4564
  return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
4561
4565
  }, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
4562
- var templateObject_1$I, templateObject_2$v;
4566
+ var templateObject_1$J, templateObject_2$w;
4563
4567
 
4564
4568
  var Number$1 = function (props) {
4565
4569
  var inputRef = React$3.useRef(null);
@@ -4598,7 +4602,7 @@ var Number$1 = function (props) {
4598
4602
 
4599
4603
  var Paragraph = function (props) { return (jsxRuntime.jsx(StyledParagraph, __assign$2({}, props, { children: props.children }))); };
4600
4604
 
4601
- var StyledRadio = styled__default["default"].div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject$1(["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 14px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :after {\n content: \"\";\n width: 15px;\n height: 15px;\n border-radius: 50%;\n background-color: ", ";\n position: absolute;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 14px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :after {\n content: \"\";\n width: 15px;\n height: 15px;\n border-radius: 50%;\n background-color: ", ";\n position: absolute;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
4605
+ var StyledRadio = styled__default["default"].div(templateObject_1$I || (templateObject_1$I = __makeTemplateObject$1(["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 14px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :after {\n content: \"\";\n width: 15px;\n height: 15px;\n border-radius: 50%;\n background-color: ", ";\n position: absolute;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n min-height: 25px;\n max-height: 25px;\n min-width: 25px;\n max-width: 25px;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 14px;\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n cursor: ", ";\n background-color: ", ";\n\n svg {\n margin-left: -1px;\n fill: ", ";\n }\n\n input {\n display: none;\n }\n\n :after {\n content: \"\";\n width: 15px;\n height: 15px;\n border-radius: 50%;\n background-color: ", ";\n position: absolute;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
4602
4606
  var checked = _a.checked, disabled = _a.disabled;
4603
4607
  if (disabled)
4604
4608
  return theme.colors.lightGray.darker;
@@ -4626,7 +4630,7 @@ var StyledRadio = styled__default["default"].div(templateObject_1$H || (template
4626
4630
  return theme.colors.green.base;
4627
4631
  return "";
4628
4632
  }, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
4629
- var templateObject_1$H;
4633
+ var templateObject_1$I;
4630
4634
 
4631
4635
  var Radio = function (props) {
4632
4636
  var _a, _b;
@@ -4658,7 +4662,7 @@ var Radio = function (props) {
4658
4662
  return (jsxRuntime.jsx(StyledRadio, __assign$2({ checked: checked, disabled: props.disabled, tabIndex: 0, onClick: toggle, onBlur: props.onBlur, onKeyPress: function (e) { return (e.key === "Enter" ? toggle() : null); }, ref: wrapperRef }, { children: jsxRuntime.jsx("input", { type: "radio", disabled: !!props.disabled, id: props.id, name: props.name, value: props.value, ref: inputRef }) })));
4659
4663
  };
4660
4664
 
4661
- var StyledRange = styled__default["default"].div(templateObject_1$G || (templateObject_1$G = __makeTemplateObject$1(["\n input {\n appearance: none;\n width: 100%;\n height: 11px;\n border: ", ";\n border-radius: 8px;\n position: relative;\n background: ", ";\n\n ::-webkit-slider-thumb {\n appearance: none;\n width: 24px;\n height: 24px;\n background-color: ", ";\n border: ", ";\n border-radius: 50%;\n cursor: ", ";\n }\n }\n"], ["\n input {\n appearance: none;\n width: 100%;\n height: 11px;\n border: ", ";\n border-radius: 8px;\n position: relative;\n background: ", ";\n\n ::-webkit-slider-thumb {\n appearance: none;\n width: 24px;\n height: 24px;\n background-color: ", ";\n border: ", ";\n border-radius: 50%;\n cursor: ", ";\n }\n }\n"])), function () { return "2px solid ".concat(theme.colors.lightGray.dark); }, function (_a) {
4665
+ var StyledRange = styled__default["default"].div(templateObject_1$H || (templateObject_1$H = __makeTemplateObject$1(["\n input {\n appearance: none;\n width: 100%;\n height: 11px;\n border: ", ";\n border-radius: 8px;\n position: relative;\n background: ", ";\n\n ::-webkit-slider-thumb {\n appearance: none;\n width: 24px;\n height: 24px;\n background-color: ", ";\n border: ", ";\n border-radius: 50%;\n cursor: ", ";\n }\n }\n"], ["\n input {\n appearance: none;\n width: 100%;\n height: 11px;\n border: ", ";\n border-radius: 8px;\n position: relative;\n background: ", ";\n\n ::-webkit-slider-thumb {\n appearance: none;\n width: 24px;\n height: 24px;\n background-color: ", ";\n border: ", ";\n border-radius: 50%;\n cursor: ", ";\n }\n }\n"])), function () { return "2px solid ".concat(theme.colors.lightGray.dark); }, function (_a) {
4662
4666
  var value = _a.value, disabled = _a.disabled;
4663
4667
  return "linear-gradient(90deg,\n ".concat(disabled ? theme.colors.lightGray.darker : theme.colors.green.base, " 0%,\n ").concat(disabled ? theme.colors.lightGray.darker : theme.colors.green.base, " ").concat(value, "%,\n ").concat(theme.colors.lightGray.dark, " ").concat(value, "%,\n ").concat(theme.colors.lightGray.dark, " 100%\n )");
4664
4668
  }, function () { return theme.colors.lightGray.light; }, function (_a) {
@@ -4668,7 +4672,7 @@ var StyledRange = styled__default["default"].div(templateObject_1$G || (template
4668
4672
  var disabled = _a.disabled;
4669
4673
  return disabled ? "not-allowed" : "pointer";
4670
4674
  });
4671
- var templateObject_1$G;
4675
+ var templateObject_1$H;
4672
4676
 
4673
4677
  var Range = function (props) {
4674
4678
  var _a;
@@ -4697,11 +4701,11 @@ var Range = function (props) {
4697
4701
  return (jsxRuntime.jsx(StyledRange, __assign$2({ value: value, disabled: props.disabled }, { children: jsxRuntime.jsx("input", { type: "range", disabled: !!props.disabled, id: props.id, min: props.min || 0, max: props.max || 100, ref: rangeRef, defaultValue: props.defaultValue, onChange: onChange, onBlur: props.onBlur }) })));
4698
4702
  };
4699
4703
 
4700
- var Wrapper$5 = styled__default["default"].div(templateObject_1$F || (templateObject_1$F = __makeTemplateObject$1(["\n position: relative;\n\n div {\n pointer-events: none;\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"], ["\n position: relative;\n\n div {\n pointer-events: none;\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"])), function (_a) {
4704
+ var Wrapper$5 = styled__default["default"].div(templateObject_1$G || (templateObject_1$G = __makeTemplateObject$1(["\n position: relative;\n\n div {\n pointer-events: none;\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"], ["\n position: relative;\n\n div {\n pointer-events: none;\n position: absolute;\n height: 24px;\n right: 12px;\n top: 14px;\n }\n\n svg {\n cursor: ", ";\n }\n"])), function (_a) {
4701
4705
  var disabled = _a.disabled;
4702
4706
  return (disabled ? "not-allowed" : "pointer");
4703
4707
  });
4704
- var StyledSelect = styled__default["default"].select(templateObject_2$u || (templateObject_2$u = __makeTemplateObject$1(["\n width: 100%;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 43px 15px 13px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n appearance: none;\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 100%;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 43px 15px 13px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n appearance: none;\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
4708
+ var StyledSelect = styled__default["default"].select(templateObject_2$v || (templateObject_2$v = __makeTemplateObject$1(["\n width: 100%;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 43px 15px 13px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n appearance: none;\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 100%;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 43px 15px 13px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n appearance: none;\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
4705
4709
  var disabled = _a.disabled;
4706
4710
  return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
4707
4711
  }, function (_a) {
@@ -4714,7 +4718,7 @@ var StyledSelect = styled__default["default"].select(templateObject_2$u || (temp
4714
4718
  var isChanged = _a.isChanged;
4715
4719
  return isChanged ? theme.colors.darkGray.base : theme.colors.lightGray.darker;
4716
4720
  }, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
4717
- var templateObject_1$F, templateObject_2$u;
4721
+ var templateObject_1$G, templateObject_2$v;
4718
4722
 
4719
4723
  var Select = function (props) {
4720
4724
  var _a;
@@ -4736,18 +4740,18 @@ var Select = function (props) {
4736
4740
  return (jsxRuntime.jsxs(Wrapper$5, { children: [jsxRuntime.jsx(Icon, { type: "chevronDown", color: "gray", size: "small" }), jsxRuntime.jsxs(StyledSelect, __assign$2({}, props, { onChange: onChange, isChanged: isChanged || props.defaultValue, ref: inputRef }, { children: [props.placeholder && jsxRuntime.jsx("option", __assign$2({ hidden: true }, { children: props.placeholder })), props.children] }))] }));
4737
4741
  };
4738
4742
 
4739
- var StyledSpacer = styled__default["default"].div(templateObject_1$E || (templateObject_1$E = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
4743
+ var StyledSpacer = styled__default["default"].div(templateObject_1$F || (templateObject_1$F = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
4740
4744
  var horizontal = _a.horizontal;
4741
4745
  return (horizontal ? "".concat(horizontal, "px") : "");
4742
4746
  }, function (_a) {
4743
4747
  var vertical = _a.vertical;
4744
4748
  return (vertical ? "".concat(vertical, "px") : "");
4745
4749
  });
4746
- var templateObject_1$E;
4750
+ var templateObject_1$F;
4747
4751
 
4748
4752
  var Spacer = function (props) { return (jsxRuntime.jsx(StyledSpacer, __assign$2({}, props))); };
4749
4753
 
4750
- var StyledSubheading = styled__default["default"].p(templateObject_1$D || (templateObject_1$D = __makeTemplateObject$1(["\n font-family: ", ";\n font-style: normal;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n text-align: ", ";\n margin: 0;\n color: ", ";\n"], ["\n font-family: ", ";\n font-style: normal;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n text-align: ", ";\n margin: 0;\n color: ", ";\n"])), theme.fonts.paragraph, function (_a) {
4754
+ var StyledSubheading = styled__default["default"].p(templateObject_1$E || (templateObject_1$E = __makeTemplateObject$1(["\n font-family: ", ";\n font-style: normal;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n text-align: ", ";\n margin: 0;\n color: ", ";\n"], ["\n font-family: ", ";\n font-style: normal;\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n text-align: ", ";\n margin: 0;\n color: ", ";\n"])), theme.fonts.paragraph, function (_a) {
4751
4755
  var size = _a.size;
4752
4756
  return size ? theme.subheading[size].fontSize : theme.subheading.medium.fontSize;
4753
4757
  }, function (_a) {
@@ -4775,18 +4779,18 @@ var StyledSubheading = styled__default["default"].p(templateObject_1$D || (templ
4775
4779
  return theme.colors.darkGray.dark;
4776
4780
  }
4777
4781
  });
4778
- var templateObject_1$D;
4782
+ var templateObject_1$E;
4779
4783
 
4780
4784
  var Subheading = function (props) { return (jsxRuntime.jsx(StyledSubheading, __assign$2({}, props, { children: props.children }))); };
4781
4785
 
4782
- var Container$k = styled__default["default"].div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject$1(["\n padding: 7px 10px;\n background-color: ", ";\n box-shadow: 0 2px 0 ", ";\n border: 1px solid ", ";\n border-radius: 4px;\n box-sizing: border-box;\n text-decoration: none;\n"], ["\n padding: 7px 10px;\n background-color: ", ";\n box-shadow: 0 2px 0 ", ";\n border: 1px solid ", ";\n border-radius: 4px;\n box-sizing: border-box;\n text-decoration: none;\n"])), theme.colors.lightGray.base, theme.colors.lightGray.darker, theme.colors.lightGray.darker);
4783
- var templateObject_1$C;
4786
+ var Container$l = styled__default["default"].div(templateObject_1$D || (templateObject_1$D = __makeTemplateObject$1(["\n padding: 7px 10px;\n background-color: ", ";\n box-shadow: 0 2px 0 ", ";\n border: 1px solid ", ";\n border-radius: 4px;\n box-sizing: border-box;\n text-decoration: none;\n\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n color: ", ";\n"], ["\n padding: 7px 10px;\n background-color: ", ";\n box-shadow: 0 2px 0 ", ";\n border: 1px solid ", ";\n border-radius: 4px;\n box-sizing: border-box;\n text-decoration: none;\n\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n color: ", ";\n"])), theme.colors.lightGray.base, theme.colors.lightGray.darker, theme.colors.lightGray.darker, theme.fonts.paragraph, theme.subheading.small.fontSize, theme.subheading.small.fontWeight, theme.colors.darkGray.light);
4787
+ var templateObject_1$D;
4784
4788
 
4785
4789
  var Tag = function (props) {
4786
- return jsxRuntime.jsx(Container$k, { children: props.children });
4790
+ return jsxRuntime.jsx(Container$l, { children: props.children });
4787
4791
  };
4788
4792
 
4789
- var Container$j = styled__default["default"].div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject$1(["\n width: 46px;\n min-width: 46px;\n max-width: 46px;\n height: 27px;\n min-height: 27px;\n max-height: 27px;\n border-radius: 14px;\n cursor: ", ";\n position: relative;\n background-color: ", ";\n\n :after {\n content: \"\";\n width: 21px;\n height: 21px;\n border-radius: 50%;\n position: absolute;\n top: 3px;\n right: ", ";\n left: ", ";\n background-color: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 46px;\n min-width: 46px;\n max-width: 46px;\n height: 27px;\n min-height: 27px;\n max-height: 27px;\n border-radius: 14px;\n cursor: ", ";\n position: relative;\n background-color: ", ";\n\n :after {\n content: \"\";\n width: 21px;\n height: 21px;\n border-radius: 50%;\n position: absolute;\n top: 3px;\n right: ", ";\n left: ", ";\n background-color: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
4793
+ var Container$k = styled__default["default"].div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject$1(["\n width: 46px;\n min-width: 46px;\n max-width: 46px;\n height: 27px;\n min-height: 27px;\n max-height: 27px;\n border-radius: 14px;\n cursor: ", ";\n position: relative;\n background-color: ", ";\n\n :after {\n content: \"\";\n width: 21px;\n height: 21px;\n border-radius: 50%;\n position: absolute;\n top: 3px;\n right: ", ";\n left: ", ";\n background-color: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 46px;\n min-width: 46px;\n max-width: 46px;\n height: 27px;\n min-height: 27px;\n max-height: 27px;\n border-radius: 14px;\n cursor: ", ";\n position: relative;\n background-color: ", ";\n\n :after {\n content: \"\";\n width: 21px;\n height: 21px;\n border-radius: 50%;\n position: absolute;\n top: 3px;\n right: ", ";\n left: ", ";\n background-color: ", ";\n }\n\n input {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
4790
4794
  var disabled = _a.disabled;
4791
4795
  return (disabled ? "not-allowed" : "pointer");
4792
4796
  }, function (_a) {
@@ -4804,7 +4808,7 @@ var Container$j = styled__default["default"].div(templateObject_1$B || (template
4804
4808
  var disabled = _a.disabled;
4805
4809
  return disabled ? theme.colors.lightGray.darker : theme.colors.lightGray.light;
4806
4810
  }, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
4807
- var templateObject_1$B;
4811
+ var templateObject_1$C;
4808
4812
 
4809
4813
  var Toggle = function (props) {
4810
4814
  var _a;
@@ -4832,10 +4836,10 @@ var Toggle = function (props) {
4832
4836
  props.onChange(newValue);
4833
4837
  }
4834
4838
  };
4835
- return (jsxRuntime.jsx(Container$j, __assign$2({ checked: checked, disabled: props.disabled, tabIndex: 0, onClick: toggle, onBlur: props.onBlur, onKeyPress: function (e) { return (e.key === "Enter" ? toggle() : null); }, ref: containerRef }, { children: jsxRuntime.jsx("input", { type: "checkbox", disabled: !!props.disabled, id: props.id, name: props.name, ref: inputRef }) })));
4839
+ return (jsxRuntime.jsx(Container$k, __assign$2({ checked: checked, disabled: props.disabled, tabIndex: 0, onClick: toggle, onBlur: props.onBlur, onKeyPress: function (e) { return (e.key === "Enter" ? toggle() : null); }, ref: containerRef }, { children: jsxRuntime.jsx("input", { type: "checkbox", disabled: !!props.disabled, id: props.id, name: props.name, ref: inputRef }) })));
4836
4840
  };
4837
4841
 
4838
- var Wrapper$4 = styled__default["default"].div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject$1(["\n display: flex;\n align-items: flex-end;\n\n > svg {\n height: ", ";\n }\n"], ["\n display: flex;\n align-items: flex-end;\n\n > svg {\n height: ", ";\n }\n"])), function (_a) {
4842
+ var Wrapper$4 = styled__default["default"].div(templateObject_1$B || (templateObject_1$B = __makeTemplateObject$1(["\n display: flex;\n align-items: flex-end;\n\n > svg {\n height: ", ";\n }\n"], ["\n display: flex;\n align-items: flex-end;\n\n > svg {\n height: ", ";\n }\n"])), function (_a) {
4839
4843
  var level = _a.level;
4840
4844
  switch (level) {
4841
4845
  case 1:
@@ -4846,7 +4850,7 @@ var Wrapper$4 = styled__default["default"].div(templateObject_1$A || (templateOb
4846
4850
  return "70px";
4847
4851
  }
4848
4852
  });
4849
- var templateObject_1$A;
4853
+ var templateObject_1$B;
4850
4854
 
4851
4855
  var trophies = {
4852
4856
  1: {
@@ -4882,7 +4886,7 @@ var trophies = {
4882
4886
  };
4883
4887
  var Trophy = function (props) { return (jsxRuntime.jsx(Wrapper$4, __assign$2({}, props, { children: trophies[props.variant][props.level] }))); };
4884
4888
 
4885
- var Container$i = styled__default["default"].div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject$1(["\n min-height: 44px;\n padding: 10px;\n background-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n display: flex;\n align-items: center;\n gap: 10px;\n\n > div:first-child {\n min-width: 24px;\n min-height: 24px;\n }\n\n p {\n color: ", ";\n }\n"], ["\n min-height: 44px;\n padding: 10px;\n background-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n display: flex;\n align-items: center;\n gap: 10px;\n\n > div:first-child {\n min-width: 24px;\n min-height: 24px;\n }\n\n p {\n color: ", ";\n }\n"])), function (_a) {
4889
+ var Container$j = styled__default["default"].div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject$1(["\n min-height: 44px;\n padding: 10px;\n background-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n display: flex;\n align-items: center;\n gap: 10px;\n\n > div:first-child {\n min-width: 24px;\n min-height: 24px;\n }\n\n p {\n color: ", ";\n }\n"], ["\n min-height: 44px;\n padding: 10px;\n background-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n display: flex;\n align-items: center;\n gap: 10px;\n\n > div:first-child {\n min-width: 24px;\n min-height: 24px;\n }\n\n p {\n color: ", ";\n }\n"])), function (_a) {
4886
4890
  var type = _a.type;
4887
4891
  switch (type) {
4888
4892
  case "success":
@@ -4899,11 +4903,11 @@ var Container$i = styled__default["default"].div(templateObject_1$z || (template
4899
4903
  return theme.colors.red.base;
4900
4904
  }
4901
4905
  });
4902
- var templateObject_1$z;
4906
+ var templateObject_1$A;
4903
4907
 
4904
- var Alert = function (props) { return (jsxRuntime.jsxs(Container$i, __assign$2({}, props, { children: [jsxRuntime.jsx(Icon, { size: "small", type: props.type === "success" ? "check" : "warning", color: props.type === "success" ? "green" : "red" }), jsxRuntime.jsx(Paragraph, { children: props.message })] }))); };
4908
+ var Alert = function (props) { return (jsxRuntime.jsxs(Container$j, __assign$2({}, props, { children: [jsxRuntime.jsx(Icon, { size: "small", type: props.type === "success" ? "check" : "warning", color: props.type === "success" ? "green" : "red" }), jsxRuntime.jsx(Paragraph, { children: props.message })] }))); };
4905
4909
 
4906
- var StyledCard = styled__default["default"].div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject$1(["\n background-color: ", ";\n border: ", ";\n box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n border-radius: 6px;\n overflow: hidden;\n position: relative;\n\n ", "\n"], ["\n background-color: ", ";\n border: ", ";\n box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n border-radius: 6px;\n overflow: hidden;\n position: relative;\n\n ", "\n"])), theme.colors.lightGray.light, function (_a) {
4910
+ var StyledCard = styled__default["default"].div(templateObject_1$z || (templateObject_1$z = __makeTemplateObject$1(["\n background-color: ", ";\n border: ", ";\n box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n border-radius: 6px;\n overflow: hidden;\n position: relative;\n\n ", "\n"], ["\n background-color: ", ";\n border: ", ";\n box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n border-radius: 6px;\n overflow: hidden;\n position: relative;\n\n ", "\n"])), theme.colors.lightGray.light, function (_a) {
4907
4911
  var bordered = _a.bordered;
4908
4912
  return bordered ? "1px solid ".concat(theme.colors.lightGray.dark) : "none";
4909
4913
  }, function (_a) {
@@ -4915,23 +4919,23 @@ var StyledCard = styled__default["default"].div(templateObject_1$y || (templateO
4915
4919
  }, ";\n\n > div:first-child {\n width: 175%;\n padding-bottom: 175%;\n top: -25%;\n right: -25%;\n }\n }")
4916
4920
  : "";
4917
4921
  });
4918
- var Ellipse = styled__default["default"].div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject$1(["\n width: 85%;\n height: 0;\n padding-bottom: 85%;\n border-radius: 50%;\n background-color: ", ";\n opacity: 0.3;\n position: absolute;\n top: -20%;\n right: -20%;\n transition: width 0.75s, padding-bottom 0.75s, top 0.75s, right 0.75s;\n"], ["\n width: 85%;\n height: 0;\n padding-bottom: 85%;\n border-radius: 50%;\n background-color: ", ";\n opacity: 0.3;\n position: absolute;\n top: -20%;\n right: -20%;\n transition: width 0.75s, padding-bottom 0.75s, top 0.75s, right 0.75s;\n"])), function (_a) {
4922
+ var Ellipse = styled__default["default"].div(templateObject_2$u || (templateObject_2$u = __makeTemplateObject$1(["\n width: 85%;\n height: 0;\n padding-bottom: 85%;\n border-radius: 50%;\n background-color: ", ";\n opacity: 0.3;\n position: absolute;\n top: -20%;\n right: -20%;\n transition: width 0.75s, padding-bottom 0.75s, top 0.75s, right 0.75s;\n"], ["\n width: 85%;\n height: 0;\n padding-bottom: 85%;\n border-radius: 50%;\n background-color: ", ";\n opacity: 0.3;\n position: absolute;\n top: -20%;\n right: -20%;\n transition: width 0.75s, padding-bottom 0.75s, top 0.75s, right 0.75s;\n"])), function (_a) {
4919
4923
  var color = _a.color;
4920
4924
  return color ? theme.colors[color].light : "";
4921
4925
  });
4922
- var Content = styled__default["default"].div(templateObject_3$9 || (templateObject_3$9 = __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"])));
4923
- var templateObject_1$y, templateObject_2$t, templateObject_3$9;
4926
+ var Content = styled__default["default"].div(templateObject_3$a || (templateObject_3$a = __makeTemplateObject$1(["\n height: 100%;\n padding: 15px;\n position: inherit;\n top: 0;\n left: 0;\n"], ["\n height: 100%;\n padding: 15px;\n position: inherit;\n top: 0;\n left: 0;\n"])));
4927
+ var templateObject_1$z, templateObject_2$u, templateObject_3$a;
4924
4928
 
4925
4929
  var Card = function (props) { return (jsxRuntime.jsxs(StyledCard, __assign$2({}, props, { children: [props.ellipse && jsxRuntime.jsx(Ellipse, { color: props.ellipse }), jsxRuntime.jsx(Content, { children: props.children })] }))); };
4926
4930
 
4927
- var Fieldset$1 = styled__default["default"].fieldset(templateObject_1$x || (templateObject_1$x = __makeTemplateObject$1(["\n border: 0;\n margin: 0;\n padding: 0;\n"], ["\n border: 0;\n margin: 0;\n padding: 0;\n"])));
4928
- var CheckboxContainer = styled__default["default"].div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
4929
- var CheckboxWrapper = styled__default["default"].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"])));
4931
+ var Fieldset$1 = styled__default["default"].fieldset(templateObject_1$y || (templateObject_1$y = __makeTemplateObject$1(["\n border: 0;\n margin: 0;\n padding: 0;\n"], ["\n border: 0;\n margin: 0;\n padding: 0;\n"])));
4932
+ var CheckboxContainer = styled__default["default"].div(templateObject_2$t || (templateObject_2$t = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
4933
+ var CheckboxWrapper = styled__default["default"].div(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject$1(["\n display: flex;\n align-items: center;\n\n > div:first-child {\n margin-right: 10px;\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"], ["\n display: flex;\n align-items: center;\n\n > div:first-child {\n margin-right: 10px;\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"])));
4930
4934
  var Label$9 = styled__default["default"](StyledParagraph)(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject$1(["\n font-weight: ", ";\n color: ", ";\n display: flex;\n align-items: center;\n cursor: pointer;\n\n a {\n color: ", ";\n }\n"], ["\n font-weight: ", ";\n color: ", ";\n display: flex;\n align-items: center;\n cursor: pointer;\n\n a {\n color: ", ";\n }\n"])), function (_a) {
4931
4935
  var weight = _a.weight;
4932
4936
  return weight || 500;
4933
4937
  }, theme.colors.darkGray.base, theme.colors.blue.base);
4934
- var templateObject_1$x, templateObject_2$s, templateObject_3$8, templateObject_4$6;
4938
+ var templateObject_1$y, templateObject_2$t, templateObject_3$9, templateObject_4$6;
4935
4939
 
4936
4940
  var Checkboxes = function (props) {
4937
4941
  var _a = React$3.useState(props.defaultValue || []), values = _a[0], setValues = _a[1];
@@ -4954,12 +4958,12 @@ var Checkboxes = function (props) {
4954
4958
  }) })] }));
4955
4959
  };
4956
4960
 
4957
- var Container$h = styled__default["default"].div(templateObject_1$w || (templateObject_1$w = __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);
4958
- var Item = styled__default["default"].div(templateObject_2$r || (templateObject_2$r = __makeTemplateObject$1(["\n padding: 10px 0;\n cursor: pointer;\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 5px;\n }\n\n p {\n display: ", ";\n }\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n"], ["\n padding: 10px 0;\n cursor: pointer;\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 5px;\n }\n\n p {\n display: ", ";\n }\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n"])), function (_a) {
4961
+ var Container$i = styled__default["default"].div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject$1(["\n width: 100%;\n background-color: ", ";\n box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n border-radius: 6px;\n padding: 10px 20px;\n"], ["\n width: 100%;\n background-color: ", ";\n box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n border-radius: 6px;\n padding: 10px 20px;\n"])), theme.colors.lightGray.light);
4962
+ var Item = styled__default["default"].div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject$1(["\n padding: 10px 0;\n cursor: pointer;\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 5px;\n }\n\n p {\n display: ", ";\n }\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n"], ["\n padding: 10px 0;\n cursor: pointer;\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 5px;\n }\n\n p {\n display: ", ";\n }\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n"])), function (_a) {
4959
4963
  var isOpen = _a.isOpen;
4960
4964
  return (isOpen ? "" : "none");
4961
4965
  }, theme.colors.lightGray.dark);
4962
- var templateObject_1$w, templateObject_2$r;
4966
+ var templateObject_1$x, templateObject_2$s;
4963
4967
 
4964
4968
  var Collapse = function (props) {
4965
4969
  var _a = React$3.useState([]), openItems = _a[0], setOpenItems = _a[1];
@@ -4971,18 +4975,18 @@ var Collapse = function (props) {
4971
4975
  setOpenItems(function (prevState) { return __spreadArray(__spreadArray([], prevState, true), [index], false); });
4972
4976
  }
4973
4977
  };
4974
- return (jsxRuntime.jsx(Container$h, __assign$2({}, props, { children: props.items.map(function (item, index) {
4978
+ return (jsxRuntime.jsx(Container$i, __assign$2({}, props, { children: props.items.map(function (item, index) {
4975
4979
  var isOpen = openItems.includes(index);
4976
4980
  return (jsxRuntime.jsxs(Item, __assign$2({ isOpen: isOpen, onClick: function () { return onClickItem(index, isOpen); } }, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: item.title })), jsxRuntime.jsx(Icon, { type: isOpen ? "chevronUp" : "chevronDown", color: "blue" })] }), jsxRuntime.jsx(Paragraph, __assign$2({ weight: "regular" }, { children: item.content }))] }), "".concat(item.title, "-").concat(index)));
4977
4981
  }) })));
4978
4982
  };
4979
4983
 
4980
- var Wrapper$3 = styled__default["default"].div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject$1(["\n display: flex;\n"], ["\n display: flex;\n"])));
4981
- var Value = styled__default["default"].div(templateObject_2$q || (templateObject_2$q = __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) {
4984
+ var Wrapper$3 = styled__default["default"].div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject$1(["\n display: flex;\n"], ["\n display: flex;\n"])));
4985
+ var Value = styled__default["default"].div(templateObject_2$r || (templateObject_2$r = __makeTemplateObject$1(["\n width: 40px;\n height: 32px;\n background-color: ", ";\n border-radius: 6px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 0 6px;\n\n h5 {\n color: ", ";\n }\n\n :first-child {\n margin-left: 0;\n }\n"], ["\n width: 40px;\n height: 32px;\n background-color: ", ";\n border-radius: 6px;\n display: flex;\n align-items: center;\n justify-content: center;\n margin: 0 6px;\n\n h5 {\n color: ", ";\n }\n\n :first-child {\n margin-left: 0;\n }\n"])), function (_a) {
4982
4986
  var contrast = _a.contrast;
4983
4987
  return contrast ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
4984
4988
  }, theme.colors.darkGray.base);
4985
- var templateObject_1$v, templateObject_2$q;
4989
+ var templateObject_1$w, templateObject_2$r;
4986
4990
 
4987
4991
  var Countdown = function (_a) {
4988
4992
  var till = _a.till, contrast = _a.contrast;
@@ -5009,9 +5013,9 @@ var Countdown = function (_a) {
5009
5013
  return (jsxRuntime.jsxs(Wrapper$3, { children: [jsxRuntime.jsx(Value, __assign$2({ contrast: contrast }, { children: jsxRuntime.jsx(Heading, __assign$2({ type: "h5" }, { children: HH })) })), jsxRuntime.jsx(Heading, __assign$2({ type: "h5", color: color }, { children: ":" })), jsxRuntime.jsx(Value, __assign$2({ contrast: contrast }, { children: jsxRuntime.jsx(Heading, __assign$2({ type: "h5" }, { children: MM })) })), jsxRuntime.jsx(Heading, __assign$2({ type: "h5", color: color }, { children: ":" })), jsxRuntime.jsx(Value, __assign$2({ contrast: contrast }, { children: jsxRuntime.jsx(Heading, __assign$2({ type: "h5" }, { children: SS })) }))] }));
5010
5014
  };
5011
5015
 
5012
- var Container$g = styled__default["default"].div(templateObject_1$u || (templateObject_1$u = __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"])));
5013
- var Label$8 = styled__default["default"](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);
5014
- var templateObject_1$u, templateObject_2$p;
5016
+ var Container$h = styled__default["default"].div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
5017
+ var Label$8 = styled__default["default"](StyledParagraph)(templateObject_2$q || (templateObject_2$q = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
5018
+ var templateObject_1$v, templateObject_2$q;
5015
5019
 
5016
5020
  var DateInputField = function (props) {
5017
5021
  var onChange = function (value) {
@@ -5022,10 +5026,10 @@ var DateInputField = function (props) {
5022
5026
  if (props.onBlur)
5023
5027
  props.onBlur(props.name);
5024
5028
  };
5025
- return (jsxRuntime.jsxs(Container$g, { children: [jsxRuntime.jsx(Label$8, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Input.Date, { defaultValue: props.defaultValue, min: props.min, max: props.max, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, id: props.name, onChange: onChange, onBlur: onBlur })] }));
5029
+ return (jsxRuntime.jsxs(Container$h, { children: [jsxRuntime.jsx(Label$8, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Input.Date, { defaultValue: props.defaultValue, min: props.min, max: props.max, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, id: props.name, onChange: onChange, onBlur: onBlur })] }));
5026
5030
  };
5027
5031
 
5028
- var StyledIconButton = styled__default["default"](StyledButton)(templateObject_1$t || (templateObject_1$t = __makeTemplateObject$1(["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n > div:first-child {\n margin-top: -2px;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"], ["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n > div:first-child {\n margin-top: -2px;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"])), function (_a) {
5032
+ var StyledIconButton = styled__default["default"](StyledButton)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject$1(["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n > div:first-child {\n margin-top: -2px;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"], ["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n > div:first-child {\n margin-top: -2px;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"])), function (_a) {
5029
5033
  var size = _a.size;
5030
5034
  return (size === "small" ? "30px" : "40px");
5031
5035
  }, function (_a) {
@@ -5044,7 +5048,7 @@ var StyledIconButton = styled__default["default"](StyledButton)(templateObject_1
5044
5048
  var size = _a.size;
5045
5049
  return (size === "small" ? "28px" : "38px");
5046
5050
  });
5047
- var GhostIconButton = styled__default["default"](GhostButton)(templateObject_2$o || (templateObject_2$o = __makeTemplateObject$1(["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"], ["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"])), function (_a) {
5051
+ var GhostIconButton = styled__default["default"](GhostButton)(templateObject_2$p || (templateObject_2$p = __makeTemplateObject$1(["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"], ["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"])), function (_a) {
5048
5052
  var size = _a.size;
5049
5053
  return (size === "small" ? "30px" : "40px");
5050
5054
  }, function (_a) {
@@ -5063,7 +5067,7 @@ var GhostIconButton = styled__default["default"](GhostButton)(templateObject_2$o
5063
5067
  var size = _a.size;
5064
5068
  return (size === "small" ? "32px" : "40px");
5065
5069
  });
5066
- var templateObject_1$t, templateObject_2$o;
5070
+ var templateObject_1$u, templateObject_2$p;
5067
5071
 
5068
5072
  var IconButton = function (props) {
5069
5073
  if (props.color === "white")
@@ -5071,9 +5075,9 @@ var IconButton = function (props) {
5071
5075
  return (jsxRuntime.jsx(StyledIconButton, __assign$2({}, props, { children: jsxRuntime.jsx(Icon, { type: props.icon, size: props.size === "small" ? "tiny" : "small", color: "white" }) })));
5072
5076
  };
5073
5077
 
5074
- var Container$f = styled__default["default"].div(templateObject_1$s || (templateObject_1$s = __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"])));
5075
- var Label$7 = styled__default["default"](StyledParagraph)(templateObject_2$n || (templateObject_2$n = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
5076
- var templateObject_1$s, templateObject_2$n;
5078
+ var Container$g = styled__default["default"].div(templateObject_1$t || (templateObject_1$t = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
5079
+ var Label$7 = styled__default["default"](StyledParagraph)(templateObject_2$o || (templateObject_2$o = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
5080
+ var templateObject_1$t, templateObject_2$o;
5077
5081
 
5078
5082
  var InputField = function (props) {
5079
5083
  var onChange = function (value) {
@@ -5084,10 +5088,10 @@ var InputField = function (props) {
5084
5088
  if (props.onBlur)
5085
5089
  props.onBlur(props.name);
5086
5090
  };
5087
- return (jsxRuntime.jsxs(Container$f, { children: [jsxRuntime.jsx(Label$7, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Input, { defaultValue: props.defaultValue, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, placeholder: props.placeholder, id: props.name, onChange: onChange, onBlur: onBlur }), props.tips && (jsxRuntime.jsxs("div", __assign$2({ style: { marginLeft: "5px" } }, { children: [jsxRuntime.jsx(Spacer, { vertical: 5 }), props.tips.map(function (tip, index) { return (jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small", weight: "regular" }, { children: ["\u2022 ", tip] }), "".concat(tip, "-").concat(index))); })] })))] }));
5091
+ return (jsxRuntime.jsxs(Container$g, { children: [jsxRuntime.jsx(Label$7, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Input, { defaultValue: props.defaultValue, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, placeholder: props.placeholder, id: props.name, onChange: onChange, onBlur: onBlur }), props.tips && (jsxRuntime.jsxs("div", __assign$2({ style: { marginLeft: "5px" } }, { children: [jsxRuntime.jsx(Spacer, { vertical: 5 }), props.tips.map(function (tip, index) { return (jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small", weight: "regular" }, { children: ["\u2022 ", tip] }), "".concat(tip, "-").concat(index))); })] })))] }));
5088
5092
  };
5089
5093
 
5090
- var Container$e = styled__default["default"].div(templateObject_1$r || (templateObject_1$r = __makeTemplateObject$1(["\n min-width: 74px;\n max-width: 74px;\n width: fit-content;\n height: 74px;\n background-color: ", ";\n box-sizing: border-box;\n\n border: 4px solid;\n border-radius: 6px;\n border-color: ", ";\n\n padding: 8px 24px;\n margin-right: 6px;\n margin-left: 6px;\n margin-bottom: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n position: relative;\n text-transform: uppercase;\n\n h1 {\n color: ", ";\n }\n\n > svg {\n fill: ", ";\n }\n"], ["\n min-width: 74px;\n max-width: 74px;\n width: fit-content;\n height: 74px;\n background-color: ", ";\n box-sizing: border-box;\n\n border: 4px solid;\n border-radius: 6px;\n border-color: ", ";\n\n padding: 8px 24px;\n margin-right: 6px;\n margin-left: 6px;\n margin-bottom: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n position: relative;\n text-transform: uppercase;\n\n h1 {\n color: ", ";\n }\n\n > svg {\n fill: ", ";\n }\n"])), function (_a) {
5094
+ var Container$f = styled__default["default"].div(templateObject_1$s || (templateObject_1$s = __makeTemplateObject$1(["\n min-width: 74px;\n max-width: 74px;\n width: fit-content;\n height: 74px;\n background-color: ", ";\n box-sizing: border-box;\n\n border: 4px solid;\n border-radius: 6px;\n border-color: ", ";\n\n padding: 8px 24px;\n margin-right: 6px;\n margin-left: 6px;\n margin-bottom: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n position: relative;\n text-transform: uppercase;\n\n h1 {\n color: ", ";\n }\n\n > svg {\n fill: ", ";\n }\n"], ["\n min-width: 74px;\n max-width: 74px;\n width: fit-content;\n height: 74px;\n background-color: ", ";\n box-sizing: border-box;\n\n border: 4px solid;\n border-radius: 6px;\n border-color: ", ";\n\n padding: 8px 24px;\n margin-right: 6px;\n margin-left: 6px;\n margin-bottom: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n position: relative;\n text-transform: uppercase;\n\n h1 {\n color: ", ";\n }\n\n > svg {\n fill: ", ";\n }\n"])), function (_a) {
5091
5095
  var status = _a.status, color = _a.color;
5092
5096
  switch (status) {
5093
5097
  case "passed":
@@ -5131,23 +5135,23 @@ var Container$e = styled__default["default"].div(templateObject_1$r || (template
5131
5135
  return theme.colors.darkGray.light;
5132
5136
  }
5133
5137
  });
5134
- var CheckIconWrapper = styled__default["default"].div(templateObject_2$m || (templateObject_2$m = __makeTemplateObject$1(["\n position: absolute;\n top: 0;\n right: 0;\n"], ["\n position: absolute;\n top: 0;\n right: 0;\n"])));
5135
- var templateObject_1$r, templateObject_2$m;
5138
+ var CheckIconWrapper = styled__default["default"].div(templateObject_2$n || (templateObject_2$n = __makeTemplateObject$1(["\n position: absolute;\n top: 0;\n right: 0;\n"], ["\n position: absolute;\n top: 0;\n right: 0;\n"])));
5139
+ var templateObject_1$s, templateObject_2$n;
5136
5140
 
5137
- var Key$1 = function (props) { return (jsxRuntime.jsxs(Container$e, __assign$2({}, props, { children: [props.status === "passed" && (jsxRuntime.jsx(CheckIconWrapper, { children: jsxRuntime.jsx(Icon, { type: "check", color: "green", size: "small" }) })), props.char === " " ? (jsxRuntime.jsx("svg", __assign$2({ width: "28", height: "28", viewBox: "0 0 28 1", style: {
5141
+ var Key$1 = function (props) { return (jsxRuntime.jsxs(Container$f, __assign$2({}, props, { children: [props.status === "passed" && (jsxRuntime.jsx(CheckIconWrapper, { children: jsxRuntime.jsx(Icon, { type: "check", color: "green", size: "small" }) })), props.char === " " ? (jsxRuntime.jsx("svg", __assign$2({ width: "28", height: "28", viewBox: "0 0 28 1", style: {
5138
5142
  marginTop: "13px",
5139
5143
  transform: "scale(2)",
5140
5144
  } }, { children: jsxRuntime.jsx("path", { d: "M0 4.5V1C0 0.447715 0.447715 0 1 0H2C2.55228 0 3 0.447715 3 1V4H25V1C25 0.447715 25.4477 0 26 0H27C27.5523 0 28 0.447715 28 1V4.5C28 5.88071 26.8807 7 25.5 7H2.5C1.11929 7 0 5.88071 0 4.5Z" }) }))) : (jsxRuntime.jsx(Heading, __assign$2({ type: "h1" }, { children: props.char })))] }))); };
5141
5145
 
5142
- var Wrapper$2 = styled__default["default"].a(templateObject_1$q || (templateObject_1$q = __makeTemplateObject$1(["\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n\n > div {\n width: 19px;\n height: 19px;\n margin-right: ", ";\n margin-left: ", ";\n }\n"], ["\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n\n > div {\n width: 19px;\n height: 19px;\n margin-right: ", ";\n margin-left: ", ";\n }\n"])), function (_a) {
5146
+ var Wrapper$2 = styled__default["default"].a(templateObject_1$r || (templateObject_1$r = __makeTemplateObject$1(["\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n\n > div {\n width: 19px;\n height: 19px;\n margin-right: ", ";\n margin-left: ", ";\n }\n"], ["\n width: fit-content;\n display: flex;\n align-items: center;\n cursor: pointer;\n text-decoration: none;\n\n > div {\n width: 19px;\n height: 19px;\n margin-right: ", ";\n margin-left: ", ";\n }\n"])), function (_a) {
5143
5147
  var chevron = _a.chevron;
5144
5148
  return (chevron === "left" ? "4px" : "");
5145
5149
  }, function (_a) {
5146
5150
  var chevron = _a.chevron;
5147
5151
  return (chevron === "right" ? "4px" : "");
5148
5152
  });
5149
- var StyledLink = styled__default["default"](StyledParagraph)(templateObject_2$l || (templateObject_2$l = __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);
5150
- var templateObject_1$q, templateObject_2$l;
5153
+ var StyledLink = styled__default["default"](StyledParagraph)(templateObject_2$m || (templateObject_2$m = __makeTemplateObject$1(["\n color: ", ";\n\n :hover {\n text-decoration: underline;\n }\n"], ["\n color: ", ";\n\n :hover {\n text-decoration: underline;\n }\n"])), theme.colors.darkGray.dark);
5154
+ var templateObject_1$r, templateObject_2$m;
5151
5155
 
5152
5156
  var Link = function (props) {
5153
5157
  var onClick = function (e) {
@@ -5159,15 +5163,15 @@ var Link = function (props) {
5159
5163
  return (jsxRuntime.jsxs(Wrapper$2, __assign$2({ chevron: props.chevron, href: props.href, onClick: onClick }, { children: [props.chevron === "left" && jsxRuntime.jsx(Icon, { type: "chevronLeft", color: "green" }), jsxRuntime.jsx(StyledLink, __assign$2({ size: "large" }, { children: props.children })), props.chevron !== "none" && props.chevron !== "left" && (jsxRuntime.jsx(Icon, { type: "chevronRight", color: "green" }))] })));
5160
5164
  };
5161
5165
 
5162
- var Container$d = styled__default["default"].div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: center;\n padding-top: ", ";\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n padding-top: ", ";\n"])), function (_a) {
5166
+ var Container$e = styled__default["default"].div(templateObject_1$q || (templateObject_1$q = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: center;\n padding-top: ", ";\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n padding-top: ", ";\n"])), function (_a) {
5163
5167
  var text = _a.text;
5164
5168
  return (text ? "20px" : "");
5165
5169
  });
5166
- var templateObject_1$p;
5170
+ var templateObject_1$q;
5167
5171
 
5168
- var Loading = function (props) { return (jsxRuntime.jsxs(Container$d, __assign$2({}, props, { children: [jsxRuntime.jsx(_default, { color: theme.colors[props.color].base, speedMultiplier: 0.5 }), props.text && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Spacer, { vertical: 20 }), jsxRuntime.jsx(Heading, __assign$2({ type: "h6", color: props.textColor || "black" }, { children: props.text }))] }))] }))); };
5172
+ var Loading = function (props) { return (jsxRuntime.jsxs(Container$e, __assign$2({}, props, { children: [jsxRuntime.jsx(_default, { color: theme.colors[props.color].base, speedMultiplier: 0.5 }), props.text && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Spacer, { vertical: 20 }), jsxRuntime.jsx(Heading, __assign$2({ type: "h6", color: props.textColor || "black" }, { children: props.text }))] }))] }))); };
5169
5173
 
5170
- var Container$c = styled__default["default"].div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject$1(["\n padding: 15px;\n background-color: ", ";\n border-radius: 6px 6px 0 0;\n position: relative;\n cursor: pointer;\n"], ["\n padding: 15px;\n background-color: ", ";\n border-radius: 6px 6px 0 0;\n position: relative;\n cursor: pointer;\n"])), function (_a) {
5174
+ var Container$d = styled__default["default"].div(templateObject_1$p || (templateObject_1$p = __makeTemplateObject$1(["\n padding: 15px;\n background-color: ", ";\n border-radius: 6px 6px 0 0;\n position: relative;\n cursor: pointer;\n"], ["\n padding: 15px;\n background-color: ", ";\n border-radius: 6px 6px 0 0;\n position: relative;\n cursor: pointer;\n"])), function (_a) {
5171
5175
  var dropdownIsVisible = _a.dropdownIsVisible, color = _a.color;
5172
5176
  if (dropdownIsVisible) {
5173
5177
  switch (color) {
@@ -5180,8 +5184,8 @@ var Container$c = styled__default["default"].div(templateObject_1$o || (template
5180
5184
  }
5181
5185
  return "";
5182
5186
  });
5183
- var SelectedLocaleWrapper = styled__default["default"].div(templateObject_2$k || (templateObject_2$k = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n"])));
5184
- var DropdownContainer = styled__default["default"].div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject$1(["\n min-width: 100%;\n background-color: ", ";\n overflow: hidden;\n border-radius: 6px 0 6px 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n position: absolute;\n top: 50px;\n right: 0;\n"], ["\n min-width: 100%;\n background-color: ", ";\n overflow: hidden;\n border-radius: 6px 0 6px 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n position: absolute;\n top: 50px;\n right: 0;\n"])), function (_a) {
5187
+ var SelectedLocaleWrapper = styled__default["default"].div(templateObject_2$l || (templateObject_2$l = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n"])));
5188
+ var DropdownContainer = styled__default["default"].div(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject$1(["\n min-width: 100%;\n background-color: ", ";\n overflow: hidden;\n border-radius: 6px 0 6px 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n position: absolute;\n top: 50px;\n right: 0;\n"], ["\n min-width: 100%;\n background-color: ", ";\n overflow: hidden;\n border-radius: 6px 0 6px 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n position: absolute;\n top: 50px;\n right: 0;\n"])), function (_a) {
5185
5189
  var color = _a.color;
5186
5190
  switch (color) {
5187
5191
  default:
@@ -5192,7 +5196,7 @@ var DropdownContainer = styled__default["default"].div(templateObject_3$7 || (te
5192
5196
  }
5193
5197
  });
5194
5198
  var LocaleWrapper = styled__default["default"].div(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 10px 15px;\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n\n p {\n white-space: nowrap;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n p {\n color: ", ";\n }\n svg {\n fill: ", ";\n }\n }\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 10px 15px;\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n > div:first-child {\n display: flex;\n align-items: center;\n margin-right: 10px;\n }\n\n p {\n white-space: nowrap;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n p {\n color: ", ";\n }\n svg {\n fill: ", ";\n }\n }\n"])), theme.colors.lightGray.darker, theme.colors.lightGray.base, theme.colors.blue.base, theme.colors.blue.base);
5195
- var templateObject_1$o, templateObject_2$k, templateObject_3$7, templateObject_4$5;
5199
+ var templateObject_1$p, templateObject_2$l, templateObject_3$8, templateObject_4$5;
5196
5200
 
5197
5201
  var LocaleSelect = function (props) {
5198
5202
  var _a = React$3.useState(false), dropdownIsVisible = _a[0], setDropdownIsVisible = _a[1];
@@ -5201,22 +5205,22 @@ var LocaleSelect = function (props) {
5201
5205
  setLocale(locale);
5202
5206
  props.onChange(locale);
5203
5207
  };
5204
- return (jsxRuntime.jsxs(Container$c, __assign$2({ color: props.color || "light", dropdownIsVisible: dropdownIsVisible, onClick: function () { return setDropdownIsVisible(!dropdownIsVisible); }, onMouseLeave: function () { return setDropdownIsVisible(false); } }, { children: [jsxRuntime.jsxs(SelectedLocaleWrapper, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Flag, { locale: locale }), jsxRuntime.jsx(Spacer, { horizontal: 10 }), jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: getNativeLanguageByLocale_1(locale) }))] }), dropdownIsVisible ? (jsxRuntime.jsx(Icon, { type: "chevronUp", size: "small", color: "darkGray" })) : (jsxRuntime.jsx(Icon, { type: "chevronDown", size: "small", color: "darkGray" }))] }), dropdownIsVisible && (jsxRuntime.jsx(DropdownContainer, __assign$2({ color: props.color || "light" }, { children: props.locales
5208
+ return (jsxRuntime.jsxs(Container$d, __assign$2({ color: props.color || "light", dropdownIsVisible: dropdownIsVisible, onClick: function () { return setDropdownIsVisible(!dropdownIsVisible); }, onMouseLeave: function () { return setDropdownIsVisible(false); } }, { children: [jsxRuntime.jsxs(SelectedLocaleWrapper, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Flag, { locale: locale }), jsxRuntime.jsx(Spacer, { horizontal: 10 }), jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: getNativeLanguageByLocale_1(locale) }))] }), dropdownIsVisible ? (jsxRuntime.jsx(Icon, { type: "chevronUp", size: "small", color: "darkGray" })) : (jsxRuntime.jsx(Icon, { type: "chevronDown", size: "small", color: "darkGray" }))] }), dropdownIsVisible && (jsxRuntime.jsx(DropdownContainer, __assign$2({ color: props.color || "light" }, { children: props.locales
5205
5209
  .filter(function (l) { return l !== locale; })
5206
5210
  .map(function (locale) { return (jsxRuntime.jsxs(LocaleWrapper, __assign$2({ onClick: function () { return onSelectLocale(locale); } }, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Flag, { locale: locale }), jsxRuntime.jsx(Spacer, { horizontal: 10 }), jsxRuntime.jsx(Paragraph, __assign$2({ size: "small", weight: "regular", color: "darkGray" }, { children: getNativeLanguageByLocale_1(locale) }))] }), jsxRuntime.jsx(Icon, { type: "chevronRight", size: "small", color: "darkGray" })] }), locale)); }) })))] })));
5207
5211
  };
5208
5212
 
5209
- var Wrapper$1 = styled__default["default"].div(templateObject_1$n || (templateObject_1$n = __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"])));
5210
- var templateObject_1$n;
5213
+ var Wrapper$1 = styled__default["default"].div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject$1(["\n width: 100%;\n min-width: 200px;\n display: flex;\n justify-content: space-between;\n\n > div {\n display: flex;\n align-items: center;\n }\n"], ["\n width: 100%;\n min-width: 200px;\n display: flex;\n justify-content: space-between;\n\n > div {\n display: flex;\n align-items: center;\n }\n"])));
5214
+ var templateObject_1$o;
5211
5215
 
5212
5216
  var Medals = function (props) { return (jsxRuntime.jsxs(Wrapper$1, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Medal, { type: Medal$1.GOLD }), jsxRuntime.jsx(Spacer, { horizontal: 5 }), jsxRuntime.jsxs(Heading, __assign$2({ type: "h6" }, { children: ["x ", props.gold || 0] }))] }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Medal, { type: Medal$1.SILVER }), jsxRuntime.jsx(Spacer, { horizontal: 5 }), jsxRuntime.jsxs(Heading, __assign$2({ type: "h6" }, { children: ["x ", props.silver || 0] }))] }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Medal, { type: Medal$1.BRONZE }), jsxRuntime.jsx(Spacer, { horizontal: 5 }), jsxRuntime.jsxs(Heading, __assign$2({ type: "h6" }, { children: ["x ", props.bronze || 0] }))] })] })); };
5213
5217
 
5214
- var NotificationContainer = styled__default["default"].div(templateObject_1$m || (templateObject_1$m = __makeTemplateObject$1(["\n width: fit-content;\n max-width: 460px;\n padding: 15px;\n border-radius: 6px;\n background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 15px;\n }\n"], ["\n width: fit-content;\n max-width: 460px;\n padding: 15px;\n border-radius: 6px;\n background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 15px;\n }\n"])), function (_a) {
5218
+ var NotificationContainer = styled__default["default"].div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject$1(["\n width: fit-content;\n max-width: 460px;\n padding: 15px;\n border-radius: 6px;\n background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 15px;\n }\n"], ["\n width: fit-content;\n max-width: 460px;\n padding: 15px;\n border-radius: 6px;\n background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 15px;\n }\n"])), function (_a) {
5215
5219
  var contrast = _a.contrast;
5216
5220
  return contrast ? theme.colors.lightGray.light : theme.colors.lightGray.base;
5217
5221
  });
5218
- var ButtonContainer = styled__default["default"].div(templateObject_2$j || (templateObject_2$j = __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"])));
5219
- var templateObject_1$m, templateObject_2$j;
5222
+ var ButtonContainer = styled__default["default"].div(templateObject_2$k || (templateObject_2$k = __makeTemplateObject$1(["\n margin-top: 20px;\n display: flex;\n\n > *:first-child {\n margin-right: 10px;\n }\n"], ["\n margin-top: 20px;\n display: flex;\n\n > *:first-child {\n margin-right: 10px;\n }\n"])));
5223
+ var templateObject_1$n, templateObject_2$k;
5220
5224
 
5221
5225
  var Notification = function (props) {
5222
5226
  if (!props.isVisible)
@@ -5224,9 +5228,9 @@ var Notification = function (props) {
5224
5228
  return (jsxRuntime.jsxs(NotificationContainer, __assign$2({ contrast: !!props.contrast }, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h4" }, { children: props.title })), props.onClose && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Spacer, { horizontal: 15 }), jsxRuntime.jsx(IconButton, { icon: "cross", color: "green", onClick: props.onClose })] }))] }), jsxRuntime.jsx(Paragraph, __assign$2({ size: "small", weight: "regular", color: "darkGray" }, { children: props.content })), props.buttons && (jsxRuntime.jsx(ButtonContainer, { children: props.buttons.map(function (button, index) { return (React$3.createElement(Button, __assign$2({}, button, { size: "small", color: index + 1 === props.buttons.length ? "blue" : "white", key: "button-".concat(index) }))); }) }))] })));
5225
5229
  };
5226
5230
 
5227
- var Container$b = styled__default["default"].div(templateObject_1$l || (templateObject_1$l = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
5228
- var Label$6 = styled__default["default"](StyledParagraph)(templateObject_2$i || (templateObject_2$i = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
5229
- var templateObject_1$l, templateObject_2$i;
5231
+ var Container$c = styled__default["default"].div(templateObject_1$m || (templateObject_1$m = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
5232
+ var Label$6 = styled__default["default"](StyledParagraph)(templateObject_2$j || (templateObject_2$j = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
5233
+ var templateObject_1$m, templateObject_2$j;
5230
5234
 
5231
5235
  var NumberField = function (props) {
5232
5236
  var onChange = function (value) {
@@ -5237,12 +5241,12 @@ var NumberField = function (props) {
5237
5241
  if (props.onBlur)
5238
5242
  props.onBlur(props.name);
5239
5243
  };
5240
- return (jsxRuntime.jsxs(Container$b, { children: [jsxRuntime.jsx(Label$6, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Number$1, { min: props.min, max: props.max, defaultValue: props.defaultValue, autoComplete: props.autoComplete, disabled: props.disabled, autoFocus: props.autoFocus, id: props.name, onChange: onChange, onBlur: onBlur })] }));
5244
+ return (jsxRuntime.jsxs(Container$c, { children: [jsxRuntime.jsx(Label$6, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Number$1, { min: props.min, max: props.max, defaultValue: props.defaultValue, autoComplete: props.autoComplete, disabled: props.disabled, autoFocus: props.autoFocus, id: props.name, onChange: onChange, onBlur: onBlur })] }));
5241
5245
  };
5242
5246
 
5243
- var Container$a = styled__default["default"].div(templateObject_1$k || (templateObject_1$k = __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"])));
5244
- var Label$5 = styled__default["default"](StyledParagraph)(templateObject_2$h || (templateObject_2$h = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
5245
- var templateObject_1$k, templateObject_2$h;
5247
+ var Container$b = styled__default["default"].div(templateObject_1$l || (templateObject_1$l = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
5248
+ var Label$5 = styled__default["default"](StyledParagraph)(templateObject_2$i || (templateObject_2$i = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
5249
+ var templateObject_1$l, templateObject_2$i;
5246
5250
 
5247
5251
  var PasswordInputField = function (props) {
5248
5252
  var onChange = function (value) {
@@ -5258,7 +5262,7 @@ var PasswordInputField = function (props) {
5258
5262
  if (props.onBlur)
5259
5263
  props.onBlur(props.name);
5260
5264
  };
5261
- return (jsxRuntime.jsxs(Container$a, { children: [jsxRuntime.jsx(Label$5, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Input.Password, { defaultValue: props.defaultValue, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, placeholder: props.placeholder, helperLocale: props.helperLocale, id: props.name, onChange: onChange, onKeyPress: onKeyPress, onBlur: onBlur })] }));
5265
+ return (jsxRuntime.jsxs(Container$b, { children: [jsxRuntime.jsx(Label$5, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Input.Password, { defaultValue: props.defaultValue, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, placeholder: props.placeholder, helperLocale: props.helperLocale, id: props.name, onChange: onChange, onKeyPress: onKeyPress, onBlur: onBlur })] }));
5262
5266
  };
5263
5267
 
5264
5268
  var generateRandomString = function (length) {
@@ -5271,7 +5275,7 @@ var generateRandomString = function (length) {
5271
5275
  return string;
5272
5276
  };
5273
5277
 
5274
- var PopupContainer = styled__default["default"].div(templateObject_1$j || (templateObject_1$j = __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 background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n pointer-events: none;\n z-index: 9;\n"], ["\n width: fit-content;\n max-width: 25vw;\n position: fixed;\n opacity: ", ";\n top: ", ";\n left: ", ";\n padding: 15px;\n margin-top: 10px;\n border-radius: 6px;\n background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n pointer-events: none;\n z-index: 9;\n"])), function (_a) {
5278
+ var PopupContainer = styled__default["default"].div(templateObject_1$k || (templateObject_1$k = __makeTemplateObject$1(["\n width: fit-content;\n max-width: 25vw;\n position: fixed;\n opacity: ", ";\n top: ", ";\n left: ", ";\n padding: 15px;\n margin-top: 10px;\n border-radius: 6px;\n border: ", ";\n background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n pointer-events: none;\n z-index: 9;\n"], ["\n width: fit-content;\n max-width: 25vw;\n position: fixed;\n opacity: ", ";\n top: ", ";\n left: ", ";\n padding: 15px;\n margin-top: 10px;\n border-radius: 6px;\n border: ", ";\n background-color: ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n pointer-events: none;\n z-index: 9;\n"])), function (_a) {
5275
5279
  var isVisible = _a.isVisible;
5276
5280
  return (isVisible ? "100%" : "0%");
5277
5281
  }, function (_a) {
@@ -5280,11 +5284,11 @@ var PopupContainer = styled__default["default"].div(templateObject_1$j || (templ
5280
5284
  }, function (_a) {
5281
5285
  var x = _a.x;
5282
5286
  return (x ? "".concat(x, "px") : "");
5283
- }, function (_a) {
5287
+ }, "1px solid ".concat(theme.colors.lightGray.dark), function (_a) {
5284
5288
  var contrast = _a.contrast;
5285
5289
  return contrast ? theme.colors.lightGray.light : theme.colors.lightGray.base;
5286
5290
  });
5287
- var templateObject_1$j;
5291
+ var templateObject_1$k;
5288
5292
 
5289
5293
  var Popup = function (props) {
5290
5294
  var popupRef = React$3.useRef(null);
@@ -5320,24 +5324,24 @@ var Popup = function (props) {
5320
5324
  return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [children, jsxRuntime.jsxs(PopupContainer, __assign$2({}, position, { isVisible: isVisible, ref: popupRef, contrast: props.contrast }, { children: [props.title && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: props.title })), jsxRuntime.jsx(Spacer, { vertical: 10 })] })), jsxRuntime.jsx(Paragraph, __assign$2({ size: "small", weight: "regular" }, { children: props.content }))] }))] }));
5321
5325
  };
5322
5326
 
5323
- var Wrapper = styled__default["default"].div(templateObject_1$i || (templateObject_1$i = __makeTemplateObject$1(["\n width: 100%;\n display: flex;\n align-items: center;\n"], ["\n width: 100%;\n display: flex;\n align-items: center;\n"])));
5324
- var StyledProgressBar = styled__default["default"].div(templateObject_2$g || (templateObject_2$g = __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) {
5327
+ var Wrapper = styled__default["default"].div(templateObject_1$j || (templateObject_1$j = __makeTemplateObject$1(["\n width: 100%;\n display: flex;\n align-items: center;\n"], ["\n width: 100%;\n display: flex;\n align-items: center;\n"])));
5328
+ var StyledProgressBar = styled__default["default"].div(templateObject_2$h || (templateObject_2$h = __makeTemplateObject$1(["\n width: 100%;\n height: 15px;\n position: relative;\n background-color: ", ";\n border-radius: 8px;\n margin-right: ", ";\n"], ["\n width: 100%;\n height: 15px;\n position: relative;\n background-color: ", ";\n border-radius: 8px;\n margin-right: ", ";\n"])), theme.colors.lightGray.dark, function (_a) {
5325
5329
  var showInfo = _a.showInfo;
5326
5330
  return (showInfo ? "10px" : "");
5327
5331
  });
5328
- var Indicator$1 = styled__default["default"].div(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject$1(["\n width: ", ";\n max-width: calc(100% - 6px);\n height: 9px;\n position: relative;\n background-color: ", ";\n border-radius: 8px;\n top: 3px;\n left: 3px;\n"], ["\n width: ", ";\n max-width: calc(100% - 6px);\n height: 9px;\n position: relative;\n background-color: ", ";\n border-radius: 8px;\n top: 3px;\n left: 3px;\n"])), function (_a) {
5332
+ var Indicator$1 = styled__default["default"].div(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject$1(["\n width: ", ";\n max-width: calc(100% - 6px);\n height: 9px;\n position: relative;\n background-color: ", ";\n border-radius: 8px;\n top: 3px;\n left: 3px;\n"], ["\n width: ", ";\n max-width: calc(100% - 6px);\n height: 9px;\n position: relative;\n background-color: ", ";\n border-radius: 8px;\n top: 3px;\n left: 3px;\n"])), function (_a) {
5329
5333
  var percent = _a.percent;
5330
5334
  return "calc(".concat(percent, "% - 6px)");
5331
5335
  }, function (_a) {
5332
5336
  var color = _a.color;
5333
5337
  return color ? theme.colors[color].base : theme.colors.green.base;
5334
5338
  });
5335
- var templateObject_1$i, templateObject_2$g, templateObject_3$6;
5339
+ var templateObject_1$j, templateObject_2$h, templateObject_3$7;
5336
5340
 
5337
5341
  var ProgressBar = function (props) { return (jsxRuntime.jsxs(Wrapper, { children: [jsxRuntime.jsx(StyledProgressBar, __assign$2({}, props, { children: jsxRuntime.jsx(Indicator$1, __assign$2({}, props)) })), props.showInfo && (jsxRuntime.jsx(Paragraph, __assign$2({ size: "small" }, { children: props.info ? props.info : "".concat(props.percent, "%") })))] })); };
5338
5342
 
5339
- var Container$9 = styled__default["default"].ol(templateObject_1$h || (templateObject_1$h = __makeTemplateObject$1(["\n display: flex;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"], ["\n display: flex;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"])));
5340
- var Step$1 = styled__default["default"].li(templateObject_2$f || (templateObject_2$f = __makeTemplateObject$1(["\n flex: 1;\n display: flex;\n flex-direction: column;\n text-align: center;\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin: 0 auto;\n cursor: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n border: 10px solid ", ";\n position: relative;\n z-index: 1;\n }\n\n > div h6 {\n color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :not(:last-child):after {\n content: \"\";\n height: 4px;\n position: relative;\n top: ", ";\n left: 50%;\n background-color: ", ";\n order: -1;\n }\n\n :last-child {\n margin-top: 4px;\n }\n"], ["\n flex: 1;\n display: flex;\n flex-direction: column;\n text-align: center;\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin: 0 auto;\n cursor: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n border: 10px solid ", ";\n position: relative;\n z-index: 1;\n }\n\n > div h6 {\n color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :not(:last-child):after {\n content: \"\";\n height: 4px;\n position: relative;\n top: ", ";\n left: 50%;\n background-color: ", ";\n order: -1;\n }\n\n :last-child {\n margin-top: 4px;\n }\n"])), function (_a) {
5343
+ var Container$a = styled__default["default"].ol(templateObject_1$i || (templateObject_1$i = __makeTemplateObject$1(["\n display: flex;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"], ["\n display: flex;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"])));
5344
+ var Step$1 = styled__default["default"].li(templateObject_2$g || (templateObject_2$g = __makeTemplateObject$1(["\n flex: 1;\n display: flex;\n flex-direction: column;\n text-align: center;\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin: 0 auto;\n cursor: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n border: 10px solid ", ";\n position: relative;\n z-index: 1;\n }\n\n > div h6 {\n color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :not(:last-child):after {\n content: \"\";\n height: 4px;\n position: relative;\n top: ", ";\n left: 50%;\n background-color: ", ";\n order: -1;\n }\n\n :last-child {\n margin-top: 4px;\n }\n"], ["\n flex: 1;\n display: flex;\n flex-direction: column;\n text-align: center;\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin: 0 auto;\n cursor: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n border: 10px solid ", ";\n position: relative;\n z-index: 1;\n }\n\n > div h6 {\n color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :not(:last-child):after {\n content: \"\";\n height: 4px;\n position: relative;\n top: ", ";\n left: 50%;\n background-color: ", ";\n order: -1;\n }\n\n :last-child {\n margin-top: 4px;\n }\n"])), function (_a) {
5341
5345
  var status = _a.status;
5342
5346
  return (!!status ? "pointer" : "not-allowed");
5343
5347
  }, function (_a) {
@@ -5359,9 +5363,9 @@ var Step$1 = styled__default["default"].li(templateObject_2$f || (templateObject
5359
5363
  var hasTitle = _a.hasTitle;
5360
5364
  return (hasTitle ? "calc(50% - 12px)" : "50%");
5361
5365
  }, theme.colors.lightGray.dark);
5362
- var templateObject_1$h, templateObject_2$f;
5366
+ var templateObject_1$i, templateObject_2$g;
5363
5367
 
5364
- var Steps$2 = function (props) { return (jsxRuntime.jsx(Container$9, { children: props.steps.map(function (_a, index) {
5368
+ var Steps$2 = function (props) { return (jsxRuntime.jsx(Container$a, { children: props.steps.map(function (_a, index) {
5365
5369
  var title = _a.title, onClick = _a.onClick;
5366
5370
  var step = index + 1;
5367
5371
  var status = props.current > step
@@ -5376,8 +5380,8 @@ var Steps$2 = function (props) { return (jsxRuntime.jsx(Container$9, { children:
5376
5380
  return (jsxRuntime.jsxs(Step$1, __assign$2({ status: status, hasTitle: !!title }, { children: [jsxRuntime.jsx("div", __assign$2({ onClick: onClickStep }, { children: status === "passed" ? (jsxRuntime.jsx(Icon, { type: "check", size: "small", color: "white" })) : (jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: step }))) })), title && jsxRuntime.jsx(Paragraph, { children: title })] }), "".concat(title, "-").concat(step)));
5377
5381
  }) })); };
5378
5382
 
5379
- var Container$8 = styled__default["default"].ol(templateObject_1$g || (templateObject_1$g = __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"])));
5380
- var Step = styled__default["default"].li(templateObject_2$e || (templateObject_2$e = __makeTemplateObject$1(["\n display: flex;\n align-items: center;\n box-shadow: inset 0px -1px 0px ", ";\n padding: 20px 0 20px 20px;\n cursor: ", ";\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin-right: 10px;\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n }\n\n > div h6 {\n color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :hover {\n background-color: ", ";\n }\n"], ["\n display: flex;\n align-items: center;\n box-shadow: inset 0px -1px 0px ", ";\n padding: 20px 0 20px 20px;\n cursor: ", ";\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin-right: 10px;\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n }\n\n > div h6 {\n color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :hover {\n background-color: ", ";\n }\n"])), theme.colors.lightGray.dark, function (_a) {
5383
+ var Container$9 = styled__default["default"].ol(templateObject_1$h || (templateObject_1$h = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"], ["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n margin: 0;\n padding: 0;\n"])));
5384
+ var Step = styled__default["default"].li(templateObject_2$f || (templateObject_2$f = __makeTemplateObject$1(["\n display: flex;\n align-items: center;\n box-shadow: inset 0px -1px 0px ", ";\n padding: 20px 0 20px 20px;\n cursor: ", ";\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin-right: 10px;\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n }\n\n > div h6 {\n color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :hover {\n background-color: ", ";\n }\n"], ["\n display: flex;\n align-items: center;\n box-shadow: inset 0px -1px 0px ", ";\n padding: 20px 0 20px 20px;\n cursor: ", ";\n\n > div:first-child {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n box-sizing: initial;\n margin-right: 10px;\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n background-color: ", ";\n }\n\n > div h6 {\n color: ", ";\n }\n\n p {\n color: ", ";\n }\n\n :hover {\n background-color: ", ";\n }\n"])), theme.colors.lightGray.dark, function (_a) {
5381
5385
  var status = _a.status;
5382
5386
  return (!!status ? "pointer" : "not-allowed");
5383
5387
  }, function (_a) {
@@ -5396,9 +5400,9 @@ var Step = styled__default["default"].li(templateObject_2$e || (templateObject_2
5396
5400
  ? theme.colors.lightGray.light
5397
5401
  : theme.colors.darkGray.light;
5398
5402
  }, theme.colors.darkGray.base, theme.colors.lightGray.base);
5399
- var templateObject_1$g, templateObject_2$e;
5403
+ var templateObject_1$h, templateObject_2$f;
5400
5404
 
5401
- var Steps$1 = function (props) { return (jsxRuntime.jsx(Container$8, { children: props.steps.map(function (_a, index) {
5405
+ var Steps$1 = function (props) { return (jsxRuntime.jsx(Container$9, { children: props.steps.map(function (_a, index) {
5402
5406
  var title = _a.title, onClick = _a.onClick;
5403
5407
  var step = index + 1;
5404
5408
  var status = props.current > step
@@ -5417,15 +5421,15 @@ var Steps = function (props) {
5417
5421
  return props.alignment === "vertical" ? (jsxRuntime.jsx(Steps$1, __assign$2({}, props))) : (jsxRuntime.jsx(Steps$2, __assign$2({}, props)));
5418
5422
  };
5419
5423
 
5420
- var TabsContainer$1 = styled__default["default"].div(templateObject_1$f || (templateObject_1$f = __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);
5421
- var Tab$1 = styled__default["default"].div(templateObject_2$d || (templateObject_2$d = __makeTemplateObject$1(["\n height: 50px;\n display: flex;\n align-items: center;\n padding: 0 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) {
5424
+ var TabsContainer$1 = styled__default["default"].div(templateObject_1$g || (templateObject_1$g = __makeTemplateObject$1(["\n border-bottom: 1px solid ", ";\n display: flex;\n gap: 20px;\n padding: 0 30px;\n"], ["\n border-bottom: 1px solid ", ";\n display: flex;\n gap: 20px;\n padding: 0 30px;\n"])), theme.colors.lightGray.dark);
5425
+ var Tab$1 = styled__default["default"].div(templateObject_2$e || (templateObject_2$e = __makeTemplateObject$1(["\n height: 50px;\n display: flex;\n align-items: center;\n padding: 0 10px;\n cursor: pointer;\n border-bottom: ", ";\n\n p {\n color: ", ";\n }\n\n :hover p {\n color: ", ";\n }\n"], ["\n height: 50px;\n display: flex;\n align-items: center;\n padding: 0 10px;\n cursor: pointer;\n border-bottom: ", ";\n\n p {\n color: ", ";\n }\n\n :hover p {\n color: ", ";\n }\n"])), function (_a) {
5422
5426
  var isActive = _a.isActive;
5423
5427
  return isActive ? "3px solid ".concat(theme.colors.blue.base) : "";
5424
5428
  }, function (_a) {
5425
5429
  var isActive = _a.isActive;
5426
5430
  return isActive ? theme.colors.blue.base : "";
5427
5431
  }, theme.colors.blue.base);
5428
- var templateObject_1$f, templateObject_2$d;
5432
+ var templateObject_1$g, templateObject_2$e;
5429
5433
 
5430
5434
  var Tabs$2 = function (props) {
5431
5435
  var _a = React$3.useState(props.items[0].key), activeTab = _a[0], setActiveTab = _a[1];
@@ -5440,15 +5444,15 @@ var Tabs$2 = function (props) {
5440
5444
  }) }));
5441
5445
  };
5442
5446
 
5443
- var TabsContainer = styled__default["default"].div(templateObject_1$e || (templateObject_1$e = __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);
5444
- var Tab = styled__default["default"].div(templateObject_2$c || (templateObject_2$c = __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) {
5447
+ var TabsContainer = styled__default["default"].div(templateObject_1$f || (templateObject_1$f = __makeTemplateObject$1(["\n width: fit-content;\n border-right: 1px solid ", ";\n display: flex;\n flex-direction: column;\n gap: 5px;\n padding: 30px 0 30px 30px;\n"], ["\n width: fit-content;\n border-right: 1px solid ", ";\n display: flex;\n flex-direction: column;\n gap: 5px;\n padding: 30px 0 30px 30px;\n"])), theme.colors.lightGray.dark);
5448
+ var Tab = styled__default["default"].div(templateObject_2$d || (templateObject_2$d = __makeTemplateObject$1(["\n height: 50px;\n display: flex;\n align-items: center;\n padding: 0 30px 0 10px;\n cursor: pointer;\n position: relative;\n\n :after {\n content: \"\";\n width: 3px;\n height: 100%;\n display: ", ";\n background-color: ", ";\n position: absolute;\n right: 0;\n }\n\n p {\n color: ", ";\n }\n\n :hover p {\n color: ", ";\n }\n"], ["\n height: 50px;\n display: flex;\n align-items: center;\n padding: 0 30px 0 10px;\n cursor: pointer;\n position: relative;\n\n :after {\n content: \"\";\n width: 3px;\n height: 100%;\n display: ", ";\n background-color: ", ";\n position: absolute;\n right: 0;\n }\n\n p {\n color: ", ";\n }\n\n :hover p {\n color: ", ";\n }\n"])), function (_a) {
5445
5449
  var isActive = _a.isActive;
5446
5450
  return (isActive ? "block" : "none");
5447
5451
  }, theme.colors.blue.base, function (_a) {
5448
5452
  var isActive = _a.isActive;
5449
5453
  return isActive ? theme.colors.blue.base : "";
5450
5454
  }, theme.colors.blue.base);
5451
- var templateObject_1$e, templateObject_2$c;
5455
+ var templateObject_1$f, templateObject_2$d;
5452
5456
 
5453
5457
  var Tabs$1 = function (props) {
5454
5458
  var _a = React$3.useState(props.items[0].key), activeTab = _a[0], setActiveTab = _a[1];
@@ -5467,14 +5471,14 @@ var Tabs = function (props) {
5467
5471
  return props.alignment === "vertical" ? (jsxRuntime.jsx(Tabs$1, __assign$2({}, props))) : (jsxRuntime.jsx(Tabs$2, __assign$2({}, props)));
5468
5472
  };
5469
5473
 
5470
- var Fieldset = styled__default["default"].fieldset(templateObject_1$d || (templateObject_1$d = __makeTemplateObject$1(["\n border: 0;\n margin: 0;\n padding: 0;\n"], ["\n border: 0;\n margin: 0;\n padding: 0;\n"])));
5471
- var RadioContainer = styled__default["default"].div(templateObject_2$b || (templateObject_2$b = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
5472
- var RadioWrapper = styled__default["default"].div(templateObject_3$5 || (templateObject_3$5 = __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"])));
5474
+ var Fieldset = styled__default["default"].fieldset(templateObject_1$e || (templateObject_1$e = __makeTemplateObject$1(["\n border: 0;\n margin: 0;\n padding: 0;\n"], ["\n border: 0;\n margin: 0;\n padding: 0;\n"])));
5475
+ var RadioContainer = styled__default["default"].div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
5476
+ var RadioWrapper = styled__default["default"].div(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject$1(["\n display: flex;\n align-items: center;\n\n > div:first-child {\n margin-right: 10px;\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"], ["\n display: flex;\n align-items: center;\n\n > div:first-child {\n margin-right: 10px;\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"])));
5473
5477
  var Label$4 = styled__default["default"](StyledParagraph)(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject$1(["\n font-weight: ", ";\n color: ", ";\n display: flex;\n align-items: center;\n cursor: pointer;\n"], ["\n font-weight: ", ";\n color: ", ";\n display: flex;\n align-items: center;\n cursor: pointer;\n"])), function (_a) {
5474
5478
  var weight = _a.weight;
5475
5479
  return weight || 500;
5476
5480
  }, theme.colors.darkGray.base);
5477
- var templateObject_1$d, templateObject_2$b, templateObject_3$5, templateObject_4$4;
5481
+ var templateObject_1$e, templateObject_2$c, templateObject_3$6, templateObject_4$4;
5478
5482
 
5479
5483
  var RadioGroup = function (props) {
5480
5484
  var onChange = function (value) {
@@ -5491,9 +5495,9 @@ var RadioGroup = function (props) {
5491
5495
  }) })] }));
5492
5496
  };
5493
5497
 
5494
- var Container$7 = styled__default["default"].div(templateObject_1$c || (templateObject_1$c = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n"])));
5495
- var Label$3 = styled__default["default"](StyledParagraph)(templateObject_2$a || (templateObject_2$a = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
5496
- var templateObject_1$c, templateObject_2$a;
5498
+ var Container$8 = styled__default["default"].div(templateObject_1$d || (templateObject_1$d = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n"])));
5499
+ var Label$3 = styled__default["default"](StyledParagraph)(templateObject_2$b || (templateObject_2$b = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
5500
+ var templateObject_1$d, templateObject_2$b;
5497
5501
 
5498
5502
  var SelectField = function (props) {
5499
5503
  var onChange = function (value) {
@@ -5504,15 +5508,15 @@ var SelectField = function (props) {
5504
5508
  if (props.onBlur)
5505
5509
  props.onBlur(props.name);
5506
5510
  };
5507
- return (jsxRuntime.jsxs(Container$7, { children: [jsxRuntime.jsx(Label$3, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Select, __assign$2({ id: props.name, name: props.name, disabled: props.disabled, defaultValue: props.defaultValue, placeholder: props.placeholder, autoFocus: props.autoFocus, onChange: onChange, onBlur: onBlur }, { children: props.options.map(function (_a, index) {
5511
+ return (jsxRuntime.jsxs(Container$8, { children: [jsxRuntime.jsx(Label$3, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Select, __assign$2({ id: props.name, name: props.name, disabled: props.disabled, defaultValue: props.defaultValue, placeholder: props.placeholder, autoFocus: props.autoFocus, onChange: onChange, onBlur: onBlur }, { children: props.options.map(function (_a, index) {
5508
5512
  var value = _a.value, label = _a.label;
5509
5513
  return (jsxRuntime.jsx("option", __assign$2({ value: value }, { children: label }), "".concat(value, "-").concat(value)));
5510
5514
  }) }))] }));
5511
5515
  };
5512
5516
 
5513
- var Container$6 = styled__default["default"].div(templateObject_1$b || (templateObject_1$b = __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"])));
5514
- var Label$2 = styled__default["default"](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);
5515
- var templateObject_1$b, templateObject_2$9;
5517
+ var Container$7 = styled__default["default"].div(templateObject_1$c || (templateObject_1$c = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n"])));
5518
+ var Label$2 = styled__default["default"](StyledParagraph)(templateObject_2$a || (templateObject_2$a = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
5519
+ var templateObject_1$c, templateObject_2$a;
5516
5520
 
5517
5521
  var ToggleField = function (props) {
5518
5522
  var onChange = function (value) {
@@ -5523,10 +5527,10 @@ var ToggleField = function (props) {
5523
5527
  if (props.onBlur)
5524
5528
  props.onBlur(props.name);
5525
5529
  };
5526
- return (jsxRuntime.jsxs(Container$6, { children: [jsxRuntime.jsx(Label$2, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Toggle, { id: props.name, name: props.name, disabled: props.disabled, autoFocus: props.autoFocus, defaultValue: props.defaultValue, onChange: onChange, onBlur: onBlur })] }));
5530
+ return (jsxRuntime.jsxs(Container$7, { children: [jsxRuntime.jsx(Label$2, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Toggle, { id: props.name, name: props.name, disabled: props.disabled, autoFocus: props.autoFocus, defaultValue: props.defaultValue, onChange: onChange, onBlur: onBlur })] }));
5527
5531
  };
5528
5532
 
5529
- var TooltipContainer = styled__default["default"].div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject$1(["\n width: fit-content;\n position: fixed;\n opacity: ", ";\n top: ", ";\n left: ", ";\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-top: 5px;\n pointer-events: none;\n z-index: 9;\n"], ["\n width: fit-content;\n position: fixed;\n opacity: ", ";\n top: ", ";\n left: ", ";\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-top: 5px;\n pointer-events: none;\n z-index: 9;\n"])), function (_a) {
5533
+ var TooltipContainer = styled__default["default"].div(templateObject_1$b || (templateObject_1$b = __makeTemplateObject$1(["\n width: fit-content;\n position: fixed;\n opacity: ", ";\n top: ", ";\n left: ", ";\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-top: 5px;\n pointer-events: none;\n z-index: 9;\n"], ["\n width: fit-content;\n position: fixed;\n opacity: ", ";\n top: ", ";\n left: ", ";\n display: flex;\n flex-direction: column;\n align-items: center;\n margin-top: 5px;\n pointer-events: none;\n z-index: 9;\n"])), function (_a) {
5530
5534
  var isVisible = _a.isVisible;
5531
5535
  return (isVisible ? "100%" : "0%");
5532
5536
  }, function (_a) {
@@ -5536,7 +5540,7 @@ var TooltipContainer = styled__default["default"].div(templateObject_1$a || (tem
5536
5540
  var x = _a.x;
5537
5541
  return (x ? "".concat(x, "px") : "");
5538
5542
  });
5539
- var TooltipTitle = styled__default["default"].div(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject$1(["\n width: 100%;\n padding: 12px 16px;\n background-color: ", ";\n border-radius: 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n width: 100%;\n padding: 12px 16px;\n background-color: ", ";\n border-radius: 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n display: flex;\n align-items: center;\n justify-content: center;\n"])), function (_a) {
5543
+ var TooltipTitle = styled__default["default"].div(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject$1(["\n width: 100%;\n padding: 12px 16px;\n background-color: ", ";\n border-radius: 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n display: flex;\n align-items: center;\n justify-content: center;\n"], ["\n width: 100%;\n padding: 12px 16px;\n background-color: ", ";\n border-radius: 6px;\n box-shadow: 0px 2px 0px rgb(0 0 0 / 20%);\n display: flex;\n align-items: center;\n justify-content: center;\n"])), function (_a) {
5540
5544
  var color = _a.color;
5541
5545
  switch (color) {
5542
5546
  default:
@@ -5546,7 +5550,7 @@ var TooltipTitle = styled__default["default"].div(templateObject_2$8 || (templat
5546
5550
  return theme.colors.lightGray.dark;
5547
5551
  }
5548
5552
  });
5549
- var templateObject_1$a, templateObject_2$8;
5553
+ var templateObject_1$b, templateObject_2$9;
5550
5554
 
5551
5555
  var Tooltip = function (props) {
5552
5556
  var tooltipRef = React$3.useRef(null);
@@ -11398,7 +11402,7 @@ HTMLReactParser$1.htmlToDOM;
11398
11402
  HTMLReactParser$1.attributesToProps;
11399
11403
  HTMLReactParser$1.Element;
11400
11404
 
11401
- var StyledTextarea = styled__default["default"].textarea(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject$1(["\n width: 100%;\n min-width: 228px;\n min-height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n resize: vertical;\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 100%;\n min-width: 228px;\n min-height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n resize: vertical;\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
11405
+ var StyledTextarea = styled__default["default"].textarea(templateObject_1$a || (templateObject_1$a = __makeTemplateObject$1(["\n width: 100%;\n min-width: 228px;\n min-height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n resize: vertical;\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 100%;\n min-width: 228px;\n min-height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n resize: vertical;\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
11402
11406
  var disabled = _a.disabled;
11403
11407
  return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
11404
11408
  }, function (_a) {
@@ -11411,7 +11415,7 @@ var StyledTextarea = styled__default["default"].textarea(templateObject_1$9 || (
11411
11415
  var disabled = _a.disabled;
11412
11416
  return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
11413
11417
  }, theme.fonts.paragraph, theme.paragraph.medium.fontSize, theme.paragraph.medium.lineHeight, theme.colors.lightGray.darker, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
11414
- var templateObject_1$9;
11418
+ var templateObject_1$a;
11415
11419
 
11416
11420
  var Textarea = function (props) {
11417
11421
  var onChange = function (e) {
@@ -11421,9 +11425,9 @@ var Textarea = function (props) {
11421
11425
  return jsxRuntime.jsx(StyledTextarea, __assign$2({}, props, { onChange: onChange }));
11422
11426
  };
11423
11427
 
11424
- var Container$5 = styled__default["default"].div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
11425
- var Label$1 = styled__default["default"](StyledParagraph)(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
11426
- var templateObject_1$8, templateObject_2$7;
11428
+ var Container$6 = styled__default["default"].div(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
11429
+ var Label$1 = styled__default["default"](StyledParagraph)(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
11430
+ var templateObject_1$9, templateObject_2$8;
11427
11431
 
11428
11432
  var TextareaField = function (props) {
11429
11433
  var onChange = function (value) {
@@ -11434,12 +11438,12 @@ var TextareaField = function (props) {
11434
11438
  if (props.onBlur)
11435
11439
  props.onBlur(props.name);
11436
11440
  };
11437
- return (jsxRuntime.jsxs(Container$5, { children: [jsxRuntime.jsx(Label$1, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Textarea, { defaultValue: props.defaultValue, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, placeholder: props.placeholder, id: props.name, rows: props.rows, onChange: onChange, onBlur: onBlur }), props.tips && (jsxRuntime.jsxs("div", __assign$2({ style: { marginLeft: "5px" } }, { children: [jsxRuntime.jsx(Spacer, { vertical: 5 }), props.tips.map(function (tip, index) { return (jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small", weight: "regular" }, { children: ["\u2022 ", tip] }), "".concat(tip, "-").concat(index))); })] })))] }));
11441
+ return (jsxRuntime.jsxs(Container$6, { children: [jsxRuntime.jsx(Label$1, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Textarea, { defaultValue: props.defaultValue, autoComplete: props.autoComplete, autoFocus: props.autoFocus, disabled: props.disabled, placeholder: props.placeholder, id: props.name, rows: props.rows, onChange: onChange, onBlur: onBlur }), props.tips && (jsxRuntime.jsxs("div", __assign$2({ style: { marginLeft: "5px" } }, { children: [jsxRuntime.jsx(Spacer, { vertical: 5 }), props.tips.map(function (tip, index) { return (jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small", weight: "regular" }, { children: ["\u2022 ", tip] }), "".concat(tip, "-").concat(index))); })] })))] }));
11438
11442
  };
11439
11443
 
11440
- var Container$4 = styled__default["default"].div(templateObject_1$7 || (templateObject_1$7 = __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"])));
11441
- var Label = styled__default["default"](StyledParagraph)(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
11442
- var templateObject_1$7, templateObject_2$6;
11444
+ var Container$5 = styled__default["default"].div(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject$1(["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n flex-wrap: wrap;\n"])));
11445
+ var Label = styled__default["default"](StyledParagraph)(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
11446
+ var templateObject_1$8, templateObject_2$7;
11443
11447
 
11444
11448
  var RangeField = function (props) {
11445
11449
  var onChange = function (value) {
@@ -11450,25 +11454,25 @@ var RangeField = function (props) {
11450
11454
  if (props.onBlur)
11451
11455
  props.onBlur(props.name);
11452
11456
  };
11453
- return (jsxRuntime.jsxs(Container$4, { children: [jsxRuntime.jsx(Label, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Range, { defaultValue: props.defaultValue, autoFocus: props.autoFocus, disabled: props.disabled, id: props.name, onChange: onChange, onBlur: onBlur })] }));
11457
+ return (jsxRuntime.jsxs(Container$5, { children: [jsxRuntime.jsx(Label, __assign$2({ as: "label", htmlFor: props.name }, { children: props.label })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Range, { defaultValue: props.defaultValue, autoFocus: props.autoFocus, disabled: props.disabled, id: props.name, onChange: onChange, onBlur: onBlur })] }));
11454
11458
  };
11455
11459
 
11456
11460
  var FeedbackColors = {
11457
11461
  success: theme.colors.green.base,
11458
11462
  error: theme.colors.red.base,
11459
11463
  };
11460
- var FieldWrapper = styled__default["default"].div(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject$1(["\n input, select {\n border-color: ", ";\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"], ["\n input, select {\n border-color: ", ";\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"])), function (_a) {
11464
+ var FieldWrapper = styled__default["default"].div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject$1(["\n input, select {\n border-color: ", ";\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"], ["\n input, select {\n border-color: ", ";\n }\n\n :not(:last-child) {\n margin-bottom: 20px;\n }\n"])), function (_a) {
11461
11465
  var status = _a.status;
11462
11466
  return FeedbackColors[status];
11463
11467
  });
11464
- var FeedbackWrapper = styled__default["default"].div(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject$1(["\n display: flex;\n align-items: center;\n margin-top: 5px;\n\n > div:first-child {\n min-width: 24px;\n min-height: 24px;\n margin-right: 5px;\n }\n\n svg {\n fill: ", ";\n }\n p {\n color: ", ";\n }\n"], ["\n display: flex;\n align-items: center;\n margin-top: 5px;\n\n > div:first-child {\n min-width: 24px;\n min-height: 24px;\n margin-right: 5px;\n }\n\n svg {\n fill: ", ";\n }\n p {\n color: ", ";\n }\n"])), function (_a) {
11468
+ var FeedbackWrapper = styled__default["default"].div(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject$1(["\n display: flex;\n align-items: center;\n margin-top: 5px;\n\n > div:first-child {\n min-width: 24px;\n min-height: 24px;\n margin-right: 5px;\n }\n\n svg {\n fill: ", ";\n }\n p {\n color: ", ";\n }\n"], ["\n display: flex;\n align-items: center;\n margin-top: 5px;\n\n > div:first-child {\n min-width: 24px;\n min-height: 24px;\n margin-right: 5px;\n }\n\n svg {\n fill: ", ";\n }\n p {\n color: ", ";\n }\n"])), function (_a) {
11465
11469
  var status = _a.status;
11466
11470
  return FeedbackColors[status];
11467
11471
  }, function (_a) {
11468
11472
  var status = _a.status;
11469
11473
  return FeedbackColors[status];
11470
11474
  });
11471
- var templateObject_1$6, templateObject_2$5;
11475
+ var templateObject_1$7, templateObject_2$6;
11472
11476
 
11473
11477
  var WithValidation = function (_a) {
11474
11478
  var status = _a.status, message = _a.message, children = _a.children;
@@ -11481,10 +11485,10 @@ var WithValidation = function (_a) {
11481
11485
  return (jsxRuntime.jsxs(FieldWrapper, __assign$2({ status: status }, { children: [children, jsxRuntime.jsxs(FeedbackWrapper, __assign$2({ status: status }, { children: [jsxRuntime.jsx(Icon, { type: icons[status], size: "small" }), jsxRuntime.jsx(Paragraph, __assign$2({ size: "small" }, { children: message }))] }))] })));
11482
11486
  };
11483
11487
 
11484
- var FormWrapper = styled__default["default"].form(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject$1([""], [""])));
11485
- var DescriptionWrapper = styled__default["default"].div(templateObject_2$4 || (templateObject_2$4 = __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);
11486
- var ButtonWrapper = styled__default["default"].div(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject$1(["\n padding-top: 30px;\n"], ["\n padding-top: 30px;\n"])));
11487
- var templateObject_1$5, templateObject_2$4, templateObject_3$4;
11488
+ var FormWrapper = styled__default["default"].form(templateObject_1$6 || (templateObject_1$6 = __makeTemplateObject$1([""], [""])));
11489
+ var DescriptionWrapper = styled__default["default"].div(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject$1(["\n margin-bottom: 20px;\n\n a {\n color: ", ";\n\n :hover {\n color: ", ";\n }\n }\n"], ["\n margin-bottom: 20px;\n\n a {\n color: ", ";\n\n :hover {\n color: ", ";\n }\n }\n"])), theme.colors.darkGray.light, theme.colors.blue.base);
11490
+ var ButtonWrapper = styled__default["default"].div(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject$1(["\n padding-top: 30px;\n"], ["\n padding-top: 30px;\n"])));
11491
+ var templateObject_1$6, templateObject_2$5, templateObject_3$5;
11488
11492
 
11489
11493
  var Form = React$3.forwardRef(function (props, ref) {
11490
11494
  var _a = React$3.useState({}), values = _a[0], setValues = _a[1];
@@ -11667,7 +11671,7 @@ var Form = React$3.forwardRef(function (props, ref) {
11667
11671
  }) }), props.button && (jsxRuntime.jsx(ButtonWrapper, { children: jsxRuntime.jsx(Button, __assign$2({}, props.button, { onClick: onSubmit, type: "submit" })) }))] }));
11668
11672
  });
11669
11673
 
11670
- var Container$3 = styled__default["default"].div(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject$1(["\n min-width: 40px;\n max-width: 40px;\n min-height: 40px;\n max-height: 40px;\n\n display: flex;\n flex-direction: column-reverse;\n align-items: center;\n justify-content: space-evenly;\n\n border-radius: 3px;\n border-color: ", ";\n\n background-color: ", ";\n box-sizing: border-box;\n border-width: ", ";\n border-style: solid;\n\n svg {\n fill: ", ";\n }\n\n h6 {\n color: ", ";\n font-size: 16px;\n line-height: 12px;\n }\n"], ["\n min-width: 40px;\n max-width: 40px;\n min-height: 40px;\n max-height: 40px;\n\n display: flex;\n flex-direction: column-reverse;\n align-items: center;\n justify-content: space-evenly;\n\n border-radius: 3px;\n border-color: ", ";\n\n background-color: ", ";\n box-sizing: border-box;\n border-width: ", ";\n border-style: solid;\n\n svg {\n fill: ", ";\n }\n\n h6 {\n color: ", ";\n font-size: 16px;\n line-height: 12px;\n }\n"])), function (_a) {
11674
+ var Container$4 = styled__default["default"].div(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject$1(["\n min-width: 40px;\n max-width: 40px;\n min-height: 40px;\n max-height: 40px;\n\n display: flex;\n flex-direction: column-reverse;\n align-items: center;\n justify-content: space-evenly;\n\n border-radius: 3px;\n border-color: ", ";\n\n background-color: ", ";\n box-sizing: border-box;\n border-width: ", ";\n border-style: solid;\n\n svg {\n fill: ", ";\n }\n\n h6 {\n color: ", ";\n font-size: 16px;\n line-height: 12px;\n }\n"], ["\n min-width: 40px;\n max-width: 40px;\n min-height: 40px;\n max-height: 40px;\n\n display: flex;\n flex-direction: column-reverse;\n align-items: center;\n justify-content: space-evenly;\n\n border-radius: 3px;\n border-color: ", ";\n\n background-color: ", ";\n box-sizing: border-box;\n border-width: ", ";\n border-style: solid;\n\n svg {\n fill: ", ";\n }\n\n h6 {\n color: ", ";\n font-size: 16px;\n line-height: 12px;\n }\n"])), function (_a) {
11671
11675
  var color = _a.color, active = _a.active;
11672
11676
  if (active)
11673
11677
  return theme.colors[color].dark;
@@ -11691,20 +11695,20 @@ var Container$3 = styled__default["default"].div(templateObject_1$4 || (template
11691
11695
  return theme.colors[color].base;
11692
11696
  return "";
11693
11697
  });
11694
- var templateObject_1$4;
11698
+ var templateObject_1$5;
11695
11699
 
11696
11700
  var Key = function (props) {
11697
11701
  var _a;
11698
- return (jsxRuntime.jsx(Container$3, __assign$2({ color: props.color, active: props.active }, { children: props.color === "pink" ? (jsxRuntime.jsx("svg", __assign$2({ width: "28", height: "7", viewBox: "0 0 28 7" }, { children: jsxRuntime.jsx("path", { d: "M0 4.5V1C0 0.447715 0.447715 0 1 0H2C2.55228 0 3 0.447715 3 1V4H25V1C25 0.447715 25.4477 0 26 0H27C27.5523 0 28 0.447715 28 1V4.5C28 5.88071 26.8807 7 25.5 7H2.5C1.11929 7 0 5.88071 0 4.5Z" }) }))) : ((_a = props.characters) === null || _a === void 0 ? void 0 : _a.map(function (character, index) { return (jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: character }), "".concat(character, "-").concat(index))); })) })));
11702
+ return (jsxRuntime.jsx(Container$4, __assign$2({ color: props.color, active: props.active }, { children: props.color === "pink" ? (jsxRuntime.jsx("svg", __assign$2({ width: "28", height: "7", viewBox: "0 0 28 7" }, { children: jsxRuntime.jsx("path", { d: "M0 4.5V1C0 0.447715 0.447715 0 1 0H2C2.55228 0 3 0.447715 3 1V4H25V1C25 0.447715 25.4477 0 26 0H27C27.5523 0 28 0.447715 28 1V4.5C28 5.88071 26.8807 7 25.5 7H2.5C1.11929 7 0 5.88071 0 4.5Z" }) }))) : ((_a = props.characters) === null || _a === void 0 ? void 0 : _a.map(function (character, index) { return (jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: character }), "".concat(character, "-").concat(index))); })) })));
11699
11703
  };
11700
11704
 
11701
- var Container$2 = styled__default["default"].div(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject$1(["\n width: 720px;\n background-color: #cacbd6;\n box-shadow: #7b7f81 0px 8px 0px;\n border-radius: 10px;\n padding: 25px 20px;\n box-sizing: border-box;\n"], ["\n width: 720px;\n background-color: #cacbd6;\n box-shadow: #7b7f81 0px 8px 0px;\n border-radius: 10px;\n padding: 25px 20px;\n box-sizing: border-box;\n"])));
11702
- var SpecialRow = styled__default["default"].div(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n\n > div:last-child {\n min-width: 60px;\n max-width: 60px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n\n > div:last-child {\n min-width: 60px;\n max-width: 60px;\n }\n"])));
11703
- var TopRow = styled__default["default"].div(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child {\n min-width: 50px;\n max-width: 50px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child {\n min-width: 50px;\n max-width: 50px;\n }\n"])));
11705
+ var Container$3 = styled__default["default"].div(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject$1(["\n width: 720px;\n background-color: #cacbd6;\n box-shadow: #7b7f81 0px 8px 0px;\n border-radius: 10px;\n padding: 25px 20px;\n box-sizing: border-box;\n"], ["\n width: 720px;\n background-color: #cacbd6;\n box-shadow: #7b7f81 0px 8px 0px;\n border-radius: 10px;\n padding: 25px 20px;\n box-sizing: border-box;\n"])));
11706
+ var SpecialRow = styled__default["default"].div(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n\n > div:last-child {\n min-width: 60px;\n max-width: 60px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n\n > div:last-child {\n min-width: 60px;\n max-width: 60px;\n }\n"])));
11707
+ var TopRow = styled__default["default"].div(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child {\n min-width: 50px;\n max-width: 50px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child {\n min-width: 50px;\n max-width: 50px;\n }\n"])));
11704
11708
  var StartRow = styled__default["default"].div(templateObject_4$3 || (templateObject_4$3 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child {\n min-width: 70px;\n max-width: 70px;\n }\n > div:last-child {\n min-width: 65px;\n max-width: 65px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child {\n min-width: 70px;\n max-width: 70px;\n }\n > div:last-child {\n min-width: 65px;\n max-width: 65px;\n }\n"])));
11705
11709
  var BottomRow = styled__default["default"].div(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child,\n > div:last-child {\n min-width: 90px;\n max-width: 90px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child,\n > div:last-child {\n min-width: 90px;\n max-width: 90px;\n }\n"])));
11706
11710
  var SpacebarRow = styled__default["default"].div(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject$1(["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child,\n > div:last-child {\n min-width: 70px;\n max-width: 70px;\n }\n\n > div:nth-child(5) {\n min-width: 220px;\n max-width: 220px;\n }\n"], ["\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n\n > div:first-child,\n > div:last-child {\n min-width: 70px;\n max-width: 70px;\n }\n\n > div:nth-child(5) {\n min-width: 220px;\n max-width: 220px;\n }\n"])));
11707
- var templateObject_1$3, templateObject_2$3, templateObject_3$3, templateObject_4$3, templateObject_5$2, templateObject_6$2;
11711
+ var templateObject_1$4, templateObject_2$4, templateObject_3$4, templateObject_4$3, templateObject_5$2, templateObject_6$2;
11708
11712
 
11709
11713
  var Keyboard = function (props) {
11710
11714
  var _a = React$3.useState(), keys = _a[0], setKeys = _a[1];
@@ -11728,7 +11732,7 @@ var Keyboard = function (props) {
11728
11732
  }, [props.keys]);
11729
11733
  if (!keys)
11730
11734
  return null;
11731
- return (jsxRuntime.jsxs(Container$2, { children: [jsxRuntime.jsxs(SpecialRow, { children: [jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, { characters: [keys[44].character, keys[89].character], color: keys[44].color, active: keys[44].character === props.activeKey ||
11735
+ return (jsxRuntime.jsxs(Container$3, { children: [jsxRuntime.jsxs(SpecialRow, { children: [jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, { characters: [keys[44].character, keys[89].character], color: keys[44].color, active: keys[44].character === props.activeKey ||
11732
11736
  keys[89].character === props.activeKey }, 44), jsxRuntime.jsx(Key, { characters: [keys[42].character, keys[87].character], color: keys[42].color, active: keys[42].character === props.activeKey ||
11733
11737
  keys[87].character === props.activeKey }), jsxRuntime.jsx(Key, { characters: [keys[40].character, keys[85].character], color: keys[40].color, active: keys[40].character === props.activeKey ||
11734
11738
  keys[85].character === props.activeKey }), jsxRuntime.jsx(Key, { characters: [keys[38].character, keys[83].character], color: keys[38].color, active: keys[38].character === props.activeKey ||
@@ -11776,8 +11780,8 @@ var Keyboard = function (props) {
11776
11780
  keys[76].character === props.activeKey }), jsxRuntime.jsx(Key, { characters: ["Shift"], color: keys[31].color, active: shiftKeys.left.includes(props.activeKey) })] }), jsxRuntime.jsxs(SpacebarRow, { children: [jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, { color: keys[1].color, active: keys[1].character === props.activeKey }), jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, {}), jsxRuntime.jsx(Key, {})] })] }));
11777
11781
  };
11778
11782
 
11779
- var Mask = styled__default["default"].div(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject$1(["\n width: 100vw;\n height: 100vh;\n position: fixed;\n background-color: rgba(35, 41, 47, 50%);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n"], ["\n width: 100vw;\n height: 100vh;\n position: fixed;\n background-color: rgba(35, 41, 47, 50%);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n"])));
11780
- var CardWrapper = styled__default["default"].div(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject$1(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
11783
+ var Mask = styled__default["default"].div(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject$1(["\n width: 100vw;\n height: 100vh;\n position: fixed;\n background-color: rgba(35, 41, 47, 50%);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n"], ["\n width: 100vw;\n height: 100vh;\n position: fixed;\n background-color: rgba(35, 41, 47, 50%);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n"])));
11784
+ var CardWrapper = styled__default["default"].div(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject$1(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
11781
11785
  var width = _a.width;
11782
11786
  if (!width)
11783
11787
  return "720px";
@@ -11785,11 +11789,11 @@ var CardWrapper = styled__default["default"].div(templateObject_2$2 || (template
11785
11789
  return "".concat(width, "px");
11786
11790
  return width;
11787
11791
  });
11788
- var TitleWrapper = styled__default["default"].div(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject$1(["\n margin: 0 25px 20px 0;\n"], ["\n margin: 0 25px 20px 0;\n"])));
11792
+ var TitleWrapper$1 = styled__default["default"].div(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject$1(["\n margin: 0 25px 20px 0;\n"], ["\n margin: 0 25px 20px 0;\n"])));
11789
11793
  var CloseIconWrapper = styled__default["default"].div(templateObject_4$2 || (templateObject_4$2 = __makeTemplateObject$1(["\n display: flex;\n justify-content: flex-end;\n position: absolute;\n top: 20px;\n right: 20px;\n\n svg {\n cursor: pointer;\n\n :hover {\n fill: ", ";\n }\n }\n"], ["\n display: flex;\n justify-content: flex-end;\n position: absolute;\n top: 20px;\n right: 20px;\n\n svg {\n cursor: pointer;\n\n :hover {\n fill: ", ";\n }\n }\n"])), theme.colors.darkGray.base);
11790
11794
  var ChildrenWrapper = styled__default["default"].div(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject$1(["\n padding: 20px 35px;\n"], ["\n padding: 20px 35px;\n"])));
11791
11795
  var FooterContainer = styled__default["default"].div(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject$1(["\n width: calc(100% + 30px);\n box-sizing: border-box;\n min-height: 45px;\n background-color: ", ";\n border-top: 1px solid ", ";\n margin: 15px -15px -15px;\n padding: 15px;\n display: flex;\n justify-content: flex-end;\n gap: 10px;\n"], ["\n width: calc(100% + 30px);\n box-sizing: border-box;\n min-height: 45px;\n background-color: ", ";\n border-top: 1px solid ", ";\n margin: 15px -15px -15px;\n padding: 15px;\n display: flex;\n justify-content: flex-end;\n gap: 10px;\n"])), theme.colors.lightGray.dark, theme.colors.lightGray.darker);
11792
- var templateObject_1$2, templateObject_2$2, templateObject_3$2, templateObject_4$2, templateObject_5$1, templateObject_6$1;
11796
+ var templateObject_1$3, templateObject_2$3, templateObject_3$3, templateObject_4$2, templateObject_5$1, templateObject_6$1;
11793
11797
 
11794
11798
  var Modal = function (props) {
11795
11799
  var _a = React$3.useState(props.isOpen), isOpen = _a[0], setIsOpen = _a[1];
@@ -11803,15 +11807,15 @@ var Modal = function (props) {
11803
11807
  }, [isOpen]);
11804
11808
  if (!isOpen)
11805
11809
  return null;
11806
- return (jsxRuntime.jsx(Mask, { children: jsxRuntime.jsx(CardWrapper, __assign$2({}, props, { children: jsxRuntime.jsxs(Card, { children: [isClosable && (jsxRuntime.jsx(CloseIconWrapper, { children: jsxRuntime.jsx(Icon, { type: "cross", onClick: function () { return setIsOpen(false); } }) })), jsxRuntime.jsxs(ChildrenWrapper, { children: [props.title && (jsxRuntime.jsx(TitleWrapper, { children: jsxRuntime.jsx(Heading, __assign$2({ type: "h2" }, { children: props.title })) })), props.children] }), !props.okButton && !props.closeButton ? null : (jsxRuntime.jsxs(FooterContainer, { children: [props.closeButton && (jsxRuntime.jsx(Button, { label: props.closeButton.label, onClick: props.closeButton.onClick, color: "white", size: "small" })), props.okButton && (jsxRuntime.jsx(Button, { label: props.okButton.label, onClick: props.okButton.onClick, size: "small" }))] }))] }) })) }));
11810
+ return (jsxRuntime.jsx(Mask, { children: jsxRuntime.jsx(CardWrapper, __assign$2({}, props, { children: jsxRuntime.jsxs(Card, { children: [isClosable && (jsxRuntime.jsx(CloseIconWrapper, { children: jsxRuntime.jsx(Icon, { type: "cross", onClick: function () { return setIsOpen(false); } }) })), jsxRuntime.jsxs(ChildrenWrapper, { children: [props.title && (jsxRuntime.jsx(TitleWrapper$1, { children: jsxRuntime.jsx(Heading, __assign$2({ type: "h2" }, { children: props.title })) })), props.children] }), !props.okButton && !props.closeButton ? null : (jsxRuntime.jsxs(FooterContainer, { children: [props.closeButton && (jsxRuntime.jsx(Button, { label: props.closeButton.label, onClick: props.closeButton.onClick, color: "white", size: "small" })), props.okButton && (jsxRuntime.jsx(Button, { label: props.okButton.label, onClick: props.okButton.onClick, size: "small" }))] }))] }) })) }));
11807
11811
  };
11808
11812
 
11809
- var Container$1 = styled__default["default"].div(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject$1(["\n width: 100%;\n min-height: 90px;\n border-radius: 6px;\n border-width: 3px;\n border-style: solid;\n border-color: ", ";\n background-color: ", ";\n padding: 20px;\n display: flex;\n box-sizing: border-box;\n"], ["\n width: 100%;\n min-height: 90px;\n border-radius: 6px;\n border-width: 3px;\n border-style: solid;\n border-color: ", ";\n background-color: ", ";\n padding: 20px;\n display: flex;\n box-sizing: border-box;\n"])), function (_a) {
11813
+ var Container$2 = styled__default["default"].div(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject$1(["\n width: 100%;\n min-height: 90px;\n border-radius: 6px;\n border-width: 3px;\n border-style: solid;\n border-color: ", ";\n background-color: ", ";\n padding: 20px;\n display: flex;\n box-sizing: border-box;\n"], ["\n width: 100%;\n min-height: 90px;\n border-radius: 6px;\n border-width: 3px;\n border-style: solid;\n border-color: ", ";\n background-color: ", ";\n padding: 20px;\n display: flex;\n box-sizing: border-box;\n"])), function (_a) {
11810
11814
  var passed = _a.passed;
11811
11815
  return passed ? theme.colors.green.base : theme.colors.red.base;
11812
11816
  }, theme.colors.lightGray.light);
11813
- var ProgressBarWrapper = styled__default["default"].div(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject$1(["\n width: 50%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n margin-top: 15px;\n margin-left: auto;\n position: relative;\n\n > div:last-child {\n display: flex;\n justify-content: space-between;\n margin-top: 3px;\n }\n"], ["\n width: 50%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n margin-top: 15px;\n margin-left: auto;\n position: relative;\n\n > div:last-child {\n display: flex;\n justify-content: space-between;\n margin-top: 3px;\n }\n"])));
11814
- var Indicator = styled__default["default"].div(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject$1(["\n width: 4px;\n height: 22px;\n background-color: ", ";\n position: absolute;\n left: ", ";\n z-index: 1;\n top: -4px;\n"], ["\n width: 4px;\n height: 22px;\n background-color: ", ";\n position: absolute;\n left: ", ";\n z-index: 1;\n top: -4px;\n"])), theme.colors.blue.darker, function (_a) {
11817
+ var ProgressBarWrapper = styled__default["default"].div(templateObject_2$2 || (templateObject_2$2 = __makeTemplateObject$1(["\n width: 50%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n margin-top: 15px;\n margin-left: auto;\n position: relative;\n\n > div:last-child {\n display: flex;\n justify-content: space-between;\n margin-top: 3px;\n }\n"], ["\n width: 50%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n margin-top: 15px;\n margin-left: auto;\n position: relative;\n\n > div:last-child {\n display: flex;\n justify-content: space-between;\n margin-top: 3px;\n }\n"])));
11818
+ var Indicator = styled__default["default"].div(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject$1(["\n width: 4px;\n height: 22px;\n background-color: ", ";\n position: absolute;\n left: ", ";\n z-index: 1;\n top: -4px;\n"], ["\n width: 4px;\n height: 22px;\n background-color: ", ";\n position: absolute;\n left: ", ";\n z-index: 1;\n top: -4px;\n"])), theme.colors.blue.darker, function (_a) {
11815
11819
  var value = _a.value;
11816
11820
  return "".concat(value, "%");
11817
11821
  });
@@ -11819,7 +11823,7 @@ var Target = styled__default["default"].div(templateObject_4$1 || (templateObjec
11819
11823
  var value = _a.value, width = _a.width;
11820
11824
  return "calc(".concat(value, "% - ").concat(width / 2, "px)");
11821
11825
  }, theme.colors.blue.darker);
11822
- var templateObject_1$1, templateObject_2$1, templateObject_3$1, templateObject_4$1;
11826
+ var templateObject_1$2, templateObject_2$2, templateObject_3$2, templateObject_4$1;
11823
11827
 
11824
11828
  var Result = function (props) {
11825
11829
  var ref = React$3.useRef(null);
@@ -11829,12 +11833,12 @@ var Result = function (props) {
11829
11833
  var _a;
11830
11834
  setTargetWidth((_a = ref.current) === null || _a === void 0 ? void 0 : _a.offsetWidth);
11831
11835
  }, [ref]);
11832
- return (jsxRuntime.jsxs(Container$1, __assign$2({ passed: isPassed }, { children: [jsxRuntime.jsx(Icon, { type: isPassed ? "check" : "warning", color: isPassed ? "green" : "red", size: "large" }), jsxRuntime.jsx(Spacer, { horizontal: 15 }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h5" }, { children: props.title })), jsxRuntime.jsx(Paragraph, { children: props.subtitle })] }), props.progressBar && (jsxRuntime.jsxs(ProgressBarWrapper, { children: [jsxRuntime.jsx(Indicator, { value: (props.target / props.progressBar.max) * 100 }), jsxRuntime.jsx(Target, __assign$2({ value: (props.target / props.progressBar.max) * 100, width: targetWidth, ref: ref }, { children: jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.target, props.progressBar.unit] })) })), jsxRuntime.jsx(ProgressBar, { percent: (props.value / props.progressBar.max) * 100, color: isPassed ? "green" : "red" }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.progressBar.min, props.progressBar.unit] })), jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.progressBar.max, props.progressBar.unit] }))] })] }))] })));
11836
+ return (jsxRuntime.jsxs(Container$2, __assign$2({ passed: isPassed }, { children: [jsxRuntime.jsx(Icon, { type: isPassed ? "check" : "warning", color: isPassed ? "green" : "red", size: "large" }), jsxRuntime.jsx(Spacer, { horizontal: 15 }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h5" }, { children: props.title })), jsxRuntime.jsx(Paragraph, { children: props.subtitle })] }), props.progressBar && (jsxRuntime.jsxs(ProgressBarWrapper, { children: [jsxRuntime.jsx(Indicator, { value: (props.target / props.progressBar.max) * 100 }), jsxRuntime.jsx(Target, __assign$2({ value: (props.target / props.progressBar.max) * 100, width: targetWidth, ref: ref }, { children: jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.target, props.progressBar.unit] })) })), jsxRuntime.jsx(ProgressBar, { percent: (props.value / props.progressBar.max) * 100, color: isPassed ? "green" : "red" }), jsxRuntime.jsxs("div", { children: [jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.progressBar.min, props.progressBar.unit] })), jsxRuntime.jsxs(Paragraph, __assign$2({ size: "small" }, { children: [props.progressBar.max, props.progressBar.unit] }))] })] }))] })));
11833
11837
  };
11834
11838
 
11835
- var Container = styled__default["default"].table(templateObject_1 || (templateObject_1 = __makeTemplateObject$1(["\n width: 100%;\n border-collapse: collapse;\n border-radius: 6px;\n border-style: hidden;\n overflow: hidden;\n box-shadow: 0 0 0 1px ", ";\n"], ["\n width: 100%;\n border-collapse: collapse;\n border-radius: 6px;\n border-style: hidden;\n overflow: hidden;\n box-shadow: 0 0 0 1px ", ";\n"])), theme.colors.lightGray.dark);
11836
- var TableHead = styled__default["default"].thead(templateObject_2 || (templateObject_2 = __makeTemplateObject$1([""], [""])));
11837
- var TableBody = styled__default["default"].tbody(templateObject_3 || (templateObject_3 = __makeTemplateObject$1([""], [""])));
11839
+ var Container$1 = styled__default["default"].table(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject$1(["\n width: 100%;\n border-collapse: collapse;\n border-radius: 6px;\n border-style: hidden;\n overflow: hidden;\n box-shadow: 0 0 0 1px ", ";\n"], ["\n width: 100%;\n border-collapse: collapse;\n border-radius: 6px;\n border-style: hidden;\n overflow: hidden;\n box-shadow: 0 0 0 1px ", ";\n"])), theme.colors.lightGray.dark);
11840
+ var TableHead = styled__default["default"].thead(templateObject_2$1 || (templateObject_2$1 = __makeTemplateObject$1([""], [""])));
11841
+ var TableBody = styled__default["default"].tbody(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject$1([""], [""])));
11838
11842
  styled__default["default"].tfoot(templateObject_4 || (templateObject_4 = __makeTemplateObject$1([""], [""])));
11839
11843
  var ColumnTitle = styled__default["default"].th(templateObject_5 || (templateObject_5 = __makeTemplateObject$1(["\n text-align: left;\n padding-left: 15px;\n"], ["\n text-align: left;\n padding-left: 15px;\n"])));
11840
11844
  var TableRow = styled__default["default"].tr(templateObject_6 || (templateObject_6 = __makeTemplateObject$1(["\n height: 50px;\n border-bottom: 1px solid ", ";\n\n :nth-child(odd) {\n background: ", ";\n }\n :nth-child(even) {\n background: ", ";\n }\n"], ["\n height: 50px;\n border-bottom: 1px solid ", ";\n\n :nth-child(odd) {\n background: ", ";\n }\n :nth-child(even) {\n background: ", ";\n }\n"])), theme.colors.lightGray.dark, theme.colors.lightGray.light, theme.colors.lightGray.base);
@@ -11851,11 +11855,11 @@ var TableCell = styled__default["default"].td(templateObject_7 || (templateObjec
11851
11855
  }
11852
11856
  });
11853
11857
  var EmptyTableCell = styled__default["default"].td(templateObject_8 || (templateObject_8 = __makeTemplateObject$1(["\n p {\n color: ", ";\n }\n"], ["\n p {\n color: ", ";\n }\n"])), theme.colors.lightGray.darker);
11854
- var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
11858
+ var templateObject_1$1, templateObject_2$1, templateObject_3$1, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
11855
11859
 
11856
11860
  var Table = function (_a) {
11857
11861
  var columns = _a.columns, data = _a.data, empytText = _a.empytText;
11858
- return (jsxRuntime.jsxs(Container, { children: [jsxRuntime.jsx(TableHead, { children: jsxRuntime.jsx(TableRow, { children: columns.map(function (_a, index) {
11862
+ return (jsxRuntime.jsxs(Container$1, { children: [jsxRuntime.jsx(TableHead, { children: jsxRuntime.jsx(TableRow, { children: columns.map(function (_a, index) {
11859
11863
  var title = _a.title, dataIndex = _a.dataIndex;
11860
11864
  return (jsxRuntime.jsx(ColumnTitle, { children: title && (jsxRuntime.jsx(Heading, __assign$2({ type: "h6", as: "span" }, { children: title }))) }, "".concat(dataIndex, "-").concat(index)));
11861
11865
  }) }) }), jsxRuntime.jsx(TableBody, { children: data.length === 0 ? (jsxRuntime.jsx(TableRow, { children: jsxRuntime.jsx(EmptyTableCell, __assign$2({ colSpan: columns.length }, { children: jsxRuntime.jsx(Paragraph, __assign$2({ align: "center", size: "small", weight: "regular" }, { children: empytText || "No data" })) })) })) : (data.map(function (row, index) {
@@ -11867,6 +11871,75 @@ var Table = function (_a) {
11867
11871
  })) })] }));
11868
11872
  };
11869
11873
 
11874
+ var Container = styled__default["default"].div(templateObject_1 || (templateObject_1 = __makeTemplateObject$1(["\n display: flex;\n align-items: stretch;\n\n > div:nth-child(odd) {\n width: 100%;\n min-width: 180px;\n min-height: 180px;\n\n > div {\n padding: 0;\n }\n }\n"], ["\n display: flex;\n align-items: stretch;\n\n > div:nth-child(odd) {\n width: 100%;\n min-width: 180px;\n min-height: 180px;\n\n > div {\n padding: 0;\n }\n }\n"])));
11875
+ var TitleWrapper = styled__default["default"].div(templateObject_2 || (templateObject_2 = __makeTemplateObject$1(["\n width: 100%;\n box-sizing: border-box;\n padding: 10px 15px;\n border-bottom: 1px solid ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n"], ["\n width: 100%;\n box-sizing: border-box;\n padding: 10px 15px;\n border-bottom: 1px solid ", ";\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])), theme.colors.lightGray.dark);
11876
+ var CheckboxesWrapper = styled__default["default"].div(templateObject_3 || (templateObject_3 = __makeTemplateObject$1(["\n height: 100%;\n max-height: 310px;\n background-color: ", ";\n padding: 15px;\n\n fieldset {\n height: 100%;\n overflow: scroll;\n padding-left: 2px;\n\n > div > div:not(:last-child) {\n margin-bottom: 10px;\n }\n }\n"], ["\n height: 100%;\n max-height: 310px;\n background-color: ", ";\n padding: 15px;\n\n fieldset {\n height: 100%;\n overflow: scroll;\n padding-left: 2px;\n\n > div > div:not(:last-child) {\n margin-bottom: 10px;\n }\n }\n"])), theme.colors.lightGray.base);
11877
+ var templateObject_1, templateObject_2, templateObject_3;
11878
+
11879
+ var Transfer = function (props) {
11880
+ var _a, _b;
11881
+ var _c = React$3.useState(props.targetKeys || []), targetKeys = _c[0], setTargetKeys = _c[1];
11882
+ var _d = React$3.useState([]), selectedSourceKeys = _d[0], setSelectedSourceKeys = _d[1];
11883
+ var _e = React$3.useState([]), selectedTargetKeys = _e[0], setSelectedTargetKeys = _e[1];
11884
+ var onChange = function (newTargetKeys) {
11885
+ setTargetKeys(newTargetKeys);
11886
+ setSelectedSourceKeys([]);
11887
+ setSelectedTargetKeys([]);
11888
+ if (!props.onChange)
11889
+ return;
11890
+ props.onChange(props.dataSource
11891
+ .filter(function (_a) {
11892
+ var key = _a.key;
11893
+ return newTargetKeys.includes(key);
11894
+ })
11895
+ .map(function (_a) {
11896
+ var key = _a.key;
11897
+ return key;
11898
+ }));
11899
+ };
11900
+ var transferRight = function () {
11901
+ var newTargetKeys = __spreadArray(__spreadArray([], targetKeys, true), selectedSourceKeys, true);
11902
+ onChange(newTargetKeys);
11903
+ };
11904
+ var transferLeft = function () {
11905
+ var newTargetKeys = targetKeys.filter(function (key) { return !selectedTargetKeys.includes(key); });
11906
+ onChange(newTargetKeys);
11907
+ };
11908
+ return (jsxRuntime.jsxs(Container, { children: [jsxRuntime.jsxs(Card, __assign$2({ bordered: true }, { children: [((_a = props.titles) === null || _a === void 0 ? void 0 : _a.length) >= 1 && (jsxRuntime.jsxs(TitleWrapper, { children: [jsxRuntime.jsxs(Paragraph, __assign$2({ weight: "regular" }, { children: [selectedSourceKeys.length > 0 && "".concat(selectedSourceKeys.length, "/"), props.dataSource.length - targetKeys.length] })), jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: props.titles[0] }))] })), jsxRuntime.jsx(CheckboxesWrapper, { children: jsxRuntime.jsx(Checkboxes, { name: "source", legend: null, defaultValue: selectedSourceKeys, onChange: function (_, values) { return setSelectedSourceKeys(values); }, items: props.dataSource
11909
+ .filter(function (_a) {
11910
+ var key = _a.key;
11911
+ return !targetKeys.includes(key);
11912
+ })
11913
+ .map(function (_a) {
11914
+ var key = _a.key, title = _a.title;
11915
+ return ({
11916
+ id: key,
11917
+ value: key,
11918
+ label: title,
11919
+ });
11920
+ }) }) }, selectedSourceKeys)] })), jsxRuntime.jsxs("div", __assign$2({ style: {
11921
+ display: "flex",
11922
+ flexDirection: "column",
11923
+ gap: 10,
11924
+ position: "relative",
11925
+ top: 0,
11926
+ bottom: 0,
11927
+ margin: "auto 10px",
11928
+ } }, { children: [jsxRuntime.jsx(IconButton, { icon: "chevronRight", size: "small", onClick: transferRight }), jsxRuntime.jsx(IconButton, { icon: "chevronLeft", size: "small", onClick: transferLeft })] })), jsxRuntime.jsxs(Card, __assign$2({ bordered: true }, { children: [((_b = props.titles) === null || _b === void 0 ? void 0 : _b.length) >= 1 && (jsxRuntime.jsxs(TitleWrapper, { children: [jsxRuntime.jsxs(Paragraph, __assign$2({ weight: "regular" }, { children: [selectedTargetKeys.length > 0 && "".concat(selectedTargetKeys.length, "/"), targetKeys.length] })), jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: props.titles[1] }))] })), jsxRuntime.jsx(CheckboxesWrapper, { children: jsxRuntime.jsx(Checkboxes, { name: "target", legend: null, defaultValue: selectedTargetKeys, onChange: function (_, values) { return setSelectedTargetKeys(values); }, items: props.dataSource
11929
+ .filter(function (_a) {
11930
+ var key = _a.key;
11931
+ return targetKeys.includes(key);
11932
+ })
11933
+ .map(function (_a) {
11934
+ var key = _a.key, title = _a.title;
11935
+ return ({
11936
+ id: key,
11937
+ value: key,
11938
+ label: title,
11939
+ });
11940
+ }) }) }, selectedTargetKeys)] }))] }));
11941
+ };
11942
+
11870
11943
  exports.Alert = Alert;
11871
11944
  exports.Button = Button;
11872
11945
  exports.Card = Card;
@@ -11914,6 +11987,7 @@ exports.Tag = Tag;
11914
11987
  exports.Toggle = Toggle;
11915
11988
  exports.ToggleField = ToggleField;
11916
11989
  exports.Tooltip = Tooltip;
11990
+ exports.Transfer = Transfer;
11917
11991
  exports.Trophy = Trophy;
11918
11992
  exports.theme = theme;
11919
11993
  //# sourceMappingURL=index.js.map