kui-complex 0.0.27 → 0.0.28
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/dist/index.es.js +21 -21
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +21 -21
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.es.js
CHANGED
|
@@ -85,7 +85,7 @@ var Wrapper$7 = styled.div(templateObject_1$s || (templateObject_1$s = __makeTem
|
|
|
85
85
|
var StyledImage = styled.img(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n width: 100%;\n height: 100%;\n border-radius: 50%;\n object-fit: cover;\n"], ["\n width: 100%;\n height: 100%;\n border-radius: 50%;\n object-fit: cover;\n"])));
|
|
86
86
|
var largeAvatarCSS = function (_a) {
|
|
87
87
|
var avatarSize = _a.avatarSize;
|
|
88
|
-
return avatarSize === "lg" && css(templateObject_3$
|
|
88
|
+
return avatarSize === "lg" && css(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n font-size: 32px;\n "], ["\n font-size: 32px;\n "])));
|
|
89
89
|
};
|
|
90
90
|
var StyledUndefinedAvatar = styled(UndefinedAvatar, {
|
|
91
91
|
shouldForwardProp: function (prop) { return prop !== "size"; },
|
|
@@ -94,7 +94,7 @@ var sizeStyles = {
|
|
|
94
94
|
s: css(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject(["\n width: 40px;\n height: 40px;\n @media (max-width: 600px) {\n width: 32px;\n height: 32px;\n }\n "], ["\n width: 40px;\n height: 40px;\n @media (max-width: 600px) {\n width: 32px;\n height: 32px;\n }\n "]))),
|
|
95
95
|
lg: css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n width: 80px;\n height: 80px;\n "], ["\n width: 80px;\n height: 80px;\n "]))),
|
|
96
96
|
};
|
|
97
|
-
var templateObject_1$s, templateObject_2$e, templateObject_3$
|
|
97
|
+
var templateObject_1$s, templateObject_2$e, templateObject_3$7, templateObject_4$1, templateObject_5$1, templateObject_6;
|
|
98
98
|
|
|
99
99
|
var ButtonTab = function (_a) {
|
|
100
100
|
var index = _a.index, onClick = _a.onClick, isActive = _a.isActive, label = _a.label;
|
|
@@ -191,8 +191,8 @@ var InputSelectDropdown = function (_a) {
|
|
|
191
191
|
};
|
|
192
192
|
var OptionWrapper = styled.div(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n width: 100%;\n padding: 2px 0;\n cursor: pointer;\n"], ["\n width: 100%;\n padding: 2px 0;\n cursor: pointer;\n"])));
|
|
193
193
|
var StyledOption = styled.div(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n padding: 8px;\n transition: all ease-out 0.3s;\n border-radius: 4px;\n &:hover {\n background-color: ", ";\n }\n"], ["\n padding: 8px;\n transition: all ease-out 0.3s;\n border-radius: 4px;\n &:hover {\n background-color: ", ";\n }\n"])), theme.palette.background.light1);
|
|
194
|
-
var selectedStyles = css(templateObject_3$
|
|
195
|
-
var templateObject_1$o, templateObject_2$b, templateObject_3$
|
|
194
|
+
var selectedStyles = css(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject(["\n background-color: ", ";\n"], ["\n background-color: ", ";\n"])), theme.palette.background.light1);
|
|
195
|
+
var templateObject_1$o, templateObject_2$b, templateObject_3$6;
|
|
196
196
|
|
|
197
197
|
var getFormValue = function (name, form) {
|
|
198
198
|
var names = name === null || name === void 0 ? void 0 : name.split(".");
|
|
@@ -267,8 +267,8 @@ var InputSelect = forwardRef(function (props, ref) {
|
|
|
267
267
|
});
|
|
268
268
|
var Wrapper$6 = styled.div(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n position: relative;\n text-align: left;\n width: fit-content;\n"], ["\n position: relative;\n text-align: left;\n width: fit-content;\n"])));
|
|
269
269
|
var StyledInput = styled(InputWithAdornments)(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n cursor: pointer;\n input,\n label {\n cursor: pointer !important;\n }\n"], ["\n cursor: pointer;\n input,\n label {\n cursor: pointer !important;\n }\n"])));
|
|
270
|
-
var StyledIconWrapper = styled.div(templateObject_3$
|
|
271
|
-
var templateObject_1$n, templateObject_2$a, templateObject_3$
|
|
270
|
+
var StyledIconWrapper = styled.div(templateObject_3$5 || (templateObject_3$5 = __makeTemplateObject(["\n padding-right: 8px;\n padding-bottom: 4px;\n"], ["\n padding-right: 8px;\n padding-bottom: 4px;\n"])));
|
|
271
|
+
var templateObject_1$n, templateObject_2$a, templateObject_3$5;
|
|
272
272
|
|
|
273
273
|
var SelectYear = function (_a) {
|
|
274
274
|
var yearOptions = _a.yearOptions; _a.options; var props = __rest(_a, ["yearOptions", "options"]);
|
|
@@ -321,8 +321,8 @@ var CalendarStandardHeader = function (_a) {
|
|
|
321
321
|
};
|
|
322
322
|
var HeaderWrapper = styled(Grid)(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n padding: 0 6px 34px;\n @media (max-width: 600px) {\n h2 {\n font-size: 16px;\n }\n }\n"], ["\n padding: 0 6px 34px;\n @media (max-width: 600px) {\n h2 {\n font-size: 16px;\n }\n }\n"])));
|
|
323
323
|
var StyledHeading = styled(Heading)(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n @media (max-width: 600px) {\n font-weight: 700;\n }\n"], ["\n @media (max-width: 600px) {\n font-weight: 700;\n }\n"])));
|
|
324
|
-
var CircleButtonStyled = styled(Button)(templateObject_3$
|
|
325
|
-
var templateObject_1$k, templateObject_2$9, templateObject_3$
|
|
324
|
+
var CircleButtonStyled = styled(Button)(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n border-color: transparent !important;\n &:disabled {\n background-color: white !important;\n }\n"], ["\n border-color: transparent !important;\n &:disabled {\n background-color: white !important;\n }\n"])));
|
|
325
|
+
var templateObject_1$k, templateObject_2$9, templateObject_3$4;
|
|
326
326
|
|
|
327
327
|
var InputForDatepicker = forwardRef(function (_a, ref) {
|
|
328
328
|
var onClick = _a.onClick, onBlur = _a.onBlur, onFocus = _a.onFocus, props = __rest(_a, ["onClick", "onBlur", "onFocus"]);
|
|
@@ -500,13 +500,13 @@ var PassportStrengthBar = function (_a) {
|
|
|
500
500
|
};
|
|
501
501
|
var Wrapper$2 = styled.div(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n margin-top: 16px;\n min-height: 86px;\n @media (max-width: 900px) {\n min-height: unset;\n }\n &.hidden {\n opacity: 0;\n @media (max-width: 900px) {\n display: none;\n }\n }\n"], ["\n margin-top: 16px;\n min-height: 86px;\n @media (max-width: 900px) {\n min-height: unset;\n }\n &.hidden {\n opacity: 0;\n @media (max-width: 900px) {\n display: none;\n }\n }\n"])));
|
|
502
502
|
var ReliabilityLevelWrapper = styled.div(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n display: flex;\n margin-bottom: 8px;\n"], ["\n display: flex;\n margin-bottom: 8px;\n"])));
|
|
503
|
-
var ReliabilityLevel = styled.div(templateObject_3$
|
|
503
|
+
var ReliabilityLevel = styled.div(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n width: calc(100% / 4);\n margin-right: 16px;\n &:last-of-type {\n margin-right: 0;\n }\n"], ["\n width: calc(100% / 4);\n margin-right: 16px;\n &:last-of-type {\n margin-right: 0;\n }\n"])));
|
|
504
504
|
var StyledLinearProgress = styled(LinearProgress)(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n height: 8px;\n border-radius: 8px;\n background-color: ", ";\n & .KUI-LinearProgress_bar {\n background-color: ", ";\n width: 102%;\n }\n"], ["\n height: 8px;\n border-radius: 8px;\n background-color: ", ";\n & .KUI-LinearProgress_bar {\n background-color: ", ";\n width: 102%;\n }\n"])), theme.palette.grey.fifteenB, function (_a) {
|
|
505
505
|
var color = _a.color;
|
|
506
506
|
return color;
|
|
507
507
|
});
|
|
508
508
|
var Description = styled(Caption)(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n margin-top: 16px;\n @media (max-width: 900px) {\n margin-top: 8px;\n font-size: 12px;\n }\n"], ["\n margin-top: 16px;\n @media (max-width: 900px) {\n margin-top: 8px;\n font-size: 12px;\n }\n"])));
|
|
509
|
-
var templateObject_1$d, templateObject_2$6, templateObject_3$
|
|
509
|
+
var templateObject_1$d, templateObject_2$6, templateObject_3$3, templateObject_4, templateObject_5;
|
|
510
510
|
|
|
511
511
|
var isValidWithMaskExp = /^[^_]+$/;
|
|
512
512
|
var simplePasswordRegExp = /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[!@#$%^&*]).{10,}$/;
|
|
@@ -576,8 +576,8 @@ var ModalFooter = function (_a) {
|
|
|
576
576
|
};
|
|
577
577
|
var StyledFooter = styled.div(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n background: ", ";\n border-radius: 0 0 12px 12px;\n z-index: 10;\n position: sticky;\n bottom: 0;\n left: 0;\n"], ["\n background: ", ";\n border-radius: 0 0 12px 12px;\n z-index: 10;\n position: sticky;\n bottom: 0;\n left: 0;\n"])), theme.palette.grey.zero);
|
|
578
578
|
var ButtonWrapper = styled.div(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject(["\n display: flex;\n justify-content: flex-end;\n padding: 24px 40px;\n @media (max-width: 600px) {\n padding: 24px 16px;\n }\n"], ["\n display: flex;\n justify-content: flex-end;\n padding: 24px 40px;\n @media (max-width: 600px) {\n padding: 24px 16px;\n }\n"])));
|
|
579
|
-
var ButtonStyled = styled(Button)(templateObject_3$
|
|
580
|
-
var templateObject_1$a, templateObject_2$4, templateObject_3$
|
|
579
|
+
var ButtonStyled = styled(Button)(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n @media (max-width: 600px) {\n width: 100%;\n }\n"], ["\n @media (max-width: 600px) {\n width: 100%;\n }\n"])));
|
|
580
|
+
var templateObject_1$a, templateObject_2$4, templateObject_3$2;
|
|
581
581
|
|
|
582
582
|
registerLocale("ru", ru);
|
|
583
583
|
var generateYearRange = function (offsetFromCurrent, maxYearCount) {
|
|
@@ -633,8 +633,8 @@ InputWithDatePicker.defaultProps = {
|
|
|
633
633
|
};
|
|
634
634
|
var ContentWrapper$1 = styled.div(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n padding: 36px 40px 24px;\n @media (max-width: 600px) {\n padding: 20px 0 0;\n }\n"], ["\n padding: 36px 40px 24px;\n @media (max-width: 600px) {\n padding: 20px 0 0;\n }\n"])));
|
|
635
635
|
var StyledCalendarStandardContainer = styled(CalendarStandardContainer)(templateObject_2$3 || (templateObject_2$3 = __makeTemplateObject(["\n height: 410px;\n .react-datepicker__header {\n padding: 0 !important;\n }\n .react-datepicker__day-names {\n padding: 35px 22px 0;\n background-color: ", ";\n border-radius: 16px 16px 0 0;\n @media (max-width: 900px) {\n padding: 24px 16px 0;\n }\n }\n .react-datepicker__month {\n justify-content: space-between;\n height: calc(100% - 124px);\n background-color: ", ";\n border-radius: 0 0 16px 16px;\n padding: 20px 22px 24px;\n margin: 0 !important;\n box-sizing: border-box;\n @media (max-width: 900px) {\n padding: 20px 16px 24px;\n }\n }\n @media (max-width: 600px) {\n height: auto;\n margin-bottom: -4px;\n }\n"], ["\n height: 410px;\n .react-datepicker__header {\n padding: 0 !important;\n }\n .react-datepicker__day-names {\n padding: 35px 22px 0;\n background-color: ", ";\n border-radius: 16px 16px 0 0;\n @media (max-width: 900px) {\n padding: 24px 16px 0;\n }\n }\n .react-datepicker__month {\n justify-content: space-between;\n height: calc(100% - 124px);\n background-color: ", ";\n border-radius: 0 0 16px 16px;\n padding: 20px 22px 24px;\n margin: 0 !important;\n box-sizing: border-box;\n @media (max-width: 900px) {\n padding: 20px 16px 24px;\n }\n }\n @media (max-width: 600px) {\n height: auto;\n margin-bottom: -4px;\n }\n"])), theme.palette.background.light1, theme.palette.background.light1);
|
|
636
|
-
var DayContent = styled.span(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n padding-top: 1px;\n @media (max-width: 600px) {\n font-weight: 400;\n }\n"], ["\n padding-top: 1px;\n @media (max-width: 600px) {\n font-weight: 400;\n }\n"])));
|
|
637
|
-
var templateObject_1$9, templateObject_2$3, templateObject_3;
|
|
636
|
+
var DayContent = styled.span(templateObject_3$1 || (templateObject_3$1 = __makeTemplateObject(["\n padding-top: 1px;\n @media (max-width: 600px) {\n font-weight: 400;\n }\n"], ["\n padding-top: 1px;\n @media (max-width: 600px) {\n font-weight: 400;\n }\n"])));
|
|
637
|
+
var templateObject_1$9, templateObject_2$3, templateObject_3$1;
|
|
638
638
|
|
|
639
639
|
var shortMonths = [
|
|
640
640
|
"ЯНВ",
|
|
@@ -906,13 +906,14 @@ var Popper = forwardRef(function (props, ref) {
|
|
|
906
906
|
// TODO подумать как реализовать правильное расположение подсказки под contentRef в зависимости от placement
|
|
907
907
|
// Автоматом менять положение (верх-низ) в зависимости от того помещается или нет
|
|
908
908
|
// Распожить стрелочку к контенту посередине контента
|
|
909
|
-
return ReactDOM.createPortal(jsxs$1(Fragment$1, { children: [jsx(Global, { styles: css(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n body {\n position: relative;\n }\n "], ["\n body {\n position: relative;\n }\n "]))) }), jsx(
|
|
909
|
+
return ReactDOM.createPortal(jsxs$1(Fragment$1, { children: [jsx(Global, { styles: css(templateObject_1$2 || (templateObject_1$2 = __makeTemplateObject(["\n body {\n position: relative;\n }\n "], ["\n body {\n position: relative;\n }\n "]))) }), jsx(StyledPopperWrapper, __assign({ ref: forwardedRef, style: position, className: "KUI-Popper" }, { children: jsx(StyledPopper, __assign({ open: !!open }, other, { children: children })) }))] }), document.body);
|
|
910
910
|
});
|
|
911
|
-
var
|
|
911
|
+
var StyledPopperWrapper = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n position: absolute;\n max-width: 215px;\n @media (max-width: ", "px) {\n position: fixed;\n bottom: 24px;\n top: auto !important;\n left: 16px !important;\n width: calc(100vw - 32px);\n max-width: unset;\n }\n"], ["\n position: absolute;\n max-width: 215px;\n @media (max-width: ", "px) {\n position: fixed;\n bottom: 24px;\n top: auto !important;\n left: 16px !important;\n width: calc(100vw - 32px);\n max-width: unset;\n }\n"])), theme.breakpoints.xxs);
|
|
912
|
+
var StyledPopper = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n padding: 16px;\n border-radius: 12px;\n background: white;\n box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);\n transition: opacity 0.3s ease-out;\n opacity: ", ";\n"], ["\n padding: 16px;\n border-radius: 12px;\n background: white;\n box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);\n transition: opacity 0.3s ease-out;\n opacity: ", ";\n"])), function (_a) {
|
|
912
913
|
var open = _a.open;
|
|
913
914
|
return (open ? 1 : 0);
|
|
914
|
-
}
|
|
915
|
-
var templateObject_1$2, templateObject_2;
|
|
915
|
+
});
|
|
916
|
+
var templateObject_1$2, templateObject_2, templateObject_3;
|
|
916
917
|
|
|
917
918
|
var Tooltip = forwardRef(function (props, ref) {
|
|
918
919
|
var content = props.content, onOpen = props.onOpen, onClose = props.onClose, open = props.open, children = props.children, popper = __rest(props, ["content", "onOpen", "onClose", "open", "children"]);
|
|
@@ -933,10 +934,9 @@ var Tooltip = forwardRef(function (props, ref) {
|
|
|
933
934
|
useEffect(function () {
|
|
934
935
|
setOpen(open);
|
|
935
936
|
}, [open]);
|
|
936
|
-
|
|
937
|
-
return (jsxs$1(Fragment$1, { children: [jsx(StyledWrapper, __assign({ onMouseEnter: handleOpen, onMouseLeave: handleClose, onTouchEnd: handleOpen, ref: elemRef }, { children: children })), jsx(Popper, __assign({ open: isOpen }, popper, { contentRef: elemRef }, { children: content }))] }));
|
|
937
|
+
return (jsxs$1("div", __assign({ onMouseLeave: handleClose }, { children: [jsx(StyledContentWrapper, __assign({ onMouseEnter: handleOpen, onTouchEnd: handleOpen, ref: elemRef }, { children: children })), jsx(Popper, __assign({ open: isOpen }, popper, { contentRef: elemRef }, { children: content }))] })));
|
|
938
938
|
});
|
|
939
|
-
var
|
|
939
|
+
var StyledContentWrapper = styled.div(templateObject_1$1 || (templateObject_1$1 = __makeTemplateObject(["\n display: inline-flex;\n cursor: pointer;\n width: fit-content;\n height: fit-content;\n"], ["\n display: inline-flex;\n cursor: pointer;\n width: fit-content;\n height: fit-content;\n"])));
|
|
940
940
|
var templateObject_1$1;
|
|
941
941
|
|
|
942
942
|
var ButtonSelect = forwardRef(function (props, ref) {
|