@typeolymp/ui-components 1.19.21 → 1.19.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/components/atoms/Icon/index.d.ts +1 -1
- package/build/components/molecules/Alert/index.d.ts +6 -1
- package/build/components/molecules/Alert/styles.d.ts +1 -0
- package/build/components/molecules/Dropdown/Button.d.ts +6 -0
- package/build/components/molecules/Dropdown/index.d.ts +5 -1
- package/build/components/molecules/Dropdown/stories.d.ts +3 -1
- package/build/components/molecules/Dropdown/styles.d.ts +1 -0
- package/build/index.es.js +64 -24
- package/build/index.es.js.map +1 -1
- package/build/index.js +64 -24
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.js
CHANGED
|
@@ -3474,7 +3474,7 @@ var Loader = /** @class */ (function (_super) {
|
|
|
3474
3474
|
var _this = _super !== null && _super.apply(this, arguments) || this;
|
|
3475
3475
|
_this.style = function (i) {
|
|
3476
3476
|
var _a = _this.props, color = _a.color, size = _a.size, margin = _a.margin, speedMultiplier = _a.speedMultiplier;
|
|
3477
|
-
return react_1.css(templateObject_2$
|
|
3477
|
+
return react_1.css(templateObject_2$E || (templateObject_2$E = __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");
|
|
3478
3478
|
};
|
|
3479
3479
|
return _this;
|
|
3480
3480
|
}
|
|
@@ -3489,7 +3489,7 @@ var Loader = /** @class */ (function (_super) {
|
|
|
3489
3489
|
return Loader;
|
|
3490
3490
|
}(React$2.PureComponent));
|
|
3491
3491
|
var _default$1 = BeatLoader.default = Loader;
|
|
3492
|
-
var templateObject_1$X, templateObject_2$
|
|
3492
|
+
var templateObject_1$X, templateObject_2$E;
|
|
3493
3493
|
|
|
3494
3494
|
var Wrapper$a = styled__default["default"].div(templateObject_1$W || (templateObject_1$W = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n\n :hover {\n cursor: ", ";\n fill: ", ";\n }\n }\n"], ["\n width: ", ";\n height: ", ";\n\n > svg {\n fill: ", ";\n\n :hover {\n cursor: ", ";\n fill: ", ";\n }\n }\n"])), function (_a) {
|
|
3495
3495
|
var size = _a.size;
|
|
@@ -3590,8 +3590,9 @@ var icons = {
|
|
|
3590
3590
|
dotsHorizontal: (jsxRuntime.jsxs("g", { children: [jsxRuntime.jsx("circle", { cx: 4.2, cy: 12, r: 1.9 }), jsxRuntime.jsx("circle", { cx: 12, cy: 12, r: 1.9 }), jsxRuntime.jsx("path", { d: "M17.8 12c0 1.1.9 1.9 1.9 1.9 1.1 0 1.9-.9 1.9-1.9s-.9-1.9-1.9-1.9c-1 0-1.9.8-1.9 1.9z" })] })),
|
|
3591
3591
|
bell: (jsxRuntime.jsx("path", { d: "M13.6 1.8c0-.4-.2-.8-.5-1.1-.3-.3-.7-.5-1.1-.5-.9 0-1.6.7-1.6 1.6v.4c-3.7.8-6.3 4-6.3 7.8v2.9c0 1.6-.6 3.1-1.7 4.2l-.4.2c-.6.6-.9 1.4-.9 2.2v1c0 .8.6 1.4 1.4 1.4h6.3c.2 1.1 1.2 1.9 2.4 1.9h1.6c.7 0 1.3-.3 1.7-.7.3-.3.6-.8.7-1.2h6.3c.7 0 1.4-.6 1.4-1.4v-1c0-.8-.3-1.6-.9-2.2l-.3-.3c-1.1-1.1-1.7-2.6-1.7-4.2V9.9c0-3.8-2.7-7.1-6.4-7.9v-.2z" })),
|
|
3592
3592
|
bin: (jsxRuntime.jsx("path", { d: "M4.3 7.2h15.5v.2c-.1 1.4-.2 2.7-.3 4.1-.1 1.3-.2 2.7-.3 4-.1 1.6-.2 3.1-.4 4.7 0 .6-.1 1.1-.1 1.7-.2 1.1-1.3 2.1-2.5 2.1H7.9c-1.2 0-2.4-1.1-2.5-2.3-.1-1.6-.3-3.2-.4-4.9-.1-1.7-.3-3.4-.4-5.2-.1-1.4-.2-2.9-.3-4.4zm7.1 8.4v4.5c0 .4.3.7.7.7.4 0 .6-.3.6-.7v-8.9-.2c-.1-.3-.3-.5-.6-.5-.4 0-.7.3-.7.7v4.4zm4.5 0v-1.1-3.4c0-.4-.3-.7-.7-.7-.4 0-.6.3-.6.7v9.1c0 .3.2.5.5.6.4.1.8-.2.8-.7v-4.5zm-7.8 0v4.6c0 .3.3.6.6.6.4 0 .7-.3.7-.7v-8.9-.2c0-.4-.3-.6-.7-.6-.4 0-.6.3-.6.7v4.5zM15.7 3.3h3.5c1.1 0 1.9.7 2.1 1.8v.4c0 .2-.2.4-.4.5H3.2h-.1c-.3 0-.5-.2-.5-.5 0-1.2.9-2 2.2-2.1h3.5v-.7c0-1.6 1-2.7 2.5-2.7h2.6c1.3.1 2.2 1.2 2.3 2.4v.9zm-5.5 0h3.6v-.8c0-.3-.2-.5-.6-.5h-2.5c-.3 0-.5.2-.6.5.1.2.1.5.1.8z" })),
|
|
3593
|
-
user: (jsxRuntime.jsx("path", { d: "M12 12.4c3
|
|
3593
|
+
user: (jsxRuntime.jsx("path", { d: "M12 12.4c3 0 5.5-2.5 5.5-5.5S15.1 1.3 12 1.3 6.5 3.8 6.5 6.8 9 12.4 12 12.4zm4.1.1c-.3-.1-.6 0-.9.2-.9.7-2 1.1-3.2 1.1s-2.3-.4-3.3-1.1c-.3-.2-.5-.3-.9-.2-3.8.9-6.5 4.3-6.5 8.3 0 1 .9 1.9 1.9 1.9h17.5c1.1 0 1.9-.9 1.9-1.9.1-4-2.5-7.4-6.5-8.3z" })),
|
|
3594
3594
|
search: (jsxRuntime.jsx("path", { d: "M.6 23.4c.6.6 1.7.6 2.3 0l7.1-7.1c1.4 1 3.2 1.6 5.1 1.6 4.9 0 8.9-4 8.9-8.9S20 .1 15.1.1C10.1.1 6 4.1 6 9c0 1.9.6 3.6 1.6 5.1L.5 21.2c-.6.6-.6 1.6.1 2.2zM9.3 9c0-3.1 2.5-5.7 5.7-5.7s5.7 2.5 5.7 5.7c0 3.1-2.5 5.7-5.7 5.7S9.3 12.2 9.3 9z" })),
|
|
3595
|
+
infoCircle: (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12 23C14.1756 23 16.3023 22.3549 18.1113 21.1462C19.9202 19.9375 21.3302 18.2195 22.1627 16.2095C22.9953 14.1995 23.2131 11.9878 22.7886 9.85401C22.3642 7.72022 21.3166 5.76021 19.7782 4.22184C18.2398 2.68346 16.2798 1.6358 14.146 1.21137C12.0122 0.78693 9.80051 1.00476 7.79053 1.83733C5.78054 2.66989 4.06258 4.07979 2.85388 5.88874C1.64519 7.69768 1 9.82441 1 12C1 14.9174 2.15896 17.7153 4.22186 19.7782C6.28476 21.8411 9.08262 23 12 23ZM12 20.5C13.6811 20.5 15.3245 20.0015 16.7224 19.0675C18.1202 18.1335 19.2096 16.806 19.853 15.2528C20.4963 13.6996 20.6646 11.9906 20.3367 10.3417C20.0087 8.6929 19.1992 7.17834 18.0104 5.9896C16.8217 4.80085 15.3071 3.99131 13.6583 3.66333C12.0094 3.33536 10.3004 3.50369 8.74719 4.14704C7.19402 4.79038 5.86655 5.87983 4.93256 7.27765C3.99856 8.67547 3.5 10.3189 3.5 12C3.49868 13.1166 3.71765 14.2225 4.14435 15.2544C4.57105 16.2862 5.19713 17.2238 5.98669 18.0133C6.77625 18.8029 7.71381 19.429 8.74567 19.8557C9.77753 20.2824 10.8834 20.5013 12 20.5Z" }), jsxRuntime.jsx("path", { d: "M13.6 17.4v-2-3.1-.7c0-.4-.2-.7-.4-1-.2-.2-.6-.4-1-.4s-.7.1-1 .4c-.3.3-.4.6-.4 1v5.8c0 .4.2.7.4 1 .2.2.6.4 1 .4s.7-.1 1-.4c.2-.3.4-.6.4-1zM13.6 7.4v-.8c0-.4-.2-.7-.4-1-.2-.2-.6-.4-1-.4s-.7.1-1 .4c-.3.3-.4.6-.4 1v.8c0 .4.2.7.4 1 .2.2.6.4 1 .4s.7-.1 1-.4c.2-.3.4-.7.4-1z" })] })),
|
|
3595
3596
|
};
|
|
3596
3597
|
var Icon = function (props) { return (jsxRuntime.jsx(Wrapper$a, __assign$2({}, props, { children: jsxRuntime.jsx("svg", __assign$2({ viewBox: "0 0 24 24", fill: "none" }, { children: icons[props.type] })) }))); };
|
|
3597
3598
|
|
|
@@ -3649,11 +3650,11 @@ var StyledButton = styled__default["default"].button(templateObject_1$V || (temp
|
|
|
3649
3650
|
? theme.button.medium.heightActive
|
|
3650
3651
|
: theme.button[size].heightActive;
|
|
3651
3652
|
});
|
|
3652
|
-
var DisabledButton = styled__default["default"](StyledButton)(templateObject_2$
|
|
3653
|
+
var DisabledButton = styled__default["default"](StyledButton)(templateObject_2$D || (templateObject_2$D = __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) {
|
|
3653
3654
|
var size = _a.size;
|
|
3654
3655
|
return !size ? theme.button.medium.height : theme.button[size].height;
|
|
3655
3656
|
});
|
|
3656
|
-
var GhostButton = styled__default["default"](StyledButton)(templateObject_3$
|
|
3657
|
+
var GhostButton = styled__default["default"](StyledButton)(templateObject_3$f || (templateObject_3$f = __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) {
|
|
3657
3658
|
var size = _a.size;
|
|
3658
3659
|
return !size
|
|
3659
3660
|
? "calc(".concat(theme.button.medium.height, " - 2.5px)")
|
|
@@ -3676,7 +3677,7 @@ var LoaderWrapper = styled__default["default"].div(templateObject_4$8 || (templa
|
|
|
3676
3677
|
var size = _a.size;
|
|
3677
3678
|
return (size === "small" ? "3px" : "");
|
|
3678
3679
|
});
|
|
3679
|
-
var templateObject_1$V, templateObject_2$
|
|
3680
|
+
var templateObject_1$V, templateObject_2$D, templateObject_3$f, templateObject_4$8;
|
|
3680
3681
|
|
|
3681
3682
|
var StyledSpacer = styled__default["default"].div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject$1(["\n width: ", ";\n height: ", ";\n"], ["\n width: ", ";\n height: ", ";\n"])), function (_a) {
|
|
3682
3683
|
var horizontal = _a.horizontal;
|
|
@@ -4317,7 +4318,7 @@ var StyledParagraph = styled__default["default"].p(templateObject_1$P || (templa
|
|
|
4317
4318
|
var templateObject_1$P;
|
|
4318
4319
|
|
|
4319
4320
|
var Container$q = styled__default["default"].div(templateObject_1$O || (templateObject_1$O = __makeTemplateObject$1(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
4320
|
-
var InputIconWrapper = styled__default["default"].div(templateObject_2$
|
|
4321
|
+
var InputIconWrapper = styled__default["default"].div(templateObject_2$C || (templateObject_2$C = __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) {
|
|
4321
4322
|
var size = _a.size;
|
|
4322
4323
|
switch (size) {
|
|
4323
4324
|
case "small":
|
|
@@ -4360,7 +4361,7 @@ var InputIconWrapper = styled__default["default"].div(templateObject_2$B || (tem
|
|
|
4360
4361
|
return "24px";
|
|
4361
4362
|
}
|
|
4362
4363
|
});
|
|
4363
|
-
var StyledInput = styled__default["default"].input(templateObject_3$
|
|
4364
|
+
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) {
|
|
4364
4365
|
var size = _a.size;
|
|
4365
4366
|
switch (size) {
|
|
4366
4367
|
case "small":
|
|
@@ -4388,7 +4389,7 @@ var Helper = styled__default["default"](StyledParagraph)(templateObject_6$3 || (
|
|
|
4388
4389
|
var isOk = _a.isOk;
|
|
4389
4390
|
return isOk ? theme.colors.green.base : theme.colors.darkGray.light;
|
|
4390
4391
|
}, fadeIn);
|
|
4391
|
-
var templateObject_1$O, templateObject_2$
|
|
4392
|
+
var templateObject_1$O, templateObject_2$C, templateObject_3$e, templateObject_4$7, templateObject_5$3, templateObject_6$3;
|
|
4392
4393
|
|
|
4393
4394
|
var expressions = {};
|
|
4394
4395
|
|
|
@@ -8098,7 +8099,7 @@ var Wrapper$6 = styled__default["default"].div(templateObject_1$M || (templateOb
|
|
|
8098
8099
|
var disabled = _a.disabled;
|
|
8099
8100
|
return (disabled ? "49.5px" : "");
|
|
8100
8101
|
});
|
|
8101
|
-
var StyledInputNumber = styled__default["default"].input(templateObject_2$
|
|
8102
|
+
var StyledInputNumber = styled__default["default"].input(templateObject_2$B || (templateObject_2$B = __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) {
|
|
8102
8103
|
var disabled = _a.disabled;
|
|
8103
8104
|
return disabled ? theme.colors.lightGray.base : theme.colors.lightGray.light;
|
|
8104
8105
|
}, function (_a) {
|
|
@@ -8111,7 +8112,7 @@ var StyledInputNumber = styled__default["default"].input(templateObject_2$A || (
|
|
|
8111
8112
|
var disabled = _a.disabled;
|
|
8112
8113
|
return disabled ? theme.colors.darkGray.light : theme.colors.darkGray.base;
|
|
8113
8114
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
8114
|
-
var templateObject_1$M, templateObject_2$
|
|
8115
|
+
var templateObject_1$M, templateObject_2$B;
|
|
8115
8116
|
|
|
8116
8117
|
var Number$1 = function (props) {
|
|
8117
8118
|
var inputRef = React$3.useRef(null);
|
|
@@ -8258,7 +8259,7 @@ var Wrapper$5 = styled__default["default"].div(templateObject_1$J || (templateOb
|
|
|
8258
8259
|
var disabled = _a.disabled;
|
|
8259
8260
|
return (disabled ? "not-allowed" : "pointer");
|
|
8260
8261
|
});
|
|
8261
|
-
var StyledSelect = styled__default["default"].select(templateObject_2$
|
|
8262
|
+
var StyledSelect = styled__default["default"].select(templateObject_2$A || (templateObject_2$A = __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) {
|
|
8262
8263
|
var disabled = _a.disabled;
|
|
8263
8264
|
return disabled ? theme.colors.lightGray.dark : theme.colors.lightGray.light;
|
|
8264
8265
|
}, function (_a) {
|
|
@@ -8271,7 +8272,7 @@ var StyledSelect = styled__default["default"].select(templateObject_2$z || (temp
|
|
|
8271
8272
|
var isChanged = _a.isChanged;
|
|
8272
8273
|
return isChanged ? theme.colors.darkGray.base : theme.colors.lightGray.darker;
|
|
8273
8274
|
}, theme.colors.blue.dark, "0 0 0 1px ".concat(theme.colors.blue.dark));
|
|
8274
|
-
var templateObject_1$J, templateObject_2$
|
|
8275
|
+
var templateObject_1$J, templateObject_2$A;
|
|
8275
8276
|
|
|
8276
8277
|
var Select = function (props) {
|
|
8277
8278
|
var _a;
|
|
@@ -8479,6 +8480,8 @@ var Container$n = styled__default["default"].div(templateObject_1$D || (template
|
|
|
8479
8480
|
return "rgba(139, 220, 174, 20%)";
|
|
8480
8481
|
case "error":
|
|
8481
8482
|
return "rgba(247, 119, 140, 20%)";
|
|
8483
|
+
case "info":
|
|
8484
|
+
return "rgba(120, 205, 250, 20%)";
|
|
8482
8485
|
}
|
|
8483
8486
|
}, function (_a) {
|
|
8484
8487
|
var type = _a.type;
|
|
@@ -8487,11 +8490,40 @@ var Container$n = styled__default["default"].div(templateObject_1$D || (template
|
|
|
8487
8490
|
return theme.colors.green.base;
|
|
8488
8491
|
case "error":
|
|
8489
8492
|
return theme.colors.red.base;
|
|
8493
|
+
case "info":
|
|
8494
|
+
return theme.colors.blue.base;
|
|
8490
8495
|
}
|
|
8491
8496
|
});
|
|
8492
|
-
var
|
|
8493
|
-
|
|
8494
|
-
|
|
8497
|
+
var Action = styled__default["default"].div(templateObject_2$z || (templateObject_2$z = __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) {
|
|
8498
|
+
var type = _a.type;
|
|
8499
|
+
switch (type) {
|
|
8500
|
+
default:
|
|
8501
|
+
case "success":
|
|
8502
|
+
return theme.colors.green.dark;
|
|
8503
|
+
case "error":
|
|
8504
|
+
return theme.colors.red.dark;
|
|
8505
|
+
case "info":
|
|
8506
|
+
return theme.colors.blue.dark;
|
|
8507
|
+
}
|
|
8508
|
+
});
|
|
8509
|
+
var templateObject_1$D, templateObject_2$z;
|
|
8510
|
+
|
|
8511
|
+
var Alert = function (props) {
|
|
8512
|
+
var _a = React$3.useState(true), isOpen = _a[0], setIsOpen = _a[1];
|
|
8513
|
+
var color = "green";
|
|
8514
|
+
if (props.type === "error")
|
|
8515
|
+
color = "red";
|
|
8516
|
+
else if (props.type === "info")
|
|
8517
|
+
color = "blue";
|
|
8518
|
+
var icon = "check";
|
|
8519
|
+
if (props.type === "error")
|
|
8520
|
+
icon = "warning";
|
|
8521
|
+
else if (props.type === "info")
|
|
8522
|
+
icon = "infoCircle";
|
|
8523
|
+
if (!isOpen)
|
|
8524
|
+
return null;
|
|
8525
|
+
return (jsxRuntime.jsxs(Container$n, __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); } }) })))] })));
|
|
8526
|
+
};
|
|
8495
8527
|
|
|
8496
8528
|
var StyledCard = styled__default["default"].div(templateObject_1$C || (templateObject_1$C = __makeTemplateObject$1(["\n background-color: ", ";\n border: ", ";\n box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n border-radius: 6px;\n overflow: hidden;\n position: relative;\n\n ", "\n"], ["\n background-color: ", ";\n border: ", ";\n box-shadow: 0px 4px 0px rgba(0, 0, 0, 20%);\n border-radius: 6px;\n overflow: hidden;\n position: relative;\n\n ", "\n"])), theme.colors.lightGray.light, function (_a) {
|
|
8497
8529
|
var bordered = _a.bordered;
|
|
@@ -8509,8 +8541,8 @@ var Ellipse = styled__default["default"].div(templateObject_2$y || (templateObje
|
|
|
8509
8541
|
var color = _a.color;
|
|
8510
8542
|
return color ? theme.colors[color].light : "";
|
|
8511
8543
|
});
|
|
8512
|
-
var Content = styled__default["default"].div(templateObject_3$
|
|
8513
|
-
var templateObject_1$C, templateObject_2$y, templateObject_3$
|
|
8544
|
+
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"])));
|
|
8545
|
+
var templateObject_1$C, templateObject_2$y, templateObject_3$d;
|
|
8514
8546
|
|
|
8515
8547
|
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 })] }))); };
|
|
8516
8548
|
|
|
@@ -14761,12 +14793,12 @@ htmlReactParser.Text;
|
|
|
14761
14793
|
|
|
14762
14794
|
var Fieldset$1 = styled__default["default"].fieldset(templateObject_1$B || (templateObject_1$B = __makeTemplateObject$1(["\n border: 0;\n margin: 0;\n padding: 0;\n"], ["\n border: 0;\n margin: 0;\n padding: 0;\n"])));
|
|
14763
14795
|
var CheckboxContainer = styled__default["default"].div(templateObject_2$x || (templateObject_2$x = __makeTemplateObject$1(["\n margin-top: 5px;\n"], ["\n margin-top: 5px;\n"])));
|
|
14764
|
-
var CheckboxWrapper = styled__default["default"].div(templateObject_3$
|
|
14796
|
+
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"])));
|
|
14765
14797
|
var Label$b = styled__default["default"](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) {
|
|
14766
14798
|
var weight = _a.weight;
|
|
14767
14799
|
return weight || 500;
|
|
14768
14800
|
}, theme.colors.darkGray.base, theme.colors.blue.base);
|
|
14769
|
-
var templateObject_1$B, templateObject_2$x, templateObject_3$
|
|
14801
|
+
var templateObject_1$B, templateObject_2$x, templateObject_3$c, templateObject_4$6;
|
|
14770
14802
|
|
|
14771
14803
|
var Checkboxes = function (props) {
|
|
14772
14804
|
var _a = React$3.useState(props.defaultValue || []), values = _a[0], setValues = _a[1];
|
|
@@ -14881,7 +14913,8 @@ var generateRandomString = function (length) {
|
|
|
14881
14913
|
return string;
|
|
14882
14914
|
};
|
|
14883
14915
|
|
|
14884
|
-
var
|
|
14916
|
+
var ButtonWrapper$1 = styled__default["default"].div(templateObject_1$w || (templateObject_1$w = __makeTemplateObject$1(["\n > button {\n flex-direction: row-reverse;\n padding-right: 14px;\n }\n"], ["\n > button {\n flex-direction: row-reverse;\n padding-right: 14px;\n }\n"])));
|
|
14917
|
+
var Container$j = styled__default["default"].div(templateObject_2$s || (templateObject_2$s = __makeTemplateObject$1(["\n width: max-content;\n position: fixed;\n z-index: 9;\n opacity: ", ";\n top: ", ";\n left: ", ";\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 6px;\n box-shadow: 0 4px 0 ", ";\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: 1px solid ", ";\n border-radius: 6px;\n box-shadow: 0 4px 0 ", ";\n pointer-events: ", ";\n"])), function (_a) {
|
|
14885
14918
|
var isVisible = _a.isVisible;
|
|
14886
14919
|
return (isVisible ? "100%" : "0%");
|
|
14887
14920
|
}, function (_a) {
|
|
@@ -14894,8 +14927,12 @@ var Container$j = styled__default["default"].div(templateObject_1$w || (template
|
|
|
14894
14927
|
var isVisible = _a.isVisible;
|
|
14895
14928
|
return (isVisible ? "all" : "none");
|
|
14896
14929
|
});
|
|
14897
|
-
var MenuItem = styled__default["default"].div(
|
|
14898
|
-
var templateObject_1$w, templateObject_2$s;
|
|
14930
|
+
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 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 svg {\n fill: ", ";\n }\n }\n"])), theme.colors.lightGray.dark, theme.colors.lightGray.base, theme.colors.blue.base, theme.colors.blue.base);
|
|
14931
|
+
var templateObject_1$w, templateObject_2$s, templateObject_3$b;
|
|
14932
|
+
|
|
14933
|
+
var DropdownButton = function (props) {
|
|
14934
|
+
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx("div", { children: jsxRuntime.jsx(Dropdown, __assign$2({}, props, { children: jsxRuntime.jsx(ButtonWrapper$1, { children: jsxRuntime.jsx(Button, { label: props.label, icon: "chevronDown", disabled: props.disabled, color: props.color, size: props.size }) }) })) }) }));
|
|
14935
|
+
};
|
|
14899
14936
|
|
|
14900
14937
|
var Dropdown = function (_a) {
|
|
14901
14938
|
var menu = _a.menu, trigger = _a.trigger, props = __rest$1(_a, ["menu", "trigger"]);
|
|
@@ -14917,6 +14954,8 @@ var Dropdown = function (_a) {
|
|
|
14917
14954
|
};
|
|
14918
14955
|
}, [handleClickOutside]);
|
|
14919
14956
|
var triggerDropdown = React$3.useCallback(function () {
|
|
14957
|
+
if (props.disabled)
|
|
14958
|
+
return;
|
|
14920
14959
|
var el = document.getElementById(triggerId);
|
|
14921
14960
|
if (el) {
|
|
14922
14961
|
var _a = el.getBoundingClientRect(), bottom = _a.bottom, left = _a.left;
|
|
@@ -14948,7 +14987,8 @@ var Dropdown = function (_a) {
|
|
|
14948
14987
|
var label = _a.label, icon = _a.icon, onClick = _a.onClick;
|
|
14949
14988
|
return (jsxRuntime.jsxs(MenuItem, __assign$2({ onClick: onClick }, { children: [icon && jsxRuntime.jsx(Icon, { type: icon, size: "tiny" }), jsxRuntime.jsx(Paragraph, __assign$2({ size: "small", weight: "regular", color: "darkGray" }, { children: label }))] }), "".concat(label, "-").concat(index)));
|
|
14950
14989
|
}) }))] }));
|
|
14951
|
-
};
|
|
14990
|
+
};
|
|
14991
|
+
Dropdown.Button = DropdownButton;
|
|
14952
14992
|
|
|
14953
14993
|
var propTypes = {exports: {}};
|
|
14954
14994
|
|