@typeolymp/ui-components 1.17.0 → 1.17.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/index.es.js
CHANGED
|
@@ -3438,7 +3438,7 @@ var Loader = /** @class */ (function (_super) {
|
|
|
3438
3438
|
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
3439
3439
|
_this.style = function (i) {
|
|
3440
3440
|
var _a = _this.props, color = _a.color, size = _a.size, margin = _a.margin, speedMultiplier = _a.speedMultiplier;
|
|
3441
|
-
return react_1.css(templateObject_2$
|
|
3441
|
+
return react_1.css(templateObject_2$A || (templateObject_2$A = __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");
|
|
3442
3442
|
};
|
|
3443
3443
|
return _this;
|
|
3444
3444
|
}
|
|
@@ -3453,7 +3453,7 @@ var Loader = /** @class */ (function (_super) {
|
|
|
3453
3453
|
return Loader;
|
|
3454
3454
|
}(React$2.PureComponent));
|
|
3455
3455
|
var _default$1 = BeatLoader.default = Loader;
|
|
3456
|
-
var templateObject_1$U, templateObject_2$
|
|
3456
|
+
var templateObject_1$U, templateObject_2$A;
|
|
3457
3457
|
|
|
3458
3458
|
var StyledButton = styled.button(templateObject_1$T || (templateObject_1$T = __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) {
|
|
3459
3459
|
var fluid = _a.fluid;
|
|
@@ -3509,11 +3509,11 @@ var StyledButton = styled.button(templateObject_1$T || (templateObject_1$T = __m
|
|
|
3509
3509
|
? theme.button.medium.heightActive
|
|
3510
3510
|
: theme.button[size].heightActive;
|
|
3511
3511
|
});
|
|
3512
|
-
var DisabledButton = styled(StyledButton)(templateObject_2$
|
|
3512
|
+
var DisabledButton = styled(StyledButton)(templateObject_2$z || (templateObject_2$z = __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) {
|
|
3513
3513
|
var size = _a.size;
|
|
3514
3514
|
return !size ? theme.button.medium.height : theme.button[size].height;
|
|
3515
3515
|
});
|
|
3516
|
-
var GhostButton = styled(StyledButton)(templateObject_3$
|
|
3516
|
+
var GhostButton = styled(StyledButton)(templateObject_3$d || (templateObject_3$d = __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) {
|
|
3517
3517
|
var size = _a.size;
|
|
3518
3518
|
return !size
|
|
3519
3519
|
? "calc(".concat(theme.button.medium.height, " - 2.5px)")
|
|
@@ -3536,7 +3536,7 @@ var LoaderWrapper = styled.div(templateObject_4$8 || (templateObject_4$8 = __mak
|
|
|
3536
3536
|
var size = _a.size;
|
|
3537
3537
|
return (size === "small" ? "3px" : "");
|
|
3538
3538
|
});
|
|
3539
|
-
var templateObject_1$T, templateObject_2$
|
|
3539
|
+
var templateObject_1$T, templateObject_2$z, templateObject_3$d, templateObject_4$8;
|
|
3540
3540
|
|
|
3541
3541
|
var Button = forwardRef(function (_a, ref) {
|
|
3542
3542
|
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"]);
|
|
@@ -4246,14 +4246,14 @@ var StyledParagraph = styled.p(templateObject_1$N || (templateObject_1$N = __mak
|
|
|
4246
4246
|
var templateObject_1$N;
|
|
4247
4247
|
|
|
4248
4248
|
var Container$n = styled.div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject$1(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
4249
|
-
var InputIconWrapper = styled.div(templateObject_2$
|
|
4249
|
+
var InputIconWrapper = styled.div(templateObject_2$y || (templateObject_2$y = __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) {
|
|
4250
4250
|
var isChanged = _a.isChanged;
|
|
4251
4251
|
return !isChanged ? theme.colors.lightGray.darker : "";
|
|
4252
4252
|
}, function (_a) {
|
|
4253
4253
|
var disabled = _a.disabled;
|
|
4254
4254
|
return (disabled ? "not-allowed" : "pointer");
|
|
4255
4255
|
});
|
|
4256
|
-
var StyledInput = styled.input(templateObject_3$
|
|
4256
|
+
var StyledInput = styled.input(templateObject_3$c || (templateObject_3$c = __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) {
|
|
4257
4257
|
var disabled = _a.disabled;
|
|
4258
4258
|
return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
4259
4259
|
}, function (_a) {
|
|
@@ -4272,7 +4272,7 @@ var Helper = styled(StyledParagraph)(templateObject_6$3 || (templateObject_6$3 =
|
|
|
4272
4272
|
var isOk = _a.isOk;
|
|
4273
4273
|
return isOk ? theme.colors.green.base : theme.colors.darkGray.light;
|
|
4274
4274
|
}, fadeIn);
|
|
4275
|
-
var templateObject_1$M, templateObject_2$
|
|
4275
|
+
var templateObject_1$M, templateObject_2$y, templateObject_3$c, templateObject_4$7, templateObject_5$3, templateObject_6$3;
|
|
4276
4276
|
|
|
4277
4277
|
var expressions = {};
|
|
4278
4278
|
|
|
@@ -4773,7 +4773,7 @@ var Wrapper$6 = styled.div(templateObject_1$K || (templateObject_1$K = __makeTem
|
|
|
4773
4773
|
var disabled = _a.disabled;
|
|
4774
4774
|
return (disabled ? "49.5px" : "");
|
|
4775
4775
|
});
|
|
4776
|
-
var StyledInputNumber = styled.input(templateObject_2$
|
|
4776
|
+
var StyledInputNumber = styled.input(templateObject_2$x || (templateObject_2$x = __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) {
|
|
4777
4777
|
var disabled = _a.disabled;
|
|
4778
4778
|
return disabled ? theme.colors.lightGray.base : theme.colors.lightGray.light;
|
|
4779
4779
|
}, function (_a) {
|
|
@@ -4786,7 +4786,7 @@ var StyledInputNumber = styled.input(templateObject_2$w || (templateObject_2$w =
|
|
|
4786
4786
|
var disabled = _a.disabled;
|
|
4787
4787
|
return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
|
|
4788
4788
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
4789
|
-
var templateObject_1$K, templateObject_2$
|
|
4789
|
+
var templateObject_1$K, templateObject_2$x;
|
|
4790
4790
|
|
|
4791
4791
|
var Number$1 = function (props) {
|
|
4792
4792
|
var inputRef = useRef(null);
|
|
@@ -4928,7 +4928,7 @@ var Wrapper$5 = styled.div(templateObject_1$H || (templateObject_1$H = __makeTem
|
|
|
4928
4928
|
var disabled = _a.disabled;
|
|
4929
4929
|
return (disabled ? "not-allowed" : "pointer");
|
|
4930
4930
|
});
|
|
4931
|
-
var StyledSelect = styled.select(templateObject_2$
|
|
4931
|
+
var StyledSelect = styled.select(templateObject_2$w || (templateObject_2$w = __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) {
|
|
4932
4932
|
var disabled = _a.disabled;
|
|
4933
4933
|
return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
4934
4934
|
}, function (_a) {
|
|
@@ -4941,7 +4941,7 @@ var StyledSelect = styled.select(templateObject_2$v || (templateObject_2$v = __m
|
|
|
4941
4941
|
var isChanged = _a.isChanged;
|
|
4942
4942
|
return isChanged ? theme.colors.darkGray.base : theme.colors.lightGray.darker;
|
|
4943
4943
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
4944
|
-
var templateObject_1$H, templateObject_2$
|
|
4944
|
+
var templateObject_1$H, templateObject_2$w;
|
|
4945
4945
|
|
|
4946
4946
|
var Select = function (props) {
|
|
4947
4947
|
var _a;
|
|
@@ -5142,12 +5142,12 @@ var StyledCard = styled.div(templateObject_1$A || (templateObject_1$A = __makeTe
|
|
|
5142
5142
|
}, ";\n\n > div:first-child {\n width: 175%;\n padding-bottom: 175%;\n top: -25%;\n right: -25%;\n }\n }")
|
|
5143
5143
|
: "";
|
|
5144
5144
|
});
|
|
5145
|
-
var Ellipse = styled.div(templateObject_2$
|
|
5145
|
+
var Ellipse = styled.div(templateObject_2$v || (templateObject_2$v = __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) {
|
|
5146
5146
|
var color = _a.color;
|
|
5147
5147
|
return color ? theme.colors[color].light : "";
|
|
5148
5148
|
});
|
|
5149
|
-
var Content = styled.div(templateObject_3$
|
|
5150
|
-
var templateObject_1$A, templateObject_2$
|
|
5149
|
+
var Content = styled.div(templateObject_3$b || (templateObject_3$b = __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"])));
|
|
5150
|
+
var templateObject_1$A, templateObject_2$v, templateObject_3$b;
|
|
5151
5151
|
|
|
5152
5152
|
var Card = function (props) { return (jsxs(StyledCard, __assign$2({}, props, { children: [props.ellipse && jsx$1(Ellipse, { color: props.ellipse }), jsx$1(Content, { children: props.children })] }))); };
|
|
5153
5153
|
|
|
@@ -11397,13 +11397,13 @@ htmlReactParser.ProcessingInstruction;
|
|
|
11397
11397
|
htmlReactParser.Text;
|
|
11398
11398
|
|
|
11399
11399
|
var Fieldset$1 = styled.fieldset(templateObject_1$z || (templateObject_1$z = __makeTemplateObject$1(["\n border: 0;\n margin: 0;\n padding: 0;\n"], ["\n border: 0;\n margin: 0;\n padding: 0;\n"])));
|
|
11400
|
-
var CheckboxContainer = styled.div(templateObject_2$
|
|
11401
|
-
var CheckboxWrapper = styled.div(templateObject_3$
|
|
11400
|
+
var CheckboxContainer = styled.div(templateObject_2$u || (templateObject_2$u = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
|
|
11401
|
+
var CheckboxWrapper = styled.div(templateObject_3$a || (templateObject_3$a = __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"])));
|
|
11402
11402
|
var Label$9 = styled(StyledParagraph)(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject$1(["\n font-weight: ", ";\n color: ", ";\n display: flex;\n flex-wrap: wrap;\n gap: 0 6px;\n align-items: center;\n cursor: pointer;\n\n a {\n color: ", ";\n }\n"], ["\n font-weight: ", ";\n color: ", ";\n display: flex;\n flex-wrap: wrap;\n gap: 0 6px;\n align-items: center;\n cursor: pointer;\n\n a {\n color: ", ";\n }\n"])), function (_a) {
|
|
11403
11403
|
var weight = _a.weight;
|
|
11404
11404
|
return weight || 500;
|
|
11405
11405
|
}, theme.colors.darkGray.base, theme.colors.blue.base);
|
|
11406
|
-
var templateObject_1$z, templateObject_2$
|
|
11406
|
+
var templateObject_1$z, templateObject_2$u, templateObject_3$a, templateObject_4$6;
|
|
11407
11407
|
|
|
11408
11408
|
var Checkboxes = function (props) {
|
|
11409
11409
|
var _a = useState(props.defaultValue || []), values = _a[0], setValues = _a[1];
|
|
@@ -11427,11 +11427,11 @@ var Checkboxes = function (props) {
|
|
|
11427
11427
|
};
|
|
11428
11428
|
|
|
11429
11429
|
var Container$j = styled.div(templateObject_1$y || (templateObject_1$y = __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);
|
|
11430
|
-
var Item = styled.div(templateObject_2$
|
|
11430
|
+
var Item = styled.div(templateObject_2$t || (templateObject_2$t = __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) {
|
|
11431
11431
|
var isOpen = _a.isOpen;
|
|
11432
11432
|
return (isOpen ? "" : "none");
|
|
11433
11433
|
}, theme.colors.lightGray.dark);
|
|
11434
|
-
var templateObject_1$y, templateObject_2$
|
|
11434
|
+
var templateObject_1$y, templateObject_2$t;
|
|
11435
11435
|
|
|
11436
11436
|
var Collapse = function (props) {
|
|
11437
11437
|
var _a = useState([]), openItems = _a[0], setOpenItems = _a[1];
|
|
@@ -11450,11 +11450,11 @@ var Collapse = function (props) {
|
|
|
11450
11450
|
};
|
|
11451
11451
|
|
|
11452
11452
|
var Wrapper$3 = styled.div(templateObject_1$x || (templateObject_1$x = __makeTemplateObject$1(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
11453
|
-
var Value = styled.div(templateObject_2$
|
|
11453
|
+
var Value = styled.div(templateObject_2$s || (templateObject_2$s = __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) {
|
|
11454
11454
|
var contrast = _a.contrast;
|
|
11455
11455
|
return contrast ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
11456
11456
|
}, theme.colors.darkGray.base);
|
|
11457
|
-
var templateObject_1$x, templateObject_2$
|
|
11457
|
+
var templateObject_1$x, templateObject_2$s;
|
|
11458
11458
|
|
|
11459
11459
|
var Countdown = function (_a) {
|
|
11460
11460
|
var till = _a.till, contrast = _a.contrast;
|
|
@@ -11482,8 +11482,8 @@ var Countdown = function (_a) {
|
|
|
11482
11482
|
};
|
|
11483
11483
|
|
|
11484
11484
|
var Container$i = styled.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"])));
|
|
11485
|
-
var Label$8 = styled(StyledParagraph)(templateObject_2$
|
|
11486
|
-
var templateObject_1$w, templateObject_2$
|
|
11485
|
+
var Label$8 = styled(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);
|
|
11486
|
+
var templateObject_1$w, templateObject_2$r;
|
|
11487
11487
|
|
|
11488
11488
|
var DateInputField = function (props) {
|
|
11489
11489
|
var onChange = function (value) {
|
|
@@ -14014,7 +14014,8 @@ function reducer(state, action) {
|
|
|
14014
14014
|
|
|
14015
14015
|
function noop() {}
|
|
14016
14016
|
|
|
14017
|
-
var Container$h = styled.div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject$1(["\n width: 100%;\n
|
|
14017
|
+
var Container$h = styled.div(templateObject_1$v || (templateObject_1$v = __makeTemplateObject$1(["\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 15px;\n"], ["\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 15px;\n"])));
|
|
14018
|
+
var DropZone = styled.div(templateObject_2$q || (templateObject_2$q = __makeTemplateObject$1(["\n min-height: 250px;\n border-width: 2px;\n border-style: dashed;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n background-color: ", ";\n padding: 25px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"], ["\n min-height: 250px;\n border-width: 2px;\n border-style: dashed;\n border-color: ", ";\n box-sizing: border-box;\n border-radius: 4px;\n background-color: ", ";\n padding: 25px;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n"])), function (_a) {
|
|
14018
14019
|
_a.isDragActive; var isDragAccept = _a.isDragAccept, isDragReject = _a.isDragReject;
|
|
14019
14020
|
// if (isDragActive) return theme.colors.blue.base;
|
|
14020
14021
|
if (isDragAccept)
|
|
@@ -14033,10 +14034,11 @@ var Container$h = styled.div(templateObject_1$v || (templateObject_1$v = __makeT
|
|
|
14033
14034
|
else
|
|
14034
14035
|
return theme.colors.lightGray.base;
|
|
14035
14036
|
});
|
|
14036
|
-
var
|
|
14037
|
+
var FileList = styled.div(templateObject_3$9 || (templateObject_3$9 = __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"])));
|
|
14038
|
+
var templateObject_1$v, templateObject_2$q, templateObject_3$9;
|
|
14037
14039
|
|
|
14038
14040
|
var FileUpload = function (_a) {
|
|
14039
|
-
var locale = _a.locale, accept = _a.accept, onDrop = _a.onDrop;
|
|
14041
|
+
var locale = _a.locale, accept = _a.accept, onDrop = _a.onDrop, files = _a.files;
|
|
14040
14042
|
var _b = useDropzone({
|
|
14041
14043
|
onDrop: onDrop,
|
|
14042
14044
|
accept: accept,
|
|
@@ -14046,11 +14048,11 @@ var FileUpload = function (_a) {
|
|
|
14046
14048
|
// Max number of files: 1
|
|
14047
14049
|
maxFiles: 1,
|
|
14048
14050
|
}), getRootProps = _b.getRootProps, getInputProps = _b.getInputProps, isDragActive = _b.isDragActive, isDragAccept = _b.isDragAccept, isDragReject = _b.isDragReject;
|
|
14049
|
-
return (jsx$1(Fragment$1, { children: jsxs(Container$h, __assign$2({}, getRootProps({
|
|
14050
|
-
|
|
14051
|
-
|
|
14052
|
-
|
|
14053
|
-
|
|
14051
|
+
return (jsx$1(Fragment$1, { children: jsxs(Container$h, { children: [jsxs(DropZone, __assign$2({}, getRootProps({
|
|
14052
|
+
isDragActive: isDragActive,
|
|
14053
|
+
isDragAccept: isDragAccept,
|
|
14054
|
+
isDragReject: isDragReject,
|
|
14055
|
+
}), { children: [jsx$1("input", __assign$2({}, getInputProps())), jsx$1(Icon, { type: "file", size: "large" }), jsx$1(Spacer, { vertical: 15 }), !isDragActive && (jsxs(Fragment$1, { children: [jsx$1(Heading, __assign$2({ type: "h6" }, { children: translations[locale]["Drag file(s) here..."] })), jsx$1(Spacer, { vertical: 5 }), jsx$1(Paragraph, { children: translations[locale]["or"] }), jsx$1(Spacer, { vertical: 10 }), jsx$1(Button, { label: translations[locale]["Select file(s)"], size: "small" })] })), isDragActive && !isDragReject && (jsx$1(Heading, __assign$2({ type: "h6" }, { children: translations[locale]["Upload file(s)..."] }))), isDragReject && (jsx$1(Heading, __assign$2({ type: "h6" }, { children: translations[locale]["File type not allowed"] })))] })), files && files.length > 0 && (jsx$1(FileList, { children: files.map(function (file, index) { return (jsx$1(Alert, { type: "success", message: file.name }, "".concat(file.name, "-").concat(index))); }) }))] }) }));
|
|
14054
14056
|
};
|
|
14055
14057
|
|
|
14056
14058
|
var StyledIconButton = styled(StyledButton)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject$1(["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n > div:first-child {\n margin-top: -2px;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"], ["\n min-width: ", ";\n max-width: ", ";\n min-height: ", ";\n max-height: ", ";\n padding: 2px 0 0 0;\n\n > div:first-child {\n margin-top: -2px;\n }\n\n :active {\n min-height: ", ";\n max-height: ", ";\n margin-top: 2px;\n }\n"])), function (_a) {
|
|
@@ -15033,7 +15035,12 @@ var Keyboard = function (props) {
|
|
|
15033
15035
|
};
|
|
15034
15036
|
|
|
15035
15037
|
var Mask = styled.div(templateObject_1$3 || (templateObject_1$3 = __makeTemplateObject$1(["\n width: 100vw;\n height: 100vh;\n position: fixed;\n background-color: rgba(35, 41, 47, 50%);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n"], ["\n width: 100vw;\n height: 100vh;\n position: fixed;\n background-color: rgba(35, 41, 47, 50%);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 1000;\n"])));
|
|
15036
|
-
var CardWrapper = styled.div(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject$1(["\n width: ", ";\n"], ["\n width: ", ";\n"])), function (_a) {
|
|
15038
|
+
var CardWrapper = styled.div(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject$1(["\n min-width: ", ";\n max-width: calc(100vw - 40px);\n width: ", ";\n"], ["\n min-width: ", ";\n max-width: calc(100vw - 40px);\n width: ", ";\n"])), function (_a) {
|
|
15039
|
+
var width = _a.width;
|
|
15040
|
+
if (typeof width === "number")
|
|
15041
|
+
return "".concat(width, "px");
|
|
15042
|
+
return width;
|
|
15043
|
+
}, function (_a) {
|
|
15037
15044
|
var width = _a.width;
|
|
15038
15045
|
if (!width)
|
|
15039
15046
|
return "720px";
|