@typeolymp/ui-components 2.2.0 → 2.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/components/molecules/Dropdown/index.d.ts +1 -1
- package/build/components/molecules/LocaleSelect/index.d.ts +0 -1
- package/build/components/molecules/LocaleSelect/styles.d.ts +1 -3
- package/build/components/molecules/LocaleSelect copy/index.d.ts +11 -0
- package/build/components/molecules/LocaleSelect copy/styles.d.ts +4 -0
- package/build/index.es.js +85 -115
- package/build/index.es.js.map +1 -1
- package/build/index.js +85 -115
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.js
CHANGED
|
@@ -3470,7 +3470,7 @@ var Loader = /** @class */ (function (_super) {
|
|
|
3470
3470
|
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
3471
3471
|
_this.style = function (i) {
|
|
3472
3472
|
var _a = _this.props, color = _a.color, size = _a.size, margin = _a.margin, speedMultiplier = _a.speedMultiplier;
|
|
3473
|
-
return react_1.css(templateObject_2$
|
|
3473
|
+
return react_1.css(templateObject_2$C || (templateObject_2$C = __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");
|
|
3474
3474
|
};
|
|
3475
3475
|
return _this;
|
|
3476
3476
|
}
|
|
@@ -3485,7 +3485,7 @@ var Loader = /** @class */ (function (_super) {
|
|
|
3485
3485
|
return Loader;
|
|
3486
3486
|
}(React$2.PureComponent));
|
|
3487
3487
|
var _default$1 = BeatLoader.default = Loader;
|
|
3488
|
-
var templateObject_1$W, templateObject_2$
|
|
3488
|
+
var templateObject_1$W, templateObject_2$C;
|
|
3489
3489
|
|
|
3490
3490
|
var Wrapper$a = styled__default["default"].div(templateObject_1$V || (templateObject_1$V = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n\n :hover {\n cursor: ", ";\n fill: ", ";\n }\n }\n"], ["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n\n :hover {\n cursor: ", ";\n fill: ", ";\n }\n }\n"])), function (_a) {
|
|
3491
3491
|
var size = _a.size;
|
|
@@ -3653,18 +3653,18 @@ var StyledButton = styled__default["default"].button(templateObject_1$U || (temp
|
|
|
3653
3653
|
? "calc(".concat(theme.button.medium.height, " - 3px)")
|
|
3654
3654
|
: "calc(".concat(theme.button[size].height, " - 3px)");
|
|
3655
3655
|
});
|
|
3656
|
-
var DisabledButton = styled__default["default"](StyledButton)(templateObject_2$
|
|
3656
|
+
var DisabledButton = styled__default["default"](StyledButton)(templateObject_2$B || (templateObject_2$B = __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) {
|
|
3657
3657
|
var size = _a.size;
|
|
3658
3658
|
return !size ? theme.button.medium.height : theme.button[size].height;
|
|
3659
3659
|
});
|
|
3660
|
-
var LoaderWrapper = styled__default["default"].div(templateObject_3$
|
|
3660
|
+
var LoaderWrapper = styled__default["default"].div(templateObject_3$f || (templateObject_3$f = __makeTemplateObject$1(["\n width: ", ";\n margin-top: ", ";\n"], ["\n width: ", ";\n margin-top: ", ";\n"])), function (_a) {
|
|
3661
3661
|
var width = _a.width;
|
|
3662
3662
|
return "".concat(width, "px");
|
|
3663
3663
|
}, function (_a) {
|
|
3664
3664
|
var size = _a.size;
|
|
3665
3665
|
return (size === "small" ? "3px" : "");
|
|
3666
3666
|
});
|
|
3667
|
-
var templateObject_1$U, templateObject_2$
|
|
3667
|
+
var templateObject_1$U, templateObject_2$B, templateObject_3$f;
|
|
3668
3668
|
|
|
3669
3669
|
var StyledSpacer = styled__default["default"].div(templateObject_1$T || (templateObject_1$T = __makeTemplateObject$1(["\n min-width: ", ";\n min-height: ", ";\n"], ["\n min-width: ", ";\n min-height: ", ";\n"])), function (_a) {
|
|
3670
3670
|
var horizontal = _a.horizontal;
|
|
@@ -3677,7 +3677,7 @@ var templateObject_1$T;
|
|
|
3677
3677
|
|
|
3678
3678
|
var Spacer = function (props) { return (jsxRuntime.jsx(StyledSpacer, __assign$2({}, props))); };
|
|
3679
3679
|
|
|
3680
|
-
var Button = React$3.forwardRef(function (_a, ref) {
|
|
3680
|
+
var Button$1 = React$3.forwardRef(function (_a, ref) {
|
|
3681
3681
|
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, icon = _a.icon, props = __rest$1(_a, ["label", "color", "size", "fluid", "disabled", "type", "tabIndex", "href", "asAnchor", "icon"]);
|
|
3682
3682
|
var buttonRef = React$3.useRef(null);
|
|
3683
3683
|
var _b = React$3.useState(false), isLoading = _b[0], setIsLoading = _b[1];
|
|
@@ -4186,8 +4186,8 @@ var StyledParagraph = styled__default["default"].p(templateObject_1$O || (templa
|
|
|
4186
4186
|
});
|
|
4187
4187
|
var templateObject_1$O;
|
|
4188
4188
|
|
|
4189
|
-
var Container$
|
|
4190
|
-
var InputIconWrapper = styled__default["default"].div(templateObject_2$
|
|
4189
|
+
var Container$o = styled__default["default"].div(templateObject_1$N || (templateObject_1$N = __makeTemplateObject$1(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
4190
|
+
var InputIconWrapper = styled__default["default"].div(templateObject_2$A || (templateObject_2$A = __makeTemplateObject$1(["\n position: relative;\n width: 100%;\n\n input {\n padding-right: ", ";\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: ", ";\n top: ", ";\n }\n\n svg {\n cursor: ", ";\n width: ", ";\n }\n"], ["\n position: relative;\n width: 100%;\n\n input {\n padding-right: ", ";\n }\n\n input[type=\"date\"] {\n color: ", ";\n }\n\n div {\n position: absolute;\n height: 24px;\n right: ", ";\n top: ", ";\n }\n\n svg {\n cursor: ", ";\n width: ", ";\n }\n"])), function (_a) {
|
|
4191
4191
|
var size = _a.size;
|
|
4192
4192
|
switch (size) {
|
|
4193
4193
|
case "small":
|
|
@@ -4230,7 +4230,7 @@ var InputIconWrapper = styled__default["default"].div(templateObject_2$B || (tem
|
|
|
4230
4230
|
return "24px";
|
|
4231
4231
|
}
|
|
4232
4232
|
});
|
|
4233
|
-
var StyledInput = styled__default["default"].input(templateObject_3$
|
|
4233
|
+
var StyledInput = styled__default["default"].input(templateObject_3$e || (templateObject_3$e = __makeTemplateObject$1(["\n width: 100%;\n min-width: 228px;\n height: ", ";\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 100%;\n min-width: 228px;\n height: ", ";\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 15px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n\n ::placeholder {\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n }\n\n ::-webkit-calendar-picker-indicator {\n display: none;\n }\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
|
|
4234
4234
|
var size = _a.size;
|
|
4235
4235
|
switch (size) {
|
|
4236
4236
|
case "small":
|
|
@@ -4258,7 +4258,7 @@ var Helper = styled__default["default"](StyledParagraph)(templateObject_6$3 || (
|
|
|
4258
4258
|
var isOk = _a.isOk;
|
|
4259
4259
|
return isOk ? theme.colors.green.base : theme.colors.darkGray.light;
|
|
4260
4260
|
}, fadeIn);
|
|
4261
|
-
var templateObject_1$N, templateObject_2$
|
|
4261
|
+
var templateObject_1$N, templateObject_2$A, templateObject_3$e, templateObject_4$6, templateObject_5$3, templateObject_6$3;
|
|
4262
4262
|
|
|
4263
4263
|
var expressions = {};
|
|
4264
4264
|
|
|
@@ -4464,7 +4464,7 @@ var PasswordInput = function (props) {
|
|
|
4464
4464
|
if (props.onKeyPress)
|
|
4465
4465
|
props.onKeyPress(e);
|
|
4466
4466
|
};
|
|
4467
|
-
return (jsxRuntime.jsxs(Container$
|
|
4467
|
+
return (jsxRuntime.jsxs(Container$o, { children: [jsxRuntime.jsxs(InputIconWrapper, __assign$2({ disabled: props.disabled, size: props.size }, { 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]["At least 1 capital letter"]] })), jsxRuntime.jsxs(Helper, __assign$2({ isOk: expressions.hasNumber(value) }, { children: ["\u2022 ", translations[props.helperLocale]["At least 1 number"]] })), jsxRuntime.jsxs(Helper, __assign$2({ isOk: expressions.hasSpecialCharacter(value) }, { children: ["\u2022 ", translations[props.helperLocale]["At least 1 special character"]] })), jsxRuntime.jsxs(Helper, __assign$2({ isOk: value.length >= 8 }, { children: ["\u2022 ", translations[props.helperLocale]["At least 8 characters"]] }))] })) : null] }));
|
|
4468
4468
|
};
|
|
4469
4469
|
|
|
4470
4470
|
function toInteger$2(dirtyNumber) {
|
|
@@ -7966,7 +7966,7 @@ var SearchInput = function (props) {
|
|
|
7966
7966
|
if (value.length <= 0)
|
|
7967
7967
|
onSearch();
|
|
7968
7968
|
};
|
|
7969
|
-
return (jsxRuntime.jsx(Container$
|
|
7969
|
+
return (jsxRuntime.jsx(Container$o, { children: jsxRuntime.jsxs(InputIconWrapper, __assign$2({ disabled: props.disabled, size: props.size }, { children: [jsxRuntime.jsx(Icon, { type: "search", color: "gray", size: "small", onClick: onSearch }), jsxRuntime.jsx(StyledInput, __assign$2({ type: "text" }, rest, { onChange: onChange, onKeyPress: onKeyPress, onBlur: onBlur }))] })) }));
|
|
7970
7970
|
};
|
|
7971
7971
|
|
|
7972
7972
|
var Input = function (props) {
|
|
@@ -8014,7 +8014,7 @@ var Wrapper$6 = styled__default["default"].div(templateObject_1$L || (templateOb
|
|
|
8014
8014
|
var disabled = _a.disabled;
|
|
8015
8015
|
return (disabled ? "49.5px" : "");
|
|
8016
8016
|
});
|
|
8017
|
-
var StyledInputNumber = styled__default["default"].input(templateObject_2$
|
|
8017
|
+
var StyledInputNumber = styled__default["default"].input(templateObject_2$z || (templateObject_2$z = __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) {
|
|
8018
8018
|
var disabled = _a.disabled;
|
|
8019
8019
|
return disabled ? theme.colors.lightGray.base : theme.colors.lightGray.light;
|
|
8020
8020
|
}, function (_a) {
|
|
@@ -8027,7 +8027,7 @@ var StyledInputNumber = styled__default["default"].input(templateObject_2$A || (
|
|
|
8027
8027
|
var disabled = _a.disabled;
|
|
8028
8028
|
return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
|
|
8029
8029
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
8030
|
-
var templateObject_1$L, templateObject_2$
|
|
8030
|
+
var templateObject_1$L, templateObject_2$z;
|
|
8031
8031
|
|
|
8032
8032
|
var Number$1 = function (props) {
|
|
8033
8033
|
var inputRef = React$3.useRef(null);
|
|
@@ -8066,7 +8066,7 @@ var Number$1 = function (props) {
|
|
|
8066
8066
|
onChange();
|
|
8067
8067
|
inputRef.current.focus();
|
|
8068
8068
|
};
|
|
8069
|
-
return (jsxRuntime.jsxs(Wrapper$6, __assign$2({ disabled: props.disabled }, { children: [jsxRuntime.jsx(Button, { label: "-", disabled: props.disabled, onClick: decrease, tabIndex: -1, type: "button" }), jsxRuntime.jsx(StyledInputNumber, __assign$2({ type: "number" }, props, { defaultValue: props.defaultValue || props.min || 0, onChange: onChange, onBlur: onBlur, ref: inputRef })), jsxRuntime.jsx(Button, { label: "+", disabled: props.disabled, onClick: increase, tabIndex: -1, type: "button" })] })));
|
|
8069
|
+
return (jsxRuntime.jsxs(Wrapper$6, __assign$2({ disabled: props.disabled }, { children: [jsxRuntime.jsx(Button$1, { label: "-", disabled: props.disabled, onClick: decrease, tabIndex: -1, type: "button" }), jsxRuntime.jsx(StyledInputNumber, __assign$2({ type: "number" }, props, { defaultValue: props.defaultValue || props.min || 0, onChange: onChange, onBlur: onBlur, ref: inputRef })), jsxRuntime.jsx(Button$1, { label: "+", disabled: props.disabled, onClick: increase, tabIndex: -1, type: "button" })] })));
|
|
8070
8070
|
};
|
|
8071
8071
|
|
|
8072
8072
|
var Paragraph = function (props) { return (jsxRuntime.jsx(StyledParagraph, __assign$2({}, props, { children: props.children }))); };
|
|
@@ -8174,7 +8174,7 @@ var Wrapper$5 = styled__default["default"].div(templateObject_1$I || (templateOb
|
|
|
8174
8174
|
var disabled = _a.disabled;
|
|
8175
8175
|
return (disabled ? "not-allowed" : "pointer");
|
|
8176
8176
|
});
|
|
8177
|
-
var StyledSelect = styled__default["default"].select(templateObject_2$
|
|
8177
|
+
var StyledSelect = styled__default["default"].select(templateObject_2$y || (templateObject_2$y = __makeTemplateObject$1(["\n width: 100%;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 43px 13px 13px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n appearance: none;\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"], ["\n width: 100%;\n height: 50px;\n background-color: ", ";\n border-width: 1px;\n border-style: solid;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n padding: 13px 43px 13px 13px;\n cursor: ", ";\n font-family: ", ";\n font-size: ", ";\n font-weight: 500;\n font-style: normal;\n line-height: ", ";\n color: ", ";\n appearance: none;\n\n :focus {\n outline: 0;\n border-color: ", ";\n box-shadow: ", ";\n }\n"])), function (_a) {
|
|
8178
8178
|
var disabled = _a.disabled;
|
|
8179
8179
|
return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
8180
8180
|
}, function (_a) {
|
|
@@ -8187,7 +8187,7 @@ var StyledSelect = styled__default["default"].select(templateObject_2$z || (temp
|
|
|
8187
8187
|
var isChanged = _a.isChanged;
|
|
8188
8188
|
return isChanged ? theme.colors.darkGray.base : theme.colors.lightGray.darker;
|
|
8189
8189
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
8190
|
-
var templateObject_1$I, templateObject_2$
|
|
8190
|
+
var templateObject_1$I, templateObject_2$y;
|
|
8191
8191
|
|
|
8192
8192
|
var Select = function (props) {
|
|
8193
8193
|
var _a;
|
|
@@ -8241,7 +8241,7 @@ var templateObject_1$H;
|
|
|
8241
8241
|
|
|
8242
8242
|
var Subheading = function (props) { return (jsxRuntime.jsx(StyledSubheading, __assign$2({}, props, { children: props.children }))); };
|
|
8243
8243
|
|
|
8244
|
-
var Container$
|
|
8244
|
+
var Container$n = styled__default["default"].div(templateObject_1$G || (templateObject_1$G = __makeTemplateObject$1(["\n padding: 7px 10px;\n background-color: ", ";\n box-shadow: ", ";\n border: 1px solid;\n border-color: ", ";\n border-radius: 4px;\n box-sizing: border-box;\n text-decoration: none;\n\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n color: ", ";\n"], ["\n padding: 7px 10px;\n background-color: ", ";\n box-shadow: ", ";\n border: 1px solid;\n border-color: ", ";\n border-radius: 4px;\n box-sizing: border-box;\n text-decoration: none;\n\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n font-style: normal;\n color: ", ";\n"])), function (_a) {
|
|
8245
8245
|
var color = _a.color;
|
|
8246
8246
|
if (!color)
|
|
8247
8247
|
return theme.colors.lightGray.base;
|
|
@@ -8266,7 +8266,7 @@ var templateObject_1$G;
|
|
|
8266
8266
|
|
|
8267
8267
|
var Tag = function (_a) {
|
|
8268
8268
|
var color = _a.color, children = _a.children;
|
|
8269
|
-
return jsxRuntime.jsx(Container$
|
|
8269
|
+
return jsxRuntime.jsx(Container$n, __assign$2({ color: color }, { children: children }));
|
|
8270
8270
|
};
|
|
8271
8271
|
|
|
8272
8272
|
var StyledTextarea = styled__default["default"].textarea(templateObject_1$F || (templateObject_1$F = __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) {
|
|
@@ -8292,7 +8292,7 @@ var Textarea = function (props) {
|
|
|
8292
8292
|
return jsxRuntime.jsx(StyledTextarea, __assign$2({}, props, { onChange: onChange }));
|
|
8293
8293
|
};
|
|
8294
8294
|
|
|
8295
|
-
var Container$
|
|
8295
|
+
var Container$m = styled__default["default"].div(templateObject_1$E || (templateObject_1$E = __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) {
|
|
8296
8296
|
var disabled = _a.disabled;
|
|
8297
8297
|
return (disabled ? "not-allowed" : "pointer");
|
|
8298
8298
|
}, function (_a) {
|
|
@@ -8338,7 +8338,7 @@ var Toggle = function (props) {
|
|
|
8338
8338
|
props.onChange(newValue);
|
|
8339
8339
|
}
|
|
8340
8340
|
};
|
|
8341
|
-
return (jsxRuntime.jsx(Container$
|
|
8341
|
+
return (jsxRuntime.jsx(Container$m, __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 }) })));
|
|
8342
8342
|
};
|
|
8343
8343
|
|
|
8344
8344
|
var Wrapper$4 = styled__default["default"].div(templateObject_1$D || (templateObject_1$D = __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) {
|
|
@@ -8388,7 +8388,7 @@ var trophies = {
|
|
|
8388
8388
|
};
|
|
8389
8389
|
var Trophy = function (props) { return (jsxRuntime.jsx(Wrapper$4, __assign$2({}, props, { children: trophies[props.variant][props.level] }))); };
|
|
8390
8390
|
|
|
8391
|
-
var Container$
|
|
8391
|
+
var Container$l = styled__default["default"].div(templateObject_1$C || (templateObject_1$C = __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) {
|
|
8392
8392
|
var type = _a.type;
|
|
8393
8393
|
switch (type) {
|
|
8394
8394
|
case "success":
|
|
@@ -8409,7 +8409,7 @@ var Container$m = styled__default["default"].div(templateObject_1$C || (template
|
|
|
8409
8409
|
return theme.colors.blue.base;
|
|
8410
8410
|
}
|
|
8411
8411
|
});
|
|
8412
|
-
var Action = styled__default["default"].div(templateObject_2$
|
|
8412
|
+
var Action = styled__default["default"].div(templateObject_2$x || (templateObject_2$x = __makeTemplateObject$1(["\n margin-left: 15px;\n cursor: pointer;\n\n :hover p {\n color: ", ";\n }\n"], ["\n margin-left: 15px;\n cursor: pointer;\n\n :hover p {\n color: ", ";\n }\n"])), function (_a) {
|
|
8413
8413
|
var type = _a.type;
|
|
8414
8414
|
switch (type) {
|
|
8415
8415
|
default:
|
|
@@ -8421,7 +8421,7 @@ var Action = styled__default["default"].div(templateObject_2$y || (templateObjec
|
|
|
8421
8421
|
return theme.colors.blue.dark;
|
|
8422
8422
|
}
|
|
8423
8423
|
});
|
|
8424
|
-
var templateObject_1$C, templateObject_2$
|
|
8424
|
+
var templateObject_1$C, templateObject_2$x;
|
|
8425
8425
|
|
|
8426
8426
|
var Alert = function (props) {
|
|
8427
8427
|
var _a = React$3.useState(true), isOpen = _a[0], setIsOpen = _a[1];
|
|
@@ -8441,7 +8441,7 @@ var Alert = function (props) {
|
|
|
8441
8441
|
icon = "infoCircle";
|
|
8442
8442
|
if (!isOpen)
|
|
8443
8443
|
return null;
|
|
8444
|
-
return (jsxRuntime.jsxs(Container$
|
|
8444
|
+
return (jsxRuntime.jsxs(Container$l, __assign$2({}, props, { children: [jsxRuntime.jsx(Icon, { size: "small", type: icon, color: color }), jsxRuntime.jsx(Paragraph, { children: props.message }), props.action && (jsxRuntime.jsx(Action, __assign$2({ type: props.type, onClick: props.action.onClick }, { children: jsxRuntime.jsx(Paragraph, __assign$2({ decoration: "underline" }, { children: props.action.label })) }))), props.isClosable && (jsxRuntime.jsx("div", __assign$2({ style: { marginLeft: "auto" } }, { children: jsxRuntime.jsx(Icon, { size: "tiny", type: "cross", color: color, onClick: function () { return setIsOpen(false); } }) })))] })));
|
|
8445
8445
|
};
|
|
8446
8446
|
|
|
8447
8447
|
var StyledCard = styled__default["default"].div(templateObject_1$B || (templateObject_1$B = __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) {
|
|
@@ -8456,12 +8456,12 @@ var StyledCard = styled__default["default"].div(templateObject_1$B || (templateO
|
|
|
8456
8456
|
}, ";\n\n > div:first-child {\n width: 175%;\n padding-bottom: 175%;\n top: -25%;\n right: -25%;\n }\n }")
|
|
8457
8457
|
: "";
|
|
8458
8458
|
});
|
|
8459
|
-
var Ellipse = styled__default["default"].div(templateObject_2$
|
|
8459
|
+
var Ellipse = styled__default["default"].div(templateObject_2$w || (templateObject_2$w = __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) {
|
|
8460
8460
|
var color = _a.color;
|
|
8461
8461
|
return color ? theme.colors[color].light : "";
|
|
8462
8462
|
});
|
|
8463
|
-
var Content = styled__default["default"].div(templateObject_3$
|
|
8464
|
-
var templateObject_1$B, templateObject_2$
|
|
8463
|
+
var Content = styled__default["default"].div(templateObject_3$d || (templateObject_3$d = __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"])));
|
|
8464
|
+
var templateObject_1$B, templateObject_2$w, templateObject_3$d;
|
|
8465
8465
|
|
|
8466
8466
|
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 })] }))); };
|
|
8467
8467
|
|
|
@@ -14711,13 +14711,13 @@ htmlReactParser.ProcessingInstruction;
|
|
|
14711
14711
|
htmlReactParser.Text;
|
|
14712
14712
|
|
|
14713
14713
|
var Fieldset$1 = styled__default["default"].fieldset(templateObject_1$A || (templateObject_1$A = __makeTemplateObject$1(["\n border: 0;\n margin: 0;\n padding: 0;\n"], ["\n border: 0;\n margin: 0;\n padding: 0;\n"])));
|
|
14714
|
-
var CheckboxContainer = styled__default["default"].div(templateObject_2$
|
|
14715
|
-
var CheckboxWrapper = styled__default["default"].div(templateObject_3$
|
|
14714
|
+
var CheckboxContainer = styled__default["default"].div(templateObject_2$v || (templateObject_2$v = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
|
|
14715
|
+
var CheckboxWrapper = styled__default["default"].div(templateObject_3$c || (templateObject_3$c = __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"])));
|
|
14716
14716
|
var Label$b = styled__default["default"](StyledParagraph)(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject$1(["\n font-weight: ", ";\n color: ", ";\n display: flex;\n flex-wrap: wrap;\n gap: 0 6px;\n align-items: center;\n cursor: pointer;\n\n a {\n color: ", ";\n }\n"], ["\n font-weight: ", ";\n color: ", ";\n display: flex;\n flex-wrap: wrap;\n gap: 0 6px;\n align-items: center;\n cursor: pointer;\n\n a {\n color: ", ";\n }\n"])), function (_a) {
|
|
14717
14717
|
var weight = _a.weight;
|
|
14718
14718
|
return weight || 500;
|
|
14719
14719
|
}, theme.colors.darkGray.base, theme.colors.blue.base);
|
|
14720
|
-
var templateObject_1$A, templateObject_2$
|
|
14720
|
+
var templateObject_1$A, templateObject_2$v, templateObject_3$c, templateObject_4$5;
|
|
14721
14721
|
|
|
14722
14722
|
var Checkboxes = function (props) {
|
|
14723
14723
|
var _a = React$3.useState(props.defaultValue || []), values = _a[0], setValues = _a[1];
|
|
@@ -14740,12 +14740,12 @@ var Checkboxes = function (props) {
|
|
|
14740
14740
|
}) })] }));
|
|
14741
14741
|
};
|
|
14742
14742
|
|
|
14743
|
-
var Container$
|
|
14744
|
-
var Item = styled__default["default"].div(templateObject_2$
|
|
14743
|
+
var Container$k = styled__default["default"].div(templateObject_1$z || (templateObject_1$z = __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);
|
|
14744
|
+
var Item = styled__default["default"].div(templateObject_2$u || (templateObject_2$u = __makeTemplateObject$1(["\n padding: 10px 0;\n cursor: pointer;\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 5px;\n }\n\n p, > div:last-child {\n display: ", ";\n margin: 0;\n }\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n"], ["\n padding: 10px 0;\n cursor: pointer;\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 5px;\n }\n\n p, > div:last-child {\n display: ", ";\n margin: 0;\n }\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n"])), function (_a) {
|
|
14745
14745
|
var isOpen = _a.isOpen;
|
|
14746
14746
|
return (isOpen ? "" : "none");
|
|
14747
14747
|
}, theme.colors.lightGray.dark);
|
|
14748
|
-
var templateObject_1$z, templateObject_2$
|
|
14748
|
+
var templateObject_1$z, templateObject_2$u;
|
|
14749
14749
|
|
|
14750
14750
|
var Collapse = function (props) {
|
|
14751
14751
|
var _a = React$3.useState([]), openItems = _a[0], setOpenItems = _a[1];
|
|
@@ -14757,18 +14757,18 @@ var Collapse = function (props) {
|
|
|
14757
14757
|
setOpenItems(function (prevState) { return __spreadArray(__spreadArray([], prevState, true), [index], false); });
|
|
14758
14758
|
}
|
|
14759
14759
|
};
|
|
14760
|
-
return (jsxRuntime.jsx(Container$
|
|
14760
|
+
return (jsxRuntime.jsx(Container$k, __assign$2({}, props, { children: props.items.map(function (item, index) {
|
|
14761
14761
|
var isOpen = openItems.includes(index);
|
|
14762
14762
|
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", as: typeof item.content !== "string" ? "div" : undefined }, { children: item.content }))] }), "".concat(item.title, "-").concat(index)));
|
|
14763
14763
|
}) })));
|
|
14764
14764
|
};
|
|
14765
14765
|
|
|
14766
14766
|
var Wrapper$3 = styled__default["default"].div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject$1(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
14767
|
-
var Value = styled__default["default"].div(templateObject_2$
|
|
14767
|
+
var Value = styled__default["default"].div(templateObject_2$t || (templateObject_2$t = __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) {
|
|
14768
14768
|
var contrast = _a.contrast;
|
|
14769
14769
|
return contrast ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
14770
14770
|
}, theme.colors.darkGray.base);
|
|
14771
|
-
var templateObject_1$y, templateObject_2$
|
|
14771
|
+
var templateObject_1$y, templateObject_2$t;
|
|
14772
14772
|
|
|
14773
14773
|
var Countdown = function (_a) {
|
|
14774
14774
|
var till = _a.till, contrast = _a.contrast;
|
|
@@ -14795,20 +14795,20 @@ var Countdown = function (_a) {
|
|
|
14795
14795
|
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 })) }))] }));
|
|
14796
14796
|
};
|
|
14797
14797
|
|
|
14798
|
-
var Container$
|
|
14799
|
-
var Data = styled__default["default"].div(templateObject_2$
|
|
14800
|
-
var templateObject_1$x, templateObject_2$
|
|
14798
|
+
var Container$j = styled__default["default"].div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject$1(["\n width: fill-available;\n padding: 15px;\n border: 1px solid;\n border-radius: 6px;\n border-color: ", ";\n background-color: ", ";\n position: relative;\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n gap: 50px;\n margin-bottom: 15px;\n\n h6 {\n font-size: 14px;\n\n :hover {\n color: ", ";\n cursor: pointer;\n }\n }\n }\n"], ["\n width: fill-available;\n padding: 15px;\n border: 1px solid;\n border-radius: 6px;\n border-color: ", ";\n background-color: ", ";\n position: relative;\n\n > div:first-child {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n gap: 50px;\n margin-bottom: 15px;\n\n h6 {\n font-size: 14px;\n\n :hover {\n color: ", ";\n cursor: pointer;\n }\n }\n }\n"])), theme.colors.lightGray.darker, theme.colors.lightGray.light, theme.colors.blue.base);
|
|
14799
|
+
var Data = styled__default["default"].div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject$1(["\n > div {\n width: 100%;\n display: flex;\n align-items: end;\n gap: 10px;\n\n > p {\n width: 50%;\n }\n }\n"], ["\n > div {\n width: 100%;\n display: flex;\n align-items: end;\n gap: 10px;\n\n > p {\n width: 50%;\n }\n }\n"])));
|
|
14800
|
+
var templateObject_1$x, templateObject_2$s;
|
|
14801
14801
|
|
|
14802
14802
|
var DataSummary = function (_a) {
|
|
14803
14803
|
var title = _a.title, data = _a.data, onEdit = _a.onEdit, locale = _a.locale;
|
|
14804
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs(Container$
|
|
14804
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs(Container$j, { children: [jsxRuntime.jsxs("div", { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h5" }, { children: title })), onEdit && (jsxRuntime.jsx("div", __assign$2({ onClick: onEdit }, { children: jsxRuntime.jsx(Heading, __assign$2({ type: "h6", color: "gray" }, { children: translations[locale]["Edit"] })) })))] }), jsxRuntime.jsx(Data, { children: data === null || data === void 0 ? void 0 : data.map(function (item, index) {
|
|
14805
14805
|
return item instanceof Object ? (jsxRuntime.jsxs("div", { children: [jsxRuntime.jsxs(Paragraph, __assign$2({ weight: "regular" }, { children: [item.label, ":"] })), jsxRuntime.jsx(Paragraph, __assign$2({ weight: "regular" }, { children: item.value }))] }, "".concat(item.label, "-").concat(item.value, "-").concat(index))) : (jsxRuntime.jsx(Paragraph, __assign$2({ weight: "regular" }, { children: item }), "".concat(item, "-").concat(index)));
|
|
14806
14806
|
}) })] }) }));
|
|
14807
14807
|
};
|
|
14808
14808
|
|
|
14809
|
-
var Container$
|
|
14810
|
-
var Label$a = styled__default["default"](StyledParagraph)(templateObject_2$
|
|
14811
|
-
var templateObject_1$w, templateObject_2$
|
|
14809
|
+
var Container$i = styled__default["default"].div(templateObject_1$w || (templateObject_1$w = __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"])));
|
|
14810
|
+
var Label$a = styled__default["default"](StyledParagraph)(templateObject_2$r || (templateObject_2$r = __makeTemplateObject$1(["\n font-weight: 500;\n color: ", ";\n"], ["\n font-weight: 500;\n color: ", ";\n"])), theme.colors.darkGray.base);
|
|
14811
|
+
var templateObject_1$w, templateObject_2$r;
|
|
14812
14812
|
|
|
14813
14813
|
var DateInputField = function (props) {
|
|
14814
14814
|
var onChange = function (value) {
|
|
@@ -14819,7 +14819,7 @@ var DateInputField = function (props) {
|
|
|
14819
14819
|
if (props.onBlur)
|
|
14820
14820
|
props.onBlur(props.name);
|
|
14821
14821
|
};
|
|
14822
|
-
return (jsxRuntime.jsxs(Container$
|
|
14822
|
+
return (jsxRuntime.jsxs(Container$i, { children: [jsxRuntime.jsx(Label$a, __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 })] }));
|
|
14823
14823
|
};
|
|
14824
14824
|
|
|
14825
14825
|
var generateRandomString = function (length) {
|
|
@@ -14833,7 +14833,7 @@ var generateRandomString = function (length) {
|
|
|
14833
14833
|
};
|
|
14834
14834
|
|
|
14835
14835
|
var ButtonWrapper$1 = styled__default["default"].div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject$1(["\n > button {\n flex-direction: row-reverse;\n padding-right: 14px;\n }\n"], ["\n > button {\n flex-direction: row-reverse;\n padding-right: 14px;\n }\n"])));
|
|
14836
|
-
var Container$
|
|
14836
|
+
var Container$h = styled__default["default"].div(templateObject_2$q || (templateObject_2$q = __makeTemplateObject$1(["\n width: max-content;\n position: fixed;\n z-index: 9;\n opacity: ", ";\n top: ", ";\n left: ", ";\n background-color: ", ";\n border-radius: 6px;\n border: 1px solid ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 10%);\n pointer-events: ", ";\n"], ["\n width: max-content;\n position: fixed;\n z-index: 9;\n opacity: ", ";\n top: ", ";\n left: ", ";\n background-color: ", ";\n border-radius: 6px;\n border: 1px solid ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 10%);\n pointer-events: ", ";\n"])), function (_a) {
|
|
14837
14837
|
var isVisible = _a.isVisible;
|
|
14838
14838
|
return (isVisible ? "100%" : "0%");
|
|
14839
14839
|
}, function (_a) {
|
|
@@ -14842,15 +14842,15 @@ var Container$i = styled__default["default"].div(templateObject_2$r || (template
|
|
|
14842
14842
|
}, function (_a) {
|
|
14843
14843
|
var x = _a.x;
|
|
14844
14844
|
return (x ? "".concat(x, "px") : "");
|
|
14845
|
-
}, theme.colors.lightGray.light, theme.colors.lightGray.dark,
|
|
14845
|
+
}, theme.colors.lightGray.light, theme.colors.lightGray.dark, function (_a) {
|
|
14846
14846
|
var isVisible = _a.isVisible;
|
|
14847
14847
|
return (isVisible ? "all" : "none");
|
|
14848
14848
|
});
|
|
14849
|
-
var MenuItem = styled__default["default"].div(templateObject_3$
|
|
14850
|
-
var templateObject_1$v, templateObject_2$
|
|
14849
|
+
var MenuItem = styled__default["default"].div(templateObject_3$b || (templateObject_3$b = __makeTemplateObject$1(["\n padding: 10px 15px;\n display: flex;\n align-items: center;\n gap: 10px;\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n p {\n margin-top: 2px;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n p {\n color: ", ";\n }\n\n svg {\n fill: ", ";\n }\n }\n"], ["\n padding: 10px 15px;\n display: flex;\n align-items: center;\n gap: 10px;\n\n :not(:last-child) {\n border-bottom: 1px solid ", ";\n }\n\n p {\n margin-top: 2px;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n\n p {\n color: ", ";\n }\n\n svg {\n fill: ", ";\n }\n }\n"])), theme.colors.lightGray.dark, theme.colors.lightGray.base, theme.colors.blue.base, theme.colors.blue.base);
|
|
14850
|
+
var templateObject_1$v, templateObject_2$q, templateObject_3$b;
|
|
14851
14851
|
|
|
14852
14852
|
var DropdownButton = function (props) {
|
|
14853
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx("div", { children: jsxRuntime.jsx(Dropdown, __assign$2({}, props, { yOffset: props.yOffset || 10, trigger: ["click"] }, { children: jsxRuntime.jsx(ButtonWrapper$1, { children: jsxRuntime.jsx(Button, { label: props.label, color: props.color, size: props.size, disabled: props.disabled, icon: "chevronDown" }) }) })) }) }));
|
|
14853
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx("div", { children: jsxRuntime.jsx(Dropdown, __assign$2({}, props, { yOffset: props.yOffset || 10, trigger: ["click"] }, { children: jsxRuntime.jsx(ButtonWrapper$1, { children: jsxRuntime.jsx(Button$1, { label: props.label, color: props.color, size: props.size, disabled: props.disabled, icon: "chevronDown" }) }) })) }) }));
|
|
14854
14854
|
};
|
|
14855
14855
|
|
|
14856
14856
|
var Dropdown = function (_a) {
|
|
@@ -14911,9 +14911,12 @@ var Dropdown = function (_a) {
|
|
|
14911
14911
|
return React__default["default"].cloneElement(child, props_1);
|
|
14912
14912
|
}
|
|
14913
14913
|
});
|
|
14914
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [children, jsxRuntime.jsx(Container$
|
|
14914
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [children, jsxRuntime.jsx(Container$h, __assign$2({}, position, { isVisible: isVisible && menu.length > 0, ref: dropwdownRef, onMouseLeave: function () { return setIsVisible(false); } }, { children: menu.map(function (_a, index) {
|
|
14915
14915
|
var label = _a.label, icon = _a.icon, onClick = _a.onClick;
|
|
14916
|
-
return (jsxRuntime.
|
|
14916
|
+
return (jsxRuntime.jsx(MenuItem, __assign$2({ onClick: function () {
|
|
14917
|
+
onClick();
|
|
14918
|
+
setIsVisible(false);
|
|
14919
|
+
} }, { children: typeof label === "string" ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [icon && jsxRuntime.jsx(Icon, { type: icon, size: "tiny" }), jsxRuntime.jsx(Paragraph, __assign$2({ size: "small", weight: "regular", color: "darkGray" }, { children: label }))] })) : (label) }), "".concat(label, "-").concat(index)));
|
|
14917
14920
|
}) }))] }));
|
|
14918
14921
|
};
|
|
14919
14922
|
Dropdown.Button = DropdownButton;
|
|
@@ -17435,8 +17438,8 @@ function reducer$1(state, action) {
|
|
|
17435
17438
|
|
|
17436
17439
|
function noop$3() {}
|
|
17437
17440
|
|
|
17438
|
-
var Container$
|
|
17439
|
-
var DropZone = styled__default["default"].div(templateObject_2$
|
|
17441
|
+
var Container$g = styled__default["default"].div(templateObject_1$u || (templateObject_1$u = __makeTemplateObject$1(["\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 15px;\n"], ["\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 15px;\n"])));
|
|
17442
|
+
var DropZone = styled__default["default"].div(templateObject_2$p || (templateObject_2$p = __makeTemplateObject$1(["\n min-height: 250px;\n border-width: 2px;\n border-style: dashed;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n background-color: ", ";\n padding: 25px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"], ["\n min-height: 250px;\n border-width: 2px;\n border-style: dashed;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n background-color: ", ";\n padding: 25px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"])), function (_a) {
|
|
17440
17443
|
_a.isDragActive; var isDragAccept = _a.isDragAccept, isDragReject = _a.isDragReject;
|
|
17441
17444
|
// if (isDragActive) return theme.colors.blue.base;
|
|
17442
17445
|
if (isDragAccept)
|
|
@@ -17455,8 +17458,8 @@ var DropZone = styled__default["default"].div(templateObject_2$q || (templateObj
|
|
|
17455
17458
|
else
|
|
17456
17459
|
return theme.colors.lightGray.base;
|
|
17457
17460
|
});
|
|
17458
|
-
var FileList = styled__default["default"].div(templateObject_3$
|
|
17459
|
-
var templateObject_1$u, templateObject_2$
|
|
17461
|
+
var FileList = styled__default["default"].div(templateObject_3$a || (templateObject_3$a = __makeTemplateObject$1(["\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 10px;\n"], ["\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
17462
|
+
var templateObject_1$u, templateObject_2$p, templateObject_3$a;
|
|
17460
17463
|
|
|
17461
17464
|
var FileUpload = function (_a) {
|
|
17462
17465
|
var locale = _a.locale, accept = _a.accept, onDrop = _a.onDrop, files = _a.files;
|
|
@@ -17469,11 +17472,11 @@ var FileUpload = function (_a) {
|
|
|
17469
17472
|
// Max number of files: 1
|
|
17470
17473
|
maxFiles: 1,
|
|
17471
17474
|
}), getRootProps = _b.getRootProps, getInputProps = _b.getInputProps, isDragActive = _b.isDragActive, isDragAccept = _b.isDragAccept, isDragReject = _b.isDragReject;
|
|
17472
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs(Container$
|
|
17475
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs(Container$g, { children: [jsxRuntime.jsxs(DropZone, __assign$2({}, getRootProps({
|
|
17473
17476
|
isDragActive: isDragActive,
|
|
17474
17477
|
isDragAccept: isDragAccept,
|
|
17475
17478
|
isDragReject: isDragReject,
|
|
17476
|
-
}), { children: [jsxRuntime.jsx("input", __assign$2({}, getInputProps())), jsxRuntime.jsx(Icon, { type: "fileArrow", size: "large" }), jsxRuntime.jsx(Spacer, { vertical: 15 }), !isDragActive && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: translations[locale]["Drag file(s) here..."] })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Paragraph, { children: translations[locale]["or"] }), jsxRuntime.jsx(Spacer, { vertical: 10 }), jsxRuntime.jsx(Button, { label: translations[locale]["Select file(s)"], size: "small" })] })), isDragActive && !isDragReject && (jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: translations[locale]["Upload file(s)..."] }))), isDragReject && (jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: translations[locale]["File type not allowed"] })))] })), files && files.length > 0 && (jsxRuntime.jsx(FileList, { children: files.map(function (file, index) { return (jsxRuntime.jsx(Alert, { type: "success", message: file.name }, "".concat(file.name, "-").concat(index))); }) }))] }) }));
|
|
17479
|
+
}), { children: [jsxRuntime.jsx("input", __assign$2({}, getInputProps())), jsxRuntime.jsx(Icon, { type: "fileArrow", size: "large" }), jsxRuntime.jsx(Spacer, { vertical: 15 }), !isDragActive && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: translations[locale]["Drag file(s) here..."] })), jsxRuntime.jsx(Spacer, { vertical: 5 }), jsxRuntime.jsx(Paragraph, { children: translations[locale]["or"] }), jsxRuntime.jsx(Spacer, { vertical: 10 }), jsxRuntime.jsx(Button$1, { label: translations[locale]["Select file(s)"], size: "small" })] })), isDragActive && !isDragReject && (jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: translations[locale]["Upload file(s)..."] }))), isDragReject && (jsxRuntime.jsx(Heading, __assign$2({ type: "h6" }, { children: translations[locale]["File type not allowed"] })))] })), files && files.length > 0 && (jsxRuntime.jsx(FileList, { children: files.map(function (file, index) { return (jsxRuntime.jsx(Alert, { type: "success", message: file.name }, "".concat(file.name, "-").concat(index))); }) }))] }) }));
|
|
17477
17480
|
};
|
|
17478
17481
|
|
|
17479
17482
|
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 pointer-events: none;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\n }\n"], ["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n > div:first-child {\n margin-top: -2px;\n pointer-events: none;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\n }\n"])), function (_a) {
|
|
@@ -17501,9 +17504,9 @@ var IconButton = function (props) {
|
|
|
17501
17504
|
return (jsxRuntime.jsx(StyledIconButton, __assign$2({}, props, { children: jsxRuntime.jsx(Icon, { type: props.icon, size: props.size === "small" ? "tiny" : "small", color: props.color === "white" ? "gray" : "white" }) })));
|
|
17502
17505
|
};
|
|
17503
17506
|
|
|
17504
|
-
var Container$
|
|
17505
|
-
var Label$9 = styled__default["default"](StyledParagraph)(templateObject_2$
|
|
17506
|
-
var templateObject_1$s, templateObject_2$
|
|
17507
|
+
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"])));
|
|
17508
|
+
var Label$9 = 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);
|
|
17509
|
+
var templateObject_1$s, templateObject_2$o;
|
|
17507
17510
|
|
|
17508
17511
|
var InputField = function (props) {
|
|
17509
17512
|
var onChange = function (value) {
|
|
@@ -17514,10 +17517,10 @@ var InputField = function (props) {
|
|
|
17514
17517
|
if (props.onBlur)
|
|
17515
17518
|
props.onBlur(props.name);
|
|
17516
17519
|
};
|
|
17517
|
-
return (jsxRuntime.jsxs(Container$
|
|
17520
|
+
return (jsxRuntime.jsxs(Container$f, { children: [jsxRuntime.jsx(Label$9, __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))); })] })))] }));
|
|
17518
17521
|
};
|
|
17519
17522
|
|
|
17520
|
-
var Container$
|
|
17523
|
+
var Container$e = styled__default["default"].div(templateObject_1$r || (templateObject_1$r = __makeTemplateObject$1(["\n min-width: 74px;\n max-width: ", ";\n min-height: 74px;\n max-height: 74px;\n background-color: ", ";\n box-sizing: border-box;\n\n border: 4px solid;\n border-radius: 6px;\n border-color: ", ";\n\n padding: 8px 24px;\n margin-right: 6px;\n margin-left: 6px;\n margin-bottom: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n position: relative;\n text-transform: uppercase;\n\n h1 {\n color: ", ";\n }\n\n > svg {\n fill: ", ";\n }\n"], ["\n min-width: 74px;\n max-width: ", ";\n min-height: 74px;\n max-height: 74px;\n background-color: ", ";\n box-sizing: border-box;\n\n border: 4px solid;\n border-radius: 6px;\n border-color: ", ";\n\n padding: 8px 24px;\n margin-right: 6px;\n margin-left: 6px;\n margin-bottom: ", ";\n\n display: flex;\n justify-content: center;\n align-items: center;\n\n position: relative;\n text-transform: uppercase;\n\n h1 {\n color: ", ";\n }\n\n > svg {\n fill: ", ";\n }\n"])), function (_a) {
|
|
17521
17524
|
var char = _a.char;
|
|
17522
17525
|
return (char.length === 1 ? "74px" : "");
|
|
17523
17526
|
}, function (_a) {
|
|
@@ -17564,10 +17567,10 @@ var Container$f = styled__default["default"].div(templateObject_1$r || (template
|
|
|
17564
17567
|
return theme.colors.darkGray.light;
|
|
17565
17568
|
}
|
|
17566
17569
|
});
|
|
17567
|
-
var CheckIconWrapper = styled__default["default"].div(templateObject_2$
|
|
17568
|
-
var templateObject_1$r, templateObject_2$
|
|
17570
|
+
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"])));
|
|
17571
|
+
var templateObject_1$r, templateObject_2$n;
|
|
17569
17572
|
|
|
17570
|
-
var Key$1 = function (props) { return (jsxRuntime.jsxs(Container$
|
|
17573
|
+
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: {
|
|
17571
17574
|
marginTop: "13px",
|
|
17572
17575
|
transform: "scale(2)",
|
|
17573
17576
|
} }, { 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 })))] }))); };
|
|
@@ -17579,8 +17582,8 @@ var Wrapper$2 = styled__default["default"].a(templateObject_1$q || (templateObje
|
|
|
17579
17582
|
var chevron = _a.chevron;
|
|
17580
17583
|
return (chevron === "right" ? "4px" : "");
|
|
17581
17584
|
});
|
|
17582
|
-
var StyledLink = styled__default["default"](StyledParagraph)(templateObject_2$
|
|
17583
|
-
var templateObject_1$q, templateObject_2$
|
|
17585
|
+
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);
|
|
17586
|
+
var templateObject_1$q, templateObject_2$m;
|
|
17584
17587
|
|
|
17585
17588
|
var Link = function (props) {
|
|
17586
17589
|
var onClick = function (e) {
|
|
@@ -17592,13 +17595,13 @@ var Link = function (props) {
|
|
|
17592
17595
|
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" }))] })));
|
|
17593
17596
|
};
|
|
17594
17597
|
|
|
17595
|
-
var Container$
|
|
17598
|
+
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) {
|
|
17596
17599
|
var text = _a.text;
|
|
17597
17600
|
return (text ? "20px" : "");
|
|
17598
17601
|
});
|
|
17599
17602
|
var templateObject_1$p;
|
|
17600
17603
|
|
|
17601
|
-
var Loading = function (props) { return (jsxRuntime.jsxs(Container$
|
|
17604
|
+
var Loading = function (props) { return (jsxRuntime.jsxs(Container$d, __assign$2({}, props, { children: [jsxRuntime.jsx(_default$1, { 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 }))] }))] }))); };
|
|
17602
17605
|
|
|
17603
17606
|
var mappers = {};
|
|
17604
17607
|
|
|
@@ -17717,54 +17720,21 @@ __exportStar(getPricing$1, exports);
|
|
|
17717
17720
|
|
|
17718
17721
|
}(mappers));
|
|
17719
17722
|
|
|
17720
|
-
var
|
|
17721
|
-
|
|
17722
|
-
if (borderless)
|
|
17723
|
-
return "transparent";
|
|
17724
|
-
return theme.colors.lightGray.light;
|
|
17725
|
-
}, function (_a) {
|
|
17726
|
-
var borderless = _a.borderless;
|
|
17727
|
-
return borderless ? "" : "1px solid ".concat(theme.colors.lightGray.dark);
|
|
17728
|
-
}, function (_a) {
|
|
17729
|
-
var borderless = _a.borderless;
|
|
17730
|
-
return borderless ? "" : "0px 2px 0px rgb(0 0 0 / 10%)";
|
|
17731
|
-
}, function (_a) {
|
|
17732
|
-
var reverse = _a.reverse;
|
|
17733
|
-
return reverse ? "column-reverse" : "column";
|
|
17734
|
-
}, function (_a) {
|
|
17735
|
-
var open = _a.open;
|
|
17736
|
-
return (open ? "rotate(180deg)" : "");
|
|
17737
|
-
}, theme.colors.lightGray.base);
|
|
17738
|
-
var LocalesList = styled__default["default"].ul(templateObject_2$m || (templateObject_2$m = __makeTemplateObject$1(["\n list-style: none;\n margin: 0;\n padding: 0;\n\n // background-color: ", ";\n // border: 1px solid ", ";\n // border-radius: 0 0 6px 6px;\n // box-shadow: 0px 2px 0px rgb(0 0 0 / 10%);\n\n // overflow: hidden;\n"], ["\n list-style: none;\n margin: 0;\n padding: 0;\n\n // background-color: ", ";\n // border: 1px solid ", ";\n // border-radius: 0 0 6px 6px;\n // box-shadow: 0px 2px 0px rgb(0 0 0 / 10%);\n\n // overflow: hidden;\n"])), theme.colors.lightGray.light, theme.colors.lightGray.dark);
|
|
17739
|
-
var LocalesListItem = styled__default["default"].li(templateObject_3$a || (templateObject_3$a = __makeTemplateObject$1(["\n // min-width: max-content;\n\n display: ", ";\n align-items: center;\n gap: 10px;\n\n // background-color: ", ";\n\n padding: 13px 15px;\n cursor: pointer;\n\n :hover {\n background-color: ", ";\n }\n"], ["\n // min-width: max-content;\n\n display: ", ";\n align-items: center;\n gap: 10px;\n\n // background-color: ", ";\n\n padding: 13px 15px;\n cursor: pointer;\n\n :hover {\n background-color: ", ";\n }\n"])), function (_a) {
|
|
17740
|
-
var hidden = _a.hidden;
|
|
17741
|
-
return (hidden ? "none" : "flex");
|
|
17742
|
-
}, theme.colors.lightGray.light, theme.colors.lightGray.base);
|
|
17743
|
-
var templateObject_1$o, templateObject_2$m, templateObject_3$a;
|
|
17723
|
+
var Button = styled__default["default"].button(templateObject_1$o || (templateObject_1$o = __makeTemplateObject$1(["\n all: unset;\n height: 46px;\n box-sizing: border-box;\n padding: 10px 15px;\n background-color: ", ";\n border-radius: 6px;\n border: 1px solid ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 10%);\n\n display: flex;\n align-items: center;\n gap: 10px;\n\n svg {\n pointer-events: none;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n }\n"], ["\n all: unset;\n height: 46px;\n box-sizing: border-box;\n padding: 10px 15px;\n background-color: ", ";\n border-radius: 6px;\n border: 1px solid ", ";\n box-shadow: 0px 2px 0px rgb(0 0 0 / 10%);\n\n display: flex;\n align-items: center;\n gap: 10px;\n\n svg {\n pointer-events: none;\n }\n\n :hover {\n cursor: pointer;\n background-color: ", ";\n }\n"])), theme.colors.lightGray.light, theme.colors.lightGray.dark, theme.colors.lightGray.base);
|
|
17724
|
+
var templateObject_1$o;
|
|
17744
17725
|
|
|
17745
17726
|
var LocaleSelect = function (props) {
|
|
17746
|
-
var containerRef = React$3.useRef(null);
|
|
17747
17727
|
var _a = React$3.useState(props.defaultValue), selectedLocale = _a[0], setSelectedLocale = _a[1];
|
|
17748
|
-
var _b = React$3.useState(false), open = _b[0], setOpen = _b[1];
|
|
17749
|
-
var handleClickOutside = React$3.useCallback(function (event) {
|
|
17750
|
-
return open &&
|
|
17751
|
-
containerRef.current &&
|
|
17752
|
-
!containerRef.current.contains(event.target)
|
|
17753
|
-
? setOpen(false)
|
|
17754
|
-
: null;
|
|
17755
|
-
}, [open, containerRef]);
|
|
17756
|
-
React$3.useEffect(function () {
|
|
17757
|
-
document.addEventListener("mousedown", handleClickOutside);
|
|
17758
|
-
return function () {
|
|
17759
|
-
document.removeEventListener("mousedown", handleClickOutside);
|
|
17760
|
-
};
|
|
17761
|
-
}, [handleClickOutside]);
|
|
17762
17728
|
var onSelectLocale = function (locale) {
|
|
17763
17729
|
setSelectedLocale(locale);
|
|
17764
17730
|
props.onChange(locale);
|
|
17765
|
-
setOpen(false);
|
|
17766
17731
|
};
|
|
17767
|
-
return (jsxRuntime.
|
|
17732
|
+
return (jsxRuntime.jsx(Dropdown, __assign$2({ trigger: ["click"], menu: props.locales
|
|
17733
|
+
.filter(function (locale) { return locale !== selectedLocale; })
|
|
17734
|
+
.map(function (locale) { return ({
|
|
17735
|
+
onClick: function () { return onSelectLocale(locale); },
|
|
17736
|
+
label: (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Flag, { locale: locale }), !props.iconOnly && (jsxRuntime.jsx(Heading, __assign$2({ type: "h6", as: "span" }, { children: mappers.getNativeLanguageByLocale(locale) })))] })),
|
|
17737
|
+
}); }) }, { children: jsxRuntime.jsxs(Button, { children: [jsxRuntime.jsx(Flag, { locale: selectedLocale }), !props.iconOnly && (jsxRuntime.jsx(Heading, __assign$2({ type: "h6", as: "span" }, { children: mappers.getNativeLanguageByLocale(selectedLocale) })))] }) })));
|
|
17768
17738
|
};
|
|
17769
17739
|
|
|
17770
17740
|
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"])));
|
|
@@ -17782,7 +17752,7 @@ var templateObject_1$m, templateObject_2$l;
|
|
|
17782
17752
|
var Notification = function (props) {
|
|
17783
17753
|
if (!props.isVisible)
|
|
17784
17754
|
return null;
|
|
17785
|
-
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) }))); }) }))] })));
|
|
17755
|
+
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$1, __assign$2({}, button, { size: "small", color: index + 1 === props.buttons.length ? "blue" : "white", key: "button-".concat(index) }))); }) }))] })));
|
|
17786
17756
|
};
|
|
17787
17757
|
|
|
17788
17758
|
var Container$c = 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"])));
|
|
@@ -48463,7 +48433,7 @@ var Form = React$3.forwardRef(function (props, ref) {
|
|
|
48463
48433
|
return (React$3.createElement(WithValidation, __assign$2({}, feedback[field.name], { key: "field-".concat(index) }),
|
|
48464
48434
|
jsxRuntime.jsx(RangeField, __assign$2({}, field, { onChange: onChangeFormField, onBlur: onBlurFormField }))));
|
|
48465
48435
|
}
|
|
48466
|
-
}) })), props.button && (jsxRuntime.jsx(ButtonWrapper, { children: jsxRuntime.jsx(Button, __assign$2({}, props.button, { onClick: onSubmit, type: "button" })) }))] }));
|
|
48436
|
+
}) })), props.button && (jsxRuntime.jsx(ButtonWrapper, { children: jsxRuntime.jsx(Button$1, __assign$2({}, props.button, { onClick: onSubmit, type: "button" })) }))] }));
|
|
48467
48437
|
});
|
|
48468
48438
|
|
|
48469
48439
|
var Container$3 = styled__default["default"].div(templateObject_1$4 || (templateObject_1$4 = __makeTemplateObject$1(["\n min-width: 720px;\n width: 100%;\n border-radius: 10px;\n padding: 15px;\n box-sizing: border-box;\n border: 1px solid ", ";\n background-color: ", ";\n box-shadow: 0 4px 0 ", ";\n\n display: flex;\n flex-direction: column;\n gap: 10px;\n"], ["\n min-width: 720px;\n width: 100%;\n border-radius: 10px;\n padding: 15px;\n box-sizing: border-box;\n border: 1px solid ", ";\n background-color: ", ";\n box-shadow: 0 4px 0 ", ";\n\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])), theme.colors.lightGray.darker, theme.colors.lightGray.base, theme.colors.lightGray.darker);
|
|
@@ -48728,7 +48698,7 @@ var Modal = function (props) {
|
|
|
48728
48698
|
}, [isOpen]);
|
|
48729
48699
|
if (!isOpen)
|
|
48730
48700
|
return null;
|
|
48731
|
-
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" }))] }))] }) })) }));
|
|
48701
|
+
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$1, { label: props.closeButton.label, onClick: props.closeButton.onClick, color: "white", size: "small" })), props.okButton && (jsxRuntime.jsx(Button$1, { label: props.okButton.label, onClick: props.okButton.onClick, size: "small" }))] }))] }) })) }));
|
|
48732
48702
|
};
|
|
48733
48703
|
|
|
48734
48704
|
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) {
|
|
@@ -48903,7 +48873,7 @@ var Transfer = function (props) {
|
|
|
48903
48873
|
};
|
|
48904
48874
|
|
|
48905
48875
|
exports.Alert = Alert;
|
|
48906
|
-
exports.Button = Button;
|
|
48876
|
+
exports.Button = Button$1;
|
|
48907
48877
|
exports.Card = Card;
|
|
48908
48878
|
exports.Chart = Chart;
|
|
48909
48879
|
exports.Checkbox = Checkbox;
|