labsense-ui-kit 1.1.50 → 1.1.52
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/Badge/IconTooltip.d.ts +22 -0
- package/dist/Badge/Tooltip.d.ts +22 -0
- package/dist/Badge/index.d.ts +2 -1
- package/dist/index.d.ts +2 -2
- package/dist/index.js +199 -122
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +199 -123
- package/dist/index.modern.js.map +1 -1
- package/package.json +1 -1
package/dist/index.modern.js
CHANGED
|
@@ -3600,8 +3600,84 @@ var Badge = function Badge(_ref4) {
|
|
|
3600
3600
|
}, text));
|
|
3601
3601
|
};
|
|
3602
3602
|
|
|
3603
|
-
var _templateObject$3;
|
|
3604
|
-
var
|
|
3603
|
+
var _templateObject$3, _templateObject2$3, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
|
|
3604
|
+
var TooltipContainer = styled.div(_templateObject$3 || (_templateObject$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n position: absolute;\n z-index: 10;\n align-items: center;\n justify-content: center;\n visibility: hidden;\n opacity: 0;\n transition: opacity 0.3s;\n border-radius: 4px;\n padding: 6px 8px;\n min-width: ", ";\n background-color: ", ";\n gap: ", ";\n\n ", "\n\n &::after {\n content: '';\n position: absolute;\n width: 16px;\n height: 8px;\n background-color: ", ";\n clip-path: polygon(50% 0%, 0% 100%, 100% 100%);\n\n ", "\n }\n"])), function (_ref) {
|
|
3605
|
+
var $minWidth = _ref.$minWidth;
|
|
3606
|
+
return $minWidth != null ? $minWidth : 'auto';
|
|
3607
|
+
}, function (_ref2) {
|
|
3608
|
+
var $background = _ref2.$background;
|
|
3609
|
+
return $background != null ? $background : colorVariables.accent.light;
|
|
3610
|
+
}, function (_ref3) {
|
|
3611
|
+
var $gap = _ref3.$gap;
|
|
3612
|
+
return $gap != null ? $gap : '16px';
|
|
3613
|
+
}, function (_ref4) {
|
|
3614
|
+
var $tooltipPosition = _ref4.$tooltipPosition,
|
|
3615
|
+
$iconSize = _ref4.$iconSize,
|
|
3616
|
+
$tooltipTop = _ref4.$tooltipTop;
|
|
3617
|
+
var vertical = $tooltipPosition.startsWith('top') ? "bottom: " + ($tooltipTop != null ? $tooltipTop : "calc(50% + " + ($iconSize + 2) + "px)") + ";" : "top: " + ($tooltipTop != null ? $tooltipTop : "calc(50% + " + ($iconSize + 2) + "px)") + ";";
|
|
3618
|
+
var horizontal = $tooltipPosition.endsWith('Left') ? css(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteralLoose(["left: calc(100% + 10px); transform: translateX(-99%);"]))) : $tooltipPosition.endsWith('Center') ? css(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteralLoose(["left: 50%; transform: translateX(-50%);"]))) : css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["right: calc(100% + 10px); transform: translateX(99%);"])));
|
|
3619
|
+
return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["", " ", ";"])), vertical, horizontal);
|
|
3620
|
+
}, function (_ref5) {
|
|
3621
|
+
var $background = _ref5.$background;
|
|
3622
|
+
return $background != null ? $background : colorVariables.accent.light;
|
|
3623
|
+
}, function (_ref6) {
|
|
3624
|
+
var $tooltipPosition = _ref6.$tooltipPosition;
|
|
3625
|
+
if ($tooltipPosition.startsWith('top')) {
|
|
3626
|
+
return $tooltipPosition.endsWith('Left') ? css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["top: 100%; right: 10px; transform: rotate(180deg);"]))) : $tooltipPosition.endsWith('Right') ? css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["top: 100%; left: 10px; transform: rotate(180deg);"]))) : css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["top: 100%; left: 50%; transform: translateX(-50%) rotate(180deg);"])));
|
|
3627
|
+
} else {
|
|
3628
|
+
return $tooltipPosition.endsWith('Left') ? css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["bottom: 100%; right: 10px;"]))) : $tooltipPosition.endsWith('Right') ? css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["bottom: 100%; left: 10px;"]))) : css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["bottom: 100%; left: 50%; transform: translateX(-50%);"])));
|
|
3629
|
+
}
|
|
3630
|
+
});
|
|
3631
|
+
var TooltipWrapper$1 = styled.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n align-items: center;\n cursor: pointer;\n\n &:hover ", " {\n visibility: visible;\n opacity: 1;\n }\n"])), TooltipContainer);
|
|
3632
|
+
var IconTooltip = function IconTooltip(_ref7) {
|
|
3633
|
+
var _tooltipCSS$position;
|
|
3634
|
+
var _ref7$icon = _ref7.icon,
|
|
3635
|
+
icon = _ref7$icon === void 0 ? {
|
|
3636
|
+
icon: 'Information',
|
|
3637
|
+
size: 12,
|
|
3638
|
+
weight: '0px',
|
|
3639
|
+
color: colorVariables.text.medium
|
|
3640
|
+
} : _ref7$icon,
|
|
3641
|
+
infoIcon = _ref7.infoIcon,
|
|
3642
|
+
infoText = _ref7.infoText,
|
|
3643
|
+
infoText2 = _ref7.infoText2,
|
|
3644
|
+
infoText3 = _ref7.infoText3,
|
|
3645
|
+
infoText4 = _ref7.infoText4,
|
|
3646
|
+
_ref7$tooltipCSS = _ref7.tooltipCSS,
|
|
3647
|
+
tooltipCSS = _ref7$tooltipCSS === void 0 ? {
|
|
3648
|
+
background: colorVariables.accent.light,
|
|
3649
|
+
color: colorVariables.text.dark,
|
|
3650
|
+
gap: '4px',
|
|
3651
|
+
minWidth: 'max-content',
|
|
3652
|
+
position: 'bottomCenter',
|
|
3653
|
+
tooltipTop: undefined,
|
|
3654
|
+
fontSize: '12px',
|
|
3655
|
+
fontWeight: '400'
|
|
3656
|
+
} : _ref7$tooltipCSS;
|
|
3657
|
+
var texts = [infoText, infoText2, infoText3, infoText4].filter(Boolean);
|
|
3658
|
+
return React.createElement(TooltipWrapper$1, null, React.createElement(Icon, Object.assign({}, icon, {
|
|
3659
|
+
onClick: function onClick() {}
|
|
3660
|
+
})), React.createElement(TooltipContainer, {
|
|
3661
|
+
"$tooltipPosition": (_tooltipCSS$position = tooltipCSS.position) != null ? _tooltipCSS$position : 'bottomCenter',
|
|
3662
|
+
"$minWidth": tooltipCSS.minWidth,
|
|
3663
|
+
"$tooltipTop": tooltipCSS.tooltipTop,
|
|
3664
|
+
"$background": tooltipCSS.background,
|
|
3665
|
+
"$gap": tooltipCSS.gap,
|
|
3666
|
+
"$iconSize": icon.size || 17
|
|
3667
|
+
}, infoIcon && React.createElement(Icon, Object.assign({}, infoIcon)), React.createElement(Container, {
|
|
3668
|
+
"$flexDirection": 'column'
|
|
3669
|
+
}, texts.map(function (text, i) {
|
|
3670
|
+
return React.createElement(Span, {
|
|
3671
|
+
key: i,
|
|
3672
|
+
"$color": tooltipCSS.color,
|
|
3673
|
+
"$fontSize": tooltipCSS.fontSize,
|
|
3674
|
+
"$fontWeight": tooltipCSS.fontWeight
|
|
3675
|
+
}, text, i < texts.length - 1 && React.createElement("br", null));
|
|
3676
|
+
}))));
|
|
3677
|
+
};
|
|
3678
|
+
|
|
3679
|
+
var _templateObject$4;
|
|
3680
|
+
var BreadCrum = styled.span(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n font-weight: 400;\n font-size: 12px;\n color: ", ";\n line-height: 100%;\n text-align: center;\n opacity: ", ";\n \n &:hover {\n text-decoration: ", ";\n cursor: ", ";\n color: ", ";\n }\n"])), function (_ref) {
|
|
3605
3681
|
var $color = _ref.$color;
|
|
3606
3682
|
return $color ? $color : colorVariables.text.medium;
|
|
3607
3683
|
}, function (_ref2) {
|
|
@@ -3667,17 +3743,17 @@ var Breadcrumbs = function Breadcrumbs(_ref6) {
|
|
|
3667
3743
|
}));
|
|
3668
3744
|
};
|
|
3669
3745
|
|
|
3670
|
-
var _templateObject$
|
|
3671
|
-
var fontFaces = css(_templateObject$
|
|
3746
|
+
var _templateObject$5;
|
|
3747
|
+
var fontFaces = css(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n @font-face {\n font-family: 'NotoSans';\n font-weight: 200;\n font-style: normal;\n src: url('./NotoSans-ExtraLight.woff') format('woff');\n font-display: fallback;\n }\n\n @font-face {\n font-family: 'NotoSans';\n font-weight: 300;\n font-style: normal;\n src: url('./NotoSans-Light.woff') format('woff');\n font-display: fallback;\n }\n @font-face {\n font-family: 'NotoSans';\n font-weight: 400;\n font-style: normal;\n src: url('./NotoSans-Regular.woff') format('woff');\n font-display: fallback;\n }\n @font-face {\n font-family: 'NotoSans';\n font-weight: 400;\n font-style: italic;\n src: url('./NotoSans-italic.woff') format('woff');\n font-display: fallback;\n }\n\n @font-face {\n font-family: 'NotoSans';\n font-weight: 500;\n font-style: normal;\n src: url('./NotoSans-Medium.woff') format('woff');\n font-display: fallback;\n }\n\n @font-face {\n font-family: 'NotoSans';\n font-weight: 600;\n font-style: normal;\n src: url('./NotoSans-SemiBold.woff') format('woff');\n font-display: fallback;\n }\n @font-face {\n font-family: 'NotoSans';\n font-weight: 700;\n font-style: normal;\n src: url('./NotoSans-Bold.woff') format('woff');\n font-display: fallback;\n }\n @font-face {\n font-family: 'NotoSans';\n font-weight: 800;\n font-style: normal;\n src: url('./NotoSans-ExtraBold.woff') format('woff');\n font-display: fallback;\n }\n"])));
|
|
3672
3748
|
var GlobalFonts = {
|
|
3673
3749
|
bold: 'NotoSans, sans-serif',
|
|
3674
3750
|
regular: 'NotoSans, sans-serif',
|
|
3675
3751
|
light: 'NotoSans, sans-serif'
|
|
3676
3752
|
};
|
|
3677
3753
|
|
|
3678
|
-
var _templateObject$
|
|
3679
|
-
var spin = keyframes(_templateObject$
|
|
3680
|
-
var Spinner = styled.div(_templateObject2$
|
|
3754
|
+
var _templateObject$6, _templateObject2$4, _templateObject3$2, _templateObject4$1, _templateObject5$1, _templateObject6$1;
|
|
3755
|
+
var spin = keyframes(_templateObject$6 || (_templateObject$6 = _taggedTemplateLiteralLoose(["\n to {\n transform: rotate(360deg);\n }\n"])));
|
|
3756
|
+
var Spinner = styled.div(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["\n width: ", "px;\n height: ", "px;\n border: ", "px solid #ddd;\n border-top-color: ", ";\n border-radius: 50%;\n animation: fadeIn 0.3s ease-in-out forwards, ", " 1s linear infinite;\n"])), function (_ref) {
|
|
3681
3757
|
var $size = _ref.$size;
|
|
3682
3758
|
return $size;
|
|
3683
3759
|
}, function (_ref2) {
|
|
@@ -3690,14 +3766,14 @@ var Spinner = styled.div(_templateObject2$3 || (_templateObject2$3 = _taggedTemp
|
|
|
3690
3766
|
var $color = _ref4.$color;
|
|
3691
3767
|
return $color;
|
|
3692
3768
|
}, spin);
|
|
3693
|
-
var LoaderWrapper = styled.div(_templateObject3$
|
|
3769
|
+
var LoaderWrapper = styled.div(_templateObject3$2 || (_templateObject3$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-left: ", ";\n margin-right: ", ";\n transition: opacity 0.3s ease-in-out;\n"])), function (_ref5) {
|
|
3694
3770
|
var $loaderPosition = _ref5.$loaderPosition;
|
|
3695
3771
|
return $loaderPosition === 'right' ? '4px' : '0';
|
|
3696
3772
|
}, function (_ref6) {
|
|
3697
3773
|
var $loaderPosition = _ref6.$loaderPosition;
|
|
3698
3774
|
return $loaderPosition === 'left' ? '4px' : '0';
|
|
3699
3775
|
});
|
|
3700
|
-
var Container$1 = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: ", ";\n gap: ", ";\n svg {\n cursor: ", ";\n }\n"])), function (_ref7) {
|
|
3776
|
+
var Container$1 = styled.div(_templateObject4$1 || (_templateObject4$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: ", ";\n gap: ", ";\n svg {\n cursor: ", ";\n }\n"])), function (_ref7) {
|
|
3701
3777
|
var $iconPosition = _ref7.$iconPosition;
|
|
3702
3778
|
return $iconPosition === 'right' ? 'row-reverse' : 'row';
|
|
3703
3779
|
}, function (_ref8) {
|
|
@@ -3707,7 +3783,7 @@ var Container$1 = styled.div(_templateObject4 || (_templateObject4 = _taggedTemp
|
|
|
3707
3783
|
var cursor = _ref9.cursor;
|
|
3708
3784
|
return cursor;
|
|
3709
3785
|
});
|
|
3710
|
-
var StyledButton = styled.button(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n pointer-events: ", ";\n cursor: ", ";\n height: max-content;\n min-height: max-content;\n width: max-content;\n box-sizing: border-box;\n border-radius: ", ";\n outline: none;\n transition: all 0.2s;\n display: flex;\n align-items: center;\n justify-content: center;\n\n padding: ", ";\n\n &:focus {\n outline: none;\n }\n\n ", "\n color: ", "; \n"])), function (_ref10) {
|
|
3786
|
+
var StyledButton = styled.button(_templateObject5$1 || (_templateObject5$1 = _taggedTemplateLiteralLoose(["\n pointer-events: ", ";\n cursor: ", ";\n height: max-content;\n min-height: max-content;\n width: max-content;\n box-sizing: border-box;\n border-radius: ", ";\n outline: none;\n transition: all 0.2s;\n display: flex;\n align-items: center;\n justify-content: center;\n\n padding: ", ";\n\n &:focus {\n outline: none;\n }\n\n ", "\n color: ", "; \n"])), function (_ref10) {
|
|
3711
3787
|
var $disabled = _ref10.$disabled;
|
|
3712
3788
|
return $disabled ? 'none' : 'auto';
|
|
3713
3789
|
}, function (_ref11) {
|
|
@@ -3753,7 +3829,7 @@ var StyledButton = styled.button(_templateObject5 || (_templateObject5 = _tagged
|
|
|
3753
3829
|
var color = _ref15.color;
|
|
3754
3830
|
return color;
|
|
3755
3831
|
});
|
|
3756
|
-
var ButtonText = styled.span(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n white-space: nowrap;\n"])), function (_ref16) {
|
|
3832
|
+
var ButtonText = styled.span(_templateObject6$1 || (_templateObject6$1 = _taggedTemplateLiteralLoose(["\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n line-height: ", ";\n white-space: nowrap;\n"])), function (_ref16) {
|
|
3757
3833
|
var $fontFamily = _ref16.$fontFamily;
|
|
3758
3834
|
return $fontFamily ? $fontFamily : GlobalFonts.bold;
|
|
3759
3835
|
}, function (_ref17) {
|
|
@@ -3854,8 +3930,8 @@ var ButtonComponent = function ButtonComponent(_ref20) {
|
|
|
3854
3930
|
})));
|
|
3855
3931
|
};
|
|
3856
3932
|
|
|
3857
|
-
var _templateObject$
|
|
3858
|
-
var InnerContent = styled.div(_templateObject$
|
|
3933
|
+
var _templateObject$7;
|
|
3934
|
+
var InnerContent = styled.div(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteralLoose(["\n display: flex;\n gap: 12px;\n overflow-x: auto;\n scroll-behavior: smooth;\n scrollbar-width: none;\n ms-overflow-style: none;\n white-space: nowrap;\n padding: ", "; \n margin: 0 10px;\n"])), function (_ref) {
|
|
3859
3935
|
var $isScrollable = _ref.$isScrollable;
|
|
3860
3936
|
return $isScrollable ? '0 12px' : '0';
|
|
3861
3937
|
});
|
|
@@ -4086,19 +4162,19 @@ var timeStringToSeconds = function timeStringToSeconds(timeString) {
|
|
|
4086
4162
|
return hours * 3600 + minutes * 60 + seconds;
|
|
4087
4163
|
};
|
|
4088
4164
|
|
|
4089
|
-
var _templateObject$
|
|
4090
|
-
var DatePickerContainer = styled.div(_templateObject$
|
|
4091
|
-
var CalendarContainer = styled.div(_templateObject2$
|
|
4092
|
-
var Calendar$1 = styled.div(_templateObject3$
|
|
4093
|
-
var CalendarTime = styled.div(_templateObject4$
|
|
4094
|
-
var StartDate = styled.div(_templateObject5$
|
|
4095
|
-
var SelectedStart = styled.div(_templateObject6$
|
|
4096
|
-
var CurrentDate = styled.p(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n font-family: NotoSans, sans-serif;\n font-weight: 400;\n font-size: 12px;\n"])));
|
|
4097
|
-
var CurrentTime = styled.div(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n font-family: NotoSans, sans-serif;\n font-weight: 500;\n font-size: 14px;\n color: ", ";\n"])), colorVariables.text.medium);
|
|
4098
|
-
var Selectedtime = styled.div(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n color: ", ";\n gap: 8px;\n"])), colorVariables.text.medium);
|
|
4099
|
-
var Line = styled.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n width: 100%;\n padding-top: 10px;\n padding-bottom: 10px;\n"])));
|
|
4100
|
-
var Zones = styled.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n"])));
|
|
4101
|
-
var CalendarHeader = styled.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 10px;\n"])));
|
|
4165
|
+
var _templateObject$8, _templateObject2$5, _templateObject3$3, _templateObject4$2, _templateObject5$2, _templateObject6$2, _templateObject7$1, _templateObject8$1, _templateObject9$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
|
|
4166
|
+
var DatePickerContainer = styled.div(_templateObject$8 || (_templateObject$8 = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n flex-direction: column;\n position: relative;\n"])));
|
|
4167
|
+
var CalendarContainer = styled.div(_templateObject2$5 || (_templateObject2$5 = _taggedTemplateLiteralLoose(["\n overflow: auto;\n display: flex;\n flex-direction: row;\n background: rgba(245, 248, 250, .95); \n position: absolute;\n border: 1px solid ", ";\n height: auto;\n width: auto;\n border-radius: 10px;\n z-index: 10;\n padding: 10px;\n top: 0px;\n right: 0px;\n gap: 16px;\n"])), colorVariables.border.medium);
|
|
4168
|
+
var Calendar$1 = styled.div(_templateObject3$3 || (_templateObject3$3 = _taggedTemplateLiteralLoose([""])));
|
|
4169
|
+
var CalendarTime = styled.div(_templateObject4$2 || (_templateObject4$2 = _taggedTemplateLiteralLoose(["\n border: 1px solid ", ";\n border-radius: 4px;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 8px;\n"])), colorVariables.border.medium);
|
|
4170
|
+
var StartDate = styled.div(_templateObject5$2 || (_templateObject5$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 16px;\n padding-bottom: 4px;\n"])));
|
|
4171
|
+
var SelectedStart = styled.div(_templateObject6$2 || (_templateObject6$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n gap: 4px;\n color: ", ";\n"])), colorVariables.text.medium);
|
|
4172
|
+
var CurrentDate = styled.p(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n font-family: NotoSans, sans-serif;\n font-weight: 400;\n font-size: 12px;\n"])));
|
|
4173
|
+
var CurrentTime = styled.div(_templateObject8$1 || (_templateObject8$1 = _taggedTemplateLiteralLoose(["\n font-family: NotoSans, sans-serif;\n font-weight: 500;\n font-size: 14px;\n color: ", ";\n"])), colorVariables.text.medium);
|
|
4174
|
+
var Selectedtime = styled.div(_templateObject9$1 || (_templateObject9$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n justify-content: flex-start;\n color: ", ";\n gap: 8px;\n"])), colorVariables.text.medium);
|
|
4175
|
+
var Line = styled.div(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteralLoose(["\n width: 100%;\n padding-top: 10px;\n padding-bottom: 10px;\n"])));
|
|
4176
|
+
var Zones = styled.div(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n"])));
|
|
4177
|
+
var CalendarHeader = styled.div(_templateObject12$1 || (_templateObject12$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 10px;\n"])));
|
|
4102
4178
|
var CalendarMonthYear = styled.span(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n color: ", ";\n justify-content: center;\n align-items: center;\n"])), colorVariables.text.medium);
|
|
4103
4179
|
var CalendarContent = styled.div(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(7, 1fr);\n gap: 5px;\n padding: 10px;\n"])));
|
|
4104
4180
|
var Button = styled.div(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n background:", ";\n color: ", ";\n border: none;\n border-radius: 5px;\n padding: 5px 10px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n width: ", ";\n height: ", ";\n\n svg {\n cursor: pointer;\n }\n"])), colorVariables["default"].secondary, colorVariables.text.white, function (_ref) {
|
|
@@ -4374,14 +4450,14 @@ var DatePicker = function DatePicker(_ref10) {
|
|
|
4374
4450
|
}))))), React.createElement(Line, null, React.createElement("hr", null)), React.createElement(Zones, null, React.createElement(CurrentTime, null, t('TimePicker_Zone')), React.createElement(CurrentTime, null, getSystemTimezoneAbbreviation())))));
|
|
4375
4451
|
};
|
|
4376
4452
|
|
|
4377
|
-
var _templateObject$
|
|
4378
|
-
var OptionContainer = styled.div(_templateObject$
|
|
4379
|
-
var OptionItem = styled.div(_templateObject2$
|
|
4453
|
+
var _templateObject$9, _templateObject2$6, _templateObject3$4, _templateObject4$3, _templateObject5$3, _templateObject6$3;
|
|
4454
|
+
var OptionContainer = styled.div(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteralLoose([""])));
|
|
4455
|
+
var OptionItem = styled.div(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteralLoose(["\n border-bottom: ", ";\n"])), function (_ref) {
|
|
4380
4456
|
var $optionBorder = _ref.$optionBorder,
|
|
4381
4457
|
$isborder = _ref.$isborder;
|
|
4382
4458
|
return $isborder ? $optionBorder || "1px solid " + colorVariables.border.extraLight : '';
|
|
4383
4459
|
});
|
|
4384
|
-
var OptionLabel = styled.label(_templateObject3$
|
|
4460
|
+
var OptionLabel = styled.label(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n display: flex;\n gap: 8px;\n padding: 8px 12px;\n word-break: break-word;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n font-family: NotoSans, sans-serif;\n font-weight: 500;\n font-size: 14px;\n line-height: 14px;\n color: ", ";\n"])), function (_ref2) {
|
|
4385
4461
|
var $optionColor = _ref2.$optionColor;
|
|
4386
4462
|
switch ($optionColor) {
|
|
4387
4463
|
case 'dark':
|
|
@@ -4404,7 +4480,7 @@ var OptionLabel = styled.label(_templateObject3$3 || (_templateObject3$3 = _tagg
|
|
|
4404
4480
|
return $optionColor || colorVariables.text.medium;
|
|
4405
4481
|
}
|
|
4406
4482
|
});
|
|
4407
|
-
var SearchContainer = styled.div(_templateObject4$
|
|
4483
|
+
var SearchContainer = styled.div(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: auto;\n background: ", ";\n border-bottom: ", ";\n border-radius: ", ";\n padding: 8px 8px;\n display: flex;\n align-items: center;\n gap: 8px;\n"])), function (_ref3) {
|
|
4408
4484
|
var $background = _ref3.$background;
|
|
4409
4485
|
switch ($background) {
|
|
4410
4486
|
case 'dark':
|
|
@@ -4433,7 +4509,7 @@ var SearchContainer = styled.div(_templateObject4$2 || (_templateObject4$2 = _ta
|
|
|
4433
4509
|
var $borderRadius = _ref5.$borderRadius;
|
|
4434
4510
|
return $borderRadius || '8px';
|
|
4435
4511
|
});
|
|
4436
|
-
var SearchBar = styled.input(_templateObject5$
|
|
4512
|
+
var SearchBar = styled.input(_templateObject5$3 || (_templateObject5$3 = _taggedTemplateLiteralLoose(["\n border: none;\n outline: none;\n width: 100%;\n font-family: NotoSans, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 14px;\n background: ", ";\n color: ", ";\n &::placeholder {\n color: ", ";\n font-style: italic;\n }\n"])), colorVariables["default"].tertiary, function (_ref6) {
|
|
4437
4513
|
var $inputColor = _ref6.$inputColor;
|
|
4438
4514
|
switch ($inputColor) {
|
|
4439
4515
|
case 'dark':
|
|
@@ -4478,7 +4554,7 @@ var SearchBar = styled.input(_templateObject5$2 || (_templateObject5$2 = _tagged
|
|
|
4478
4554
|
return $placeholderColor;
|
|
4479
4555
|
}
|
|
4480
4556
|
});
|
|
4481
|
-
var Text = styled.span(_templateObject6$
|
|
4557
|
+
var Text = styled.span(_templateObject6$3 || (_templateObject6$3 = _taggedTemplateLiteralLoose(["\n word-break: break-word;\n"])));
|
|
4482
4558
|
var OptionComponent = function OptionComponent(_ref8) {
|
|
4483
4559
|
var options = _ref8.options,
|
|
4484
4560
|
selectedOptions = _ref8.selectedOptions,
|
|
@@ -4556,8 +4632,8 @@ var OptionComponent = function OptionComponent(_ref8) {
|
|
|
4556
4632
|
}, NoOptionsText))));
|
|
4557
4633
|
};
|
|
4558
4634
|
|
|
4559
|
-
var _templateObject$
|
|
4560
|
-
var DropdownContainer = styled.div(_templateObject$
|
|
4635
|
+
var _templateObject$a, _templateObject2$7, _templateObject3$5, _templateObject4$4, _templateObject5$4, _templateObject6$4, _templateObject7$2, _templateObject8$2, _templateObject9$2, _templateObject10$2, _templateObject11$2;
|
|
4636
|
+
var DropdownContainer = styled.div(_templateObject$a || (_templateObject$a = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n max-width: 100%;\n position: relative;\n max-height: ", ";\n"])), function (_ref) {
|
|
4561
4637
|
var $width = _ref.$width;
|
|
4562
4638
|
return $width || '100%';
|
|
4563
4639
|
}, function (_ref2) {
|
|
@@ -4567,7 +4643,7 @@ var DropdownContainer = styled.div(_templateObject$9 || (_templateObject$9 = _ta
|
|
|
4567
4643
|
var $replaceLabel = _ref3.$replaceLabel;
|
|
4568
4644
|
return $replaceLabel ? 'calc(100% - 22px)' : '';
|
|
4569
4645
|
});
|
|
4570
|
-
var DropdownButton = styled.div(_templateObject2$
|
|
4646
|
+
var DropdownButton = styled.div(_templateObject2$7 || (_templateObject2$7 = _taggedTemplateLiteralLoose(["\n overflow: ", ";\n padding: ", ";\n gap: 8px;\n box-sizing: border-box;\n transition: all 0.3s ease;\n width: ", ";\n height: ", ";\n border: ", ";\n border-radius: ", ";\n display: flex;\n justify-content: space-between;\n align-items: center;\n cursor: ", ";\n background: ", ";\n color: ", ";\n font-family: NotoSans, sans-serif;\n font-weight: 400;\n font-size: ", ";\n line-height: ", ";\n"])), function (_ref4) {
|
|
4571
4647
|
var $replaceLabel = _ref4.$replaceLabel;
|
|
4572
4648
|
return $replaceLabel ? 'auto' : '';
|
|
4573
4649
|
}, function (_ref5) {
|
|
@@ -4643,7 +4719,7 @@ var DropdownButton = styled.div(_templateObject2$6 || (_templateObject2$6 = _tag
|
|
|
4643
4719
|
return '14px';
|
|
4644
4720
|
}
|
|
4645
4721
|
});
|
|
4646
|
-
var TitleText = styled.div(_templateObject3$
|
|
4722
|
+
var TitleText = styled.div(_templateObject3$5 || (_templateObject3$5 = _taggedTemplateLiteralLoose(["\n width: max-content;\n position: relative;\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n\n color: ", ";\n"])), function (_ref15) {
|
|
4647
4723
|
var $titleWeight = _ref15.$titleWeight;
|
|
4648
4724
|
return $titleWeight != null ? $titleWeight : '500';
|
|
4649
4725
|
}, function (_ref16) {
|
|
@@ -4677,12 +4753,12 @@ var TitleText = styled.div(_templateObject3$4 || (_templateObject3$4 = _taggedTe
|
|
|
4677
4753
|
return $titleColor;
|
|
4678
4754
|
}
|
|
4679
4755
|
});
|
|
4680
|
-
var Container$2 = styled.div(_templateObject4$
|
|
4681
|
-
var LabelText = styled.div(_templateObject5$
|
|
4756
|
+
var Container$2 = styled.div(_templateObject4$4 || (_templateObject4$4 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n width: 100%;\n gap: 8px;\n"])));
|
|
4757
|
+
var LabelText = styled.div(_templateObject5$4 || (_templateObject5$4 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 400;\n font-style:", ";\n color: ", ";\n"])), function (_ref19) {
|
|
4682
4758
|
var $labelStyle = _ref19.$labelStyle;
|
|
4683
4759
|
return $labelStyle;
|
|
4684
4760
|
}, colorVariables.text.medium);
|
|
4685
|
-
var DropdownMenu = styled.div(_templateObject6$
|
|
4761
|
+
var DropdownMenu = styled.div(_templateObject6$4 || (_templateObject6$4 = _taggedTemplateLiteralLoose(["\n max-height: 156px;\n padding: 4px;\n box-sizing: border-box;\n border: 1px solid ", ";\n border-radius: ", ";\n width: ", ";\n background: ", ";\n display: flex;\n flex-direction: column;\n gap: 4px;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n margin-top: 8px;\n overflow-y: auto;\n position: absolute;\n z-index: 2;\n scrollbar-width: thin;\n"])), colorVariables.border.light, function (_ref20) {
|
|
4686
4762
|
var $optionsBorderRadius = _ref20.$optionsBorderRadius;
|
|
4687
4763
|
return $optionsBorderRadius || '8px';
|
|
4688
4764
|
}, function (_ref21) {
|
|
@@ -4692,8 +4768,8 @@ var DropdownMenu = styled.div(_templateObject6$3 || (_templateObject6$3 = _tagge
|
|
|
4692
4768
|
var $menuBackground = _ref22.$menuBackground;
|
|
4693
4769
|
return $menuBackground || colorVariables.accent.extraLight;
|
|
4694
4770
|
});
|
|
4695
|
-
var SelectedOptionsWrapper = styled.div(_templateObject7$
|
|
4696
|
-
var SelectedOptionDiv = styled.div(_templateObject8$
|
|
4771
|
+
var SelectedOptionsWrapper = styled.div(_templateObject7$2 || (_templateObject7$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n height: 100%;\n"])));
|
|
4772
|
+
var SelectedOptionDiv = styled.div(_templateObject8$2 || (_templateObject8$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n background: ", ";\n border-radius: 4px;\n padding: 6px 8px;\n box-sizing: border-box;\n gap: 6px;\n font-family: NotoSans, sans-serif;\n font-style: normal;\n font-weight: 400;\n font-size: 12px;\n line-height: 12px;\n color: ", ";\n"])), function (_ref23) {
|
|
4697
4773
|
var $selectedOptionBackground = _ref23.$selectedOptionBackground,
|
|
4698
4774
|
$disabled = _ref23.$disabled;
|
|
4699
4775
|
switch ($selectedOptionBackground) {
|
|
@@ -4739,7 +4815,7 @@ var SelectedOptionDiv = styled.div(_templateObject8$1 || (_templateObject8$1 = _
|
|
|
4739
4815
|
return $selectedOptionColor;
|
|
4740
4816
|
}
|
|
4741
4817
|
});
|
|
4742
|
-
var RemoveIcon = styled.div(_templateObject9$
|
|
4818
|
+
var RemoveIcon = styled.div(_templateObject9$2 || (_templateObject9$2 = _taggedTemplateLiteralLoose(["\n width: 14px;\n height: 14px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: ", ";\n border-radius: 50%;\n box-sizing: border-box;\n background: ", ";\n > div {\n cursor: ", ";\n }\n"])), function (_ref25) {
|
|
4743
4819
|
var $disabled = _ref25.$disabled;
|
|
4744
4820
|
return $disabled ? 'not-allowed' : 'pointer';
|
|
4745
4821
|
}, function (_ref26) {
|
|
@@ -4750,8 +4826,8 @@ var RemoveIcon = styled.div(_templateObject9$1 || (_templateObject9$1 = _taggedT
|
|
|
4750
4826
|
var $disabled = _ref27.$disabled;
|
|
4751
4827
|
return $disabled ? 'not-allowed' : 'pointer';
|
|
4752
4828
|
});
|
|
4753
|
-
var TextWrapper = styled.div(_templateObject10$
|
|
4754
|
-
var Asterisk = styled.span(_templateObject11$
|
|
4829
|
+
var TextWrapper = styled.div(_templateObject10$2 || (_templateObject10$2 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: 4px;\n"])));
|
|
4830
|
+
var Asterisk = styled.span(_templateObject11$2 || (_templateObject11$2 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-size: 10px;\n height: fit-content;\n position: absolute;\n top: -2px;\n right: -8px;\n"])), colorVariables["default"].error);
|
|
4755
4831
|
var MultiSelectDropdown = function MultiSelectDropdown(_ref28) {
|
|
4756
4832
|
var title = _ref28.title,
|
|
4757
4833
|
titleWeight = _ref28.titleWeight,
|
|
@@ -4909,9 +4985,9 @@ var MultiSelectDropdown = function MultiSelectDropdown(_ref28) {
|
|
|
4909
4985
|
}))));
|
|
4910
4986
|
};
|
|
4911
4987
|
|
|
4912
|
-
var _templateObject$
|
|
4913
|
-
var SelectedOptionsWrapper$1 = styled.div(_templateObject$
|
|
4914
|
-
var SelectedOptionDiv$1 = styled.div(_templateObject2$
|
|
4988
|
+
var _templateObject$b, _templateObject2$8, _templateObject3$6;
|
|
4989
|
+
var SelectedOptionsWrapper$1 = styled.div(_templateObject$b || (_templateObject$b = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n"])));
|
|
4990
|
+
var SelectedOptionDiv$1 = styled.div(_templateObject2$8 || (_templateObject2$8 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n background: ", ";\n border-radius: 4px;\n padding: 6px 8px;\n box-sizing: border-box;\n gap: 6px;\n font-family: NotoSans, sans-serif;\n font-style: normal;\n font-weight: 400;\n font-size: 12px;\n line-height: 12px;\n color: ", ";\n"])), function (_ref) {
|
|
4915
4991
|
var $selectedOptionBackground = _ref.$selectedOptionBackground,
|
|
4916
4992
|
$type = _ref.$type;
|
|
4917
4993
|
return $selectedOptionBackground || $type === 'remove' ? colorVariables.disabled.error : colorVariables.accent.softBlue;
|
|
@@ -4920,7 +4996,7 @@ var SelectedOptionDiv$1 = styled.div(_templateObject2$7 || (_templateObject2$7 =
|
|
|
4920
4996
|
$type = _ref2.$type;
|
|
4921
4997
|
return $selectedOptionColor || $type === 'remove' ? colorVariables["default"].error : colorVariables.brand.primary;
|
|
4922
4998
|
});
|
|
4923
|
-
var RemoveIcon$1 = styled.div(_templateObject3$
|
|
4999
|
+
var RemoveIcon$1 = styled.div(_templateObject3$6 || (_templateObject3$6 = _taggedTemplateLiteralLoose(["\n width: 14px;\n height: 14px;\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border-radius: 50%;\n box-sizing: border-box;\n background: ", ";\n"])), function (_ref3) {
|
|
4924
5000
|
var $removeIconBackground = _ref3.$removeIconBackground,
|
|
4925
5001
|
$type = _ref3.$type;
|
|
4926
5002
|
return $removeIconBackground || $type === 'remove' ? '#5E5E5E24' : colorVariables.disabled.primary;
|
|
@@ -4971,8 +5047,8 @@ var SelectedOption = function SelectedOption(_ref4) {
|
|
|
4971
5047
|
}));
|
|
4972
5048
|
};
|
|
4973
5049
|
|
|
4974
|
-
var _templateObject$
|
|
4975
|
-
var TitleText$1 = styled.label(_templateObject$
|
|
5050
|
+
var _templateObject$c, _templateObject2$9, _templateObject3$7, _templateObject4$5, _templateObject5$5, _templateObject6$5, _templateObject7$3, _templateObject8$3, _templateObject9$3, _templateObject10$3;
|
|
5051
|
+
var TitleText$1 = styled.label(_templateObject$c || (_templateObject$c = _taggedTemplateLiteralLoose(["\n position: relative;\n width: max-content;\n white-space: nowrap;\n font-weight: ", ";\n ", "\n\n color: ", ";\n"])), function (_ref) {
|
|
4976
5052
|
var $titleWeight = _ref.$titleWeight;
|
|
4977
5053
|
return $titleWeight || 500;
|
|
4978
5054
|
}, function (_ref2) {
|
|
@@ -5010,11 +5086,11 @@ var TitleText$1 = styled.label(_templateObject$b || (_templateObject$b = _tagged
|
|
|
5010
5086
|
return $titlecolor;
|
|
5011
5087
|
}
|
|
5012
5088
|
});
|
|
5013
|
-
var DropdownContainer$1 = styled.div(_templateObject2$
|
|
5089
|
+
var DropdownContainer$1 = styled.div(_templateObject2$9 || (_templateObject2$9 = _taggedTemplateLiteralLoose(["\n width: ", ";\n max-width: 100%;\n position: relative;\n gap: 8px;\n display: flex;\n"])), function (_ref4) {
|
|
5014
5090
|
var $width = _ref4.$width;
|
|
5015
5091
|
return $width || '100%';
|
|
5016
5092
|
});
|
|
5017
|
-
var DropdownButton$1 = styled.div(_templateObject3$
|
|
5093
|
+
var DropdownButton$1 = styled.div(_templateObject3$7 || (_templateObject3$7 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n cursor: ", ";\n font-family: NotoSans, sans-serif;\n font-weight: 400;\n width: ", ";\n height: ", ";\n border-radius: ", ";\n transition: all 0.3s ease;\n border: ", ";\n gap: 6px;\n padding: ", ";\n background: ", ";\n font-size: ", ";\n line-height: ", ";\n"])), function (_ref5) {
|
|
5018
5094
|
var $disabled = _ref5.$disabled;
|
|
5019
5095
|
return $disabled ? 'not-allowed' : 'pointer';
|
|
5020
5096
|
}, function (_ref6) {
|
|
@@ -5065,7 +5141,7 @@ var DropdownButton$1 = styled.div(_templateObject3$6 || (_templateObject3$6 = _t
|
|
|
5065
5141
|
return '14px';
|
|
5066
5142
|
}
|
|
5067
5143
|
});
|
|
5068
|
-
var Options = styled.div(_templateObject4$
|
|
5144
|
+
var Options = styled.div(_templateObject4$5 || (_templateObject4$5 = _taggedTemplateLiteralLoose(["\n color: ", ";\n padding: 5px 10px;\n width: 100%;\n font-size: ", ";\n font-weight: ", ";\n background-color: ", ";\n\n \n &:hover {\n background-color: ", ";\n color: ", ";\n cursor: pointer;\n\n }\n\n"])), function (_ref14) {
|
|
5069
5145
|
var $optionColor = _ref14.$optionColor,
|
|
5070
5146
|
$optionSelected = _ref14.$optionSelected;
|
|
5071
5147
|
return $optionSelected ? colorVariables.text.white : $optionColor || colorVariables.text.medium;
|
|
@@ -5080,7 +5156,7 @@ var Options = styled.div(_templateObject4$4 || (_templateObject4$4 = _taggedTemp
|
|
|
5080
5156
|
$optionSelected = _ref17.$optionSelected;
|
|
5081
5157
|
return $optionSelected ? colorVariables["default"].primary : $optionBackgroundColor || colorVariables["default"].tertiary;
|
|
5082
5158
|
}, colorVariables.hover.primary, colorVariables.text.white);
|
|
5083
|
-
var LabelText$1 = styled.div(_templateObject5$
|
|
5159
|
+
var LabelText$1 = styled.div(_templateObject5$5 || (_templateObject5$5 = _taggedTemplateLiteralLoose(["\n font-size: ", ";\n line-height: ", ";\n font-style: ", ";\n color: ", ";\n"])), function (_ref18) {
|
|
5084
5160
|
var $size = _ref18.$size;
|
|
5085
5161
|
switch ($size) {
|
|
5086
5162
|
case 'small':
|
|
@@ -5108,8 +5184,8 @@ var LabelText$1 = styled.div(_templateObject5$4 || (_templateObject5$4 = _tagged
|
|
|
5108
5184
|
$disabled = _ref21.$disabled;
|
|
5109
5185
|
return $disabled ? colorVariables.text.medium : $color || colorVariables.text.medium;
|
|
5110
5186
|
});
|
|
5111
|
-
var NoOptions = styled(Span)(_templateObject6$
|
|
5112
|
-
var DropdownMenu$1 = styled.div(_templateObject7$
|
|
5187
|
+
var NoOptions = styled(Span)(_templateObject6$5 || (_templateObject6$5 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n height: 100%;\n padding: 12px;\n font-size: 14px;\n font-weight: 400;\n"])));
|
|
5188
|
+
var DropdownMenu$1 = styled.div(_templateObject7$3 || (_templateObject7$3 = _taggedTemplateLiteralLoose(["\n height: auto;\n max-height: 170px;\n border: 1px solid ", ";\n border-radius: ", ";\n min-width: 100%;\n width: ", ";\n background: ", ";\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n overflow: hidden; \n position: absolute;\n z-index: 1;\n ", "\n ", "\n \n"])), colorVariables.border.light, function (_ref22) {
|
|
5113
5189
|
var $optionsBorderRadius = _ref22.$optionsBorderRadius;
|
|
5114
5190
|
return $optionsBorderRadius || '8px';
|
|
5115
5191
|
}, function (_ref23) {
|
|
@@ -5125,8 +5201,8 @@ var DropdownMenu$1 = styled.div(_templateObject7$2 || (_templateObject7$2 = _tag
|
|
|
5125
5201
|
var $bottom = _ref26.$bottom;
|
|
5126
5202
|
return $bottom && "bottom: " + $bottom + ";";
|
|
5127
5203
|
});
|
|
5128
|
-
var OptionsWrapper = styled.div(_templateObject8$
|
|
5129
|
-
var SearchContainer$1 = styled.div(_templateObject9$
|
|
5204
|
+
var OptionsWrapper = styled.div(_templateObject8$3 || (_templateObject8$3 = _taggedTemplateLiteralLoose(["\n max-height: 150px; \n overflow-y: auto;\n scrollbar-width: thin;\n width: 100%;\n"])));
|
|
5205
|
+
var SearchContainer$1 = styled.div(_templateObject9$3 || (_templateObject9$3 = _taggedTemplateLiteralLoose(["\n width: 100%;\n background: ", ";\n border: ", ";\n border-bottom: 1px solid ", ";\n border-radius: ", ";\n padding: 10px 12px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n gap: 8px;\n position: sticky;\n top: 0;\n z-index: 10; \n"])), function (_ref27) {
|
|
5130
5206
|
var $background = _ref27.$background;
|
|
5131
5207
|
return $background || colorVariables.accent.extraLight;
|
|
5132
5208
|
}, function (_ref28) {
|
|
@@ -5136,7 +5212,7 @@ var SearchContainer$1 = styled.div(_templateObject9$2 || (_templateObject9$2 = _
|
|
|
5136
5212
|
var $borderRadius = _ref29.$borderRadius;
|
|
5137
5213
|
return $borderRadius || '8px 8px 0 0';
|
|
5138
5214
|
});
|
|
5139
|
-
var SearchBar$1 = styled.input(_templateObject10$
|
|
5215
|
+
var SearchBar$1 = styled.input(_templateObject10$3 || (_templateObject10$3 = _taggedTemplateLiteralLoose(["\n border: none;\n width: 100%;\n font-family: NotoSans, sans-serif;\n font-weight: 400;\n font-style: normal;\n font-size: 14px;\n line-height: normal;\n background: transparent;\n color: ", ";\n outline: none;\n \n &::placeholder {\n color: ", ";\n font-style: italic;\n }\n"])), function (_ref30) {
|
|
5140
5216
|
var $inputColor = _ref30.$inputColor;
|
|
5141
5217
|
return $inputColor || colorVariables.text.medium;
|
|
5142
5218
|
}, function (_ref31) {
|
|
@@ -5367,9 +5443,9 @@ var useClickOutside = function useClickOutside(elRef, elCallback) {
|
|
|
5367
5443
|
}, [elCallback, elRef]);
|
|
5368
5444
|
};
|
|
5369
5445
|
|
|
5370
|
-
var _templateObject$
|
|
5371
|
-
var ModalOverlay = styled.div(_templateObject$
|
|
5372
|
-
var ModalContainer = styled.div(_templateObject2$
|
|
5446
|
+
var _templateObject$d, _templateObject2$a;
|
|
5447
|
+
var ModalOverlay = styled.div(_templateObject$d || (_templateObject$d = _taggedTemplateLiteralLoose(["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.5);\n display: flex;\n align-items: center;\n justify-content: center;\n font-family: NotoSans, sans-serif;\n z-index: 9999;\n backdrop-filter: blur(4px);\n"])));
|
|
5448
|
+
var ModalContainer = styled.div(_templateObject2$a || (_templateObject2$a = _taggedTemplateLiteralLoose(["\n background: ", ";\n box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);\n border-radius: 8px;\n max-height: 100vh;\n max-width: ", ";\n overflow: visible;\n"])), colorVariables.accent.light, function (_ref) {
|
|
5373
5449
|
var $maxWidth = _ref.$maxWidth;
|
|
5374
5450
|
return $maxWidth ? $maxWidth : '400px';
|
|
5375
5451
|
});
|
|
@@ -5477,8 +5553,8 @@ var useNotification = function useNotification() {
|
|
|
5477
5553
|
};
|
|
5478
5554
|
};
|
|
5479
5555
|
|
|
5480
|
-
var _templateObject$
|
|
5481
|
-
var SearchContainer$2 = styled.div(_templateObject$
|
|
5556
|
+
var _templateObject$e, _templateObject2$b;
|
|
5557
|
+
var SearchContainer$2 = styled.div(_templateObject$e || (_templateObject$e = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: 100%;\n background: ", ";\n border: ", ";\n border-radius: ", ";\n padding: 5.5px 8px;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: ", ";\n transition: all 0.3s ease;\n\n &:focus-within {\n border: 1px solid ", ";\n }\n"])), function (_ref) {
|
|
5482
5558
|
var $background = _ref.$background;
|
|
5483
5559
|
return $background || colorVariables["default"].tertiary;
|
|
5484
5560
|
}, function (_ref2) {
|
|
@@ -5491,7 +5567,7 @@ var SearchContainer$2 = styled.div(_templateObject$d || (_templateObject$d = _ta
|
|
|
5491
5567
|
var $disabled = _ref4.$disabled;
|
|
5492
5568
|
return $disabled ? 'not-allowed' : 'pointer';
|
|
5493
5569
|
}, colorVariables.text.dark);
|
|
5494
|
-
var SearchBar$2 = styled.input(_templateObject2$
|
|
5570
|
+
var SearchBar$2 = styled.input(_templateObject2$b || (_templateObject2$b = _taggedTemplateLiteralLoose(["\n border: none;\n width: 100%;\n font-family: NotoSans, sans-serif;\n font-weight: 400;\n font-style: normal;\n font-size: 14px;\n line-height: normal;\n background: ", ";\n color: ", ";\n &::placeholder {\n color: ", ";\n font-style: italic;\n position: absolute;\n top: 1px;\n }\n"])), colorVariables["default"].tertiary, function (_ref5) {
|
|
5495
5571
|
var $inputColor = _ref5.$inputColor;
|
|
5496
5572
|
return $inputColor || colorVariables.text.medium;
|
|
5497
5573
|
}, function (_ref6) {
|
|
@@ -5541,8 +5617,8 @@ var SearchBox = function SearchBox(_ref7) {
|
|
|
5541
5617
|
}));
|
|
5542
5618
|
};
|
|
5543
5619
|
|
|
5544
|
-
var _templateObject$
|
|
5545
|
-
var Label = styled.label(_templateObject$
|
|
5620
|
+
var _templateObject$f, _templateObject2$c, _templateObject3$8, _templateObject4$6, _templateObject5$6;
|
|
5621
|
+
var Label = styled.label(_templateObject$f || (_templateObject$f = _taggedTemplateLiteralLoose(["\n cursor: auto;\n width: 100%;\n font-weight: ", ";\n position: relative;\n white-space: nowrap;\n width: max-content;\n\n ", "\n\n color: ", ";\n"])), function (_ref) {
|
|
5546
5622
|
var $fontWeight = _ref.$fontWeight;
|
|
5547
5623
|
return $fontWeight != null ? $fontWeight : '500';
|
|
5548
5624
|
}, function (_ref2) {
|
|
@@ -5580,7 +5656,7 @@ var Label = styled.label(_templateObject$e || (_templateObject$e = _taggedTempla
|
|
|
5580
5656
|
return $titlecolor;
|
|
5581
5657
|
}
|
|
5582
5658
|
});
|
|
5583
|
-
var Input = styled.input(_templateObject2$
|
|
5659
|
+
var Input = styled.input(_templateObject2$c || (_templateObject2$c = _taggedTemplateLiteralLoose(["\n width: 100%;\n border: 1px solid ", ";\n border-radius: 8px;\n cursor: ", ";\n background: ", ";\n transition: all 0.3s ease;\n color: ", ";\n pointer-events: ", ";\n\n ", "\n\n &:focus {\n border: 1px solid\n ", ";\n }\n\n &::placeholder {\n color: ", ";\n font-style: italic;\n font-family: NotoSans, sans-serif;\n }\n"])), colorVariables.border.light, function (_ref4) {
|
|
5584
5660
|
var $disabled = _ref4.$disabled;
|
|
5585
5661
|
return $disabled ? 'not-allowed' : 'auto';
|
|
5586
5662
|
}, function (_ref5) {
|
|
@@ -5629,12 +5705,12 @@ var Input = styled.input(_templateObject2$b || (_templateObject2$b = _taggedTemp
|
|
|
5629
5705
|
return $color;
|
|
5630
5706
|
}
|
|
5631
5707
|
}, colorVariables.text.light);
|
|
5632
|
-
var InputWrapper$1 = styled.div(_templateObject3$
|
|
5633
|
-
var IconWrapper$1 = styled.div(_templateObject4$
|
|
5708
|
+
var InputWrapper$1 = styled.div(_templateObject3$8 || (_templateObject3$8 = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n"])));
|
|
5709
|
+
var IconWrapper$1 = styled.div(_templateObject4$6 || (_templateObject4$6 = _taggedTemplateLiteralLoose(["\n position: absolute;\n right: 12px;\n cursor: pointer;\n\n > div {\n cursor: ", ";\n }\n"])), function (_ref10) {
|
|
5634
5710
|
var $disabled = _ref10.$disabled;
|
|
5635
5711
|
return $disabled ? 'not-allowed' : 'pointer';
|
|
5636
5712
|
});
|
|
5637
|
-
var Asterisk$1 = styled.span(_templateObject5$
|
|
5713
|
+
var Asterisk$1 = styled.span(_templateObject5$6 || (_templateObject5$6 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-size: 10px;\n height: fit-content;\n position: absolute;\n top: -2px;\n right: -8px;\n"])), colorVariables["default"].error);
|
|
5638
5714
|
var TextField = function TextField(_ref11) {
|
|
5639
5715
|
var _ref11$type = _ref11.type,
|
|
5640
5716
|
type = _ref11$type === void 0 ? 'text' : _ref11$type,
|
|
@@ -5733,12 +5809,12 @@ var TextField = function TextField(_ref11) {
|
|
|
5733
5809
|
}))));
|
|
5734
5810
|
};
|
|
5735
5811
|
|
|
5736
|
-
var _templateObject$
|
|
5737
|
-
var Container$3 = styled.div(_templateObject$
|
|
5812
|
+
var _templateObject$g, _templateObject2$d, _templateObject3$9;
|
|
5813
|
+
var Container$3 = styled.div(_templateObject$g || (_templateObject$g = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n width: 100%;\n gap: 8px;\n padding: ", ";\n"])), function (_ref) {
|
|
5738
5814
|
var $padding = _ref.$padding;
|
|
5739
5815
|
return $padding;
|
|
5740
5816
|
});
|
|
5741
|
-
var Label$1 = styled.label(_templateObject2$
|
|
5817
|
+
var Label$1 = styled.label(_templateObject2$d || (_templateObject2$d = _taggedTemplateLiteralLoose(["\n cursor: auto;\n font-weight: ", ";\n position: relative;\n width: max-content;\n\n ", "\n\n color: ", ";\n"])), function (_ref2) {
|
|
5742
5818
|
var $fontWeight = _ref2.$fontWeight;
|
|
5743
5819
|
return $fontWeight != null ? $fontWeight : '500';
|
|
5744
5820
|
}, function (_ref3) {
|
|
@@ -5757,7 +5833,7 @@ var Label$1 = styled.label(_templateObject2$c || (_templateObject2$c = _taggedTe
|
|
|
5757
5833
|
var $titlecolor = _ref4.$titlecolor;
|
|
5758
5834
|
return $titlecolor || colorVariables.text.dark;
|
|
5759
5835
|
});
|
|
5760
|
-
var TextAreaComponent = styled.textarea(_templateObject3$
|
|
5836
|
+
var TextAreaComponent = styled.textarea(_templateObject3$9 || (_templateObject3$9 = _taggedTemplateLiteralLoose(["\n width: 100%;\n border: 1px solid ", ";\n border-radius: 8px;\n cursor: ", ";\n background: ", ";\n transition: all 0.3s ease;\n color: ", ";\n resize: none;\n height: 100%;\n \n ", "\n\n &:focus {\n border-color: ", ";\n }\n\n &::placeholder {\n color: ", ";\n font-style: italic;\n font-family: NotoSans, sans-serif;\n }\n"])), colorVariables.border.light, function (_ref5) {
|
|
5761
5837
|
var $disabled = _ref5.$disabled;
|
|
5762
5838
|
return $disabled ? 'not-allowed' : 'auto';
|
|
5763
5839
|
}, function (_ref6) {
|
|
@@ -5829,18 +5905,18 @@ var TextArea = function TextArea(_ref10) {
|
|
|
5829
5905
|
}));
|
|
5830
5906
|
};
|
|
5831
5907
|
|
|
5832
|
-
var _templateObject$
|
|
5833
|
-
var OptionContainer$1 = styled.div(_templateObject$
|
|
5834
|
-
var OptionItem$1 = styled.div(_templateObject2$
|
|
5908
|
+
var _templateObject$h, _templateObject2$e, _templateObject3$a, _templateObject4$7, _templateObject5$7, _templateObject6$6, _templateObject7$4;
|
|
5909
|
+
var OptionContainer$1 = styled.div(_templateObject$h || (_templateObject$h = _taggedTemplateLiteralLoose(["\n z-index: 2;\n border-radius: 8px;\n display: flex;\n flex-direction: column;\n position: absolute;\n padding: 4px;\n top: 40px;\n left: 0px;\n background: ", ";\n max-width: 192px;\n min-width: 192px;\n height: auto;\n max-height: 175px;\n"])), colorVariables.text.white);
|
|
5910
|
+
var OptionItem$1 = styled.div(_templateObject2$e || (_templateObject2$e = _taggedTemplateLiteralLoose(["\n color: ", ";\n background-color: ", ";\n border-radius: 8px;\n\n &:hover {\n background-color: ", ";\n color: ", ";\n cursor: pointer;\n }\n"])), function (_ref) {
|
|
5835
5911
|
var $optionSelected = _ref.$optionSelected;
|
|
5836
5912
|
return $optionSelected ? colorVariables.text.white : colorVariables.text.medium;
|
|
5837
5913
|
}, function (_ref2) {
|
|
5838
5914
|
var $optionSelected = _ref2.$optionSelected;
|
|
5839
5915
|
return $optionSelected ? colorVariables["default"].primary : colorVariables.text.white;
|
|
5840
5916
|
}, colorVariables.hover.primary, colorVariables.text.white);
|
|
5841
|
-
var TotalOptionsHeader = styled.div(_templateObject3$
|
|
5842
|
-
var OptionLabel$1 = styled.label(_templateObject4$
|
|
5843
|
-
var SearchContainer$3 = styled.div(_templateObject5$
|
|
5917
|
+
var TotalOptionsHeader = styled.div(_templateObject3$a || (_templateObject3$a = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n z-index: 2;\n background: ", ";\n color: ", ";\n height: max-content;\n padding: 8px 4px;\n gap: 4px;\n border-bottom: 1px solid ", ";\n font-size:12px;\n"])), colorVariables.text.white, colorVariables.text.light, colorVariables.text.light);
|
|
5918
|
+
var OptionLabel$1 = styled.label(_templateObject4$7 || (_templateObject4$7 = _taggedTemplateLiteralLoose(["\n cursor: pointer;\n height: max-content;\n gap: 8px;\n padding: 8px 12px;\n word-break: break-word;\n box-sizing: border-box;\n display: flex;\n align-items: center;\n font-family: NotoSans;\n font-weight: 500;\n font-size: 14px;\n line-height: 14px;\n"])));
|
|
5919
|
+
var SearchContainer$3 = styled.div(_templateObject5$7 || (_templateObject5$7 = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: auto;\n background: ", ";\n border: ", ";\n border-radius: ", ";\n padding: 6.5px 8px;\n display: flex;\n align-items: center;\n gap: 6px;\n"])), function (_ref3) {
|
|
5844
5920
|
var $background = _ref3.$background;
|
|
5845
5921
|
switch ($background) {
|
|
5846
5922
|
case 'dark':
|
|
@@ -5869,7 +5945,7 @@ var SearchContainer$3 = styled.div(_templateObject5$6 || (_templateObject5$6 = _
|
|
|
5869
5945
|
var $borderRadius = _ref5.$borderRadius;
|
|
5870
5946
|
return $borderRadius || '8px';
|
|
5871
5947
|
});
|
|
5872
|
-
var SearchBar$3 = styled.input(_templateObject6$
|
|
5948
|
+
var SearchBar$3 = styled.input(_templateObject6$6 || (_templateObject6$6 = _taggedTemplateLiteralLoose(["\n border: none;\n outline: none;\n width: 100%;\n font-family: NotoSans, sans-serif;\n font-weight: 400;\n font-size: 14px;\n line-height: 100%;\n background: ", ";\n color: ", ";\n\n &::placeholder {\n color: ", ";\n font-style: italic;\n font-size: 14px;\n }\n"])), colorVariables["default"].tertiary, function (_ref6) {
|
|
5873
5949
|
var $inputColor = _ref6.$inputColor;
|
|
5874
5950
|
switch ($inputColor) {
|
|
5875
5951
|
case 'dark':
|
|
@@ -5914,7 +5990,7 @@ var SearchBar$3 = styled.input(_templateObject6$5 || (_templateObject6$5 = _tagg
|
|
|
5914
5990
|
return $placeholderColor;
|
|
5915
5991
|
}
|
|
5916
5992
|
});
|
|
5917
|
-
var OptionsWrapper$1 = styled.div(_templateObject7$
|
|
5993
|
+
var OptionsWrapper$1 = styled.div(_templateObject7$4 || (_templateObject7$4 = _taggedTemplateLiteralLoose(["\n padding: 4px 0px;\n height: 100%;\n overflow-y: auto;\n scrollbar-width: thin;\n background: ", "\n"])), colorVariables.text.white);
|
|
5918
5994
|
var TextFieldWithDropdown = function TextFieldWithDropdown(_ref8) {
|
|
5919
5995
|
var options = _ref8.options,
|
|
5920
5996
|
selectedOption = _ref8.selectedOption,
|
|
@@ -6029,8 +6105,8 @@ var TextFieldWithDropdown = function TextFieldWithDropdown(_ref8) {
|
|
|
6029
6105
|
}, NoOptionsText)))));
|
|
6030
6106
|
};
|
|
6031
6107
|
|
|
6032
|
-
var _templateObject$
|
|
6033
|
-
var StyledInput$1 = styled.input(_templateObject$
|
|
6108
|
+
var _templateObject$i, _templateObject2$f;
|
|
6109
|
+
var StyledInput$1 = styled.input(_templateObject$i || (_templateObject$i = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n appearance: none;\n border: ", ";\n border-radius: 4px;\n background-color: ", ";\n cursor: pointer;\n display: inline-block;\n position: relative;\n transition: all 0.2s ease;\n font-size: ", "; // for em units\n\n &:checked::after {\n content: '';\n position: absolute;\n top: ", ";\n right: ", ";\n width: ", ";\n height: ", ";\n border: solid ", ";\n border-width: 0 0.2em 0.2em 0;\n transform: rotate(45deg);\n }\n\n &:disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n"])), function (_ref) {
|
|
6034
6110
|
var $checkboxSize = _ref.$checkboxSize;
|
|
6035
6111
|
return $checkboxSize + "px";
|
|
6036
6112
|
}, function (_ref2) {
|
|
@@ -6059,7 +6135,7 @@ var StyledInput$1 = styled.input(_templateObject$h || (_templateObject$h = _tagg
|
|
|
6059
6135
|
var $checkboxSize = _ref9.$checkboxSize;
|
|
6060
6136
|
return $checkboxSize / 2.4 + "px";
|
|
6061
6137
|
}, colorVariables.text.white);
|
|
6062
|
-
var LabelSpan = styled(Span)(_templateObject2$
|
|
6138
|
+
var LabelSpan = styled(Span)(_templateObject2$f || (_templateObject2$f = _taggedTemplateLiteralLoose(["\n font-weight: 500;\n line-height: 1;\n user-select: none;\n"])));
|
|
6063
6139
|
var CheckBox = function CheckBox(_ref10) {
|
|
6064
6140
|
var label = _ref10.label,
|
|
6065
6141
|
_ref10$labelSide = _ref10.labelSide,
|
|
@@ -6114,8 +6190,8 @@ var CheckBox = function CheckBox(_ref10) {
|
|
|
6114
6190
|
}, label));
|
|
6115
6191
|
};
|
|
6116
6192
|
|
|
6117
|
-
var _templateObject$
|
|
6118
|
-
var spin$1 = keyframes(_templateObject$
|
|
6193
|
+
var _templateObject$j, _templateObject2$g, _templateObject3$b, _templateObject4$8;
|
|
6194
|
+
var spin$1 = keyframes(_templateObject$j || (_templateObject$j = _taggedTemplateLiteralLoose(["\n 0% { opacity: 1; }\n 100% { opacity: 0.3; }\n"])));
|
|
6119
6195
|
var getDotPosition = function getDotPosition(index, size) {
|
|
6120
6196
|
var angle = index * 360 / 8;
|
|
6121
6197
|
var radius = size / 2.5;
|
|
@@ -6123,7 +6199,7 @@ var getDotPosition = function getDotPosition(index, size) {
|
|
|
6123
6199
|
var y = radius * Math.sin(angle * Math.PI / 180);
|
|
6124
6200
|
return "translate(" + x + "px, " + y + "px)";
|
|
6125
6201
|
};
|
|
6126
|
-
var SpinnerContainer = styled.div(_templateObject2$
|
|
6202
|
+
var SpinnerContainer = styled.div(_templateObject2$g || (_templateObject2$g = _taggedTemplateLiteralLoose(["\n position: relative;\n width: ", "px;\n height: ", "px;\n display: flex;\n align-items: center;\n justify-content: center;\n"])), function (_ref) {
|
|
6127
6203
|
var $size = _ref.$size;
|
|
6128
6204
|
return $size;
|
|
6129
6205
|
}, function (_ref2) {
|
|
@@ -6138,7 +6214,7 @@ var Dot = styled.div.attrs(function (_ref3) {
|
|
|
6138
6214
|
transform: getDotPosition($index, $size)
|
|
6139
6215
|
}
|
|
6140
6216
|
};
|
|
6141
|
-
})(_templateObject3$
|
|
6217
|
+
})(_templateObject3$b || (_templateObject3$b = _taggedTemplateLiteralLoose(["\n position: absolute;\n width: ", "px;\n height: ", "px;\n background-color: ", ";\n border-radius: 50%;\n animation: ", " ", "s linear infinite;\n animation-delay: ", "s;\n"])), function (_ref4) {
|
|
6142
6218
|
var $dotSize = _ref4.$dotSize;
|
|
6143
6219
|
return $dotSize;
|
|
6144
6220
|
}, function (_ref5) {
|
|
@@ -6155,7 +6231,7 @@ var Dot = styled.div.attrs(function (_ref3) {
|
|
|
6155
6231
|
$speed = _ref8.$speed;
|
|
6156
6232
|
return $index * $speed / 8;
|
|
6157
6233
|
});
|
|
6158
|
-
var SpinnerWrapper = styled.div(_templateObject4$
|
|
6234
|
+
var SpinnerWrapper = styled.div(_templateObject4$8 || (_templateObject4$8 = _taggedTemplateLiteralLoose(["\n display: inline-flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n width: max-content;\n"])));
|
|
6159
6235
|
var sizeMap = {
|
|
6160
6236
|
small: {
|
|
6161
6237
|
size: 32
|
|
@@ -6196,9 +6272,9 @@ var CircularLoader = function CircularLoader(_ref9) {
|
|
|
6196
6272
|
})), text && React.createElement(React.Fragment, null, text));
|
|
6197
6273
|
};
|
|
6198
6274
|
|
|
6199
|
-
var _templateObject$
|
|
6200
|
-
var spin$2 = keyframes(_templateObject$
|
|
6201
|
-
var Spinner$1 = styled.div(_templateObject2$
|
|
6275
|
+
var _templateObject$k, _templateObject2$h;
|
|
6276
|
+
var spin$2 = keyframes(_templateObject$k || (_templateObject$k = _taggedTemplateLiteralLoose(["\n to {\n transform: rotate(360deg);\n }\n"])));
|
|
6277
|
+
var Spinner$1 = styled.div(_templateObject2$h || (_templateObject2$h = _taggedTemplateLiteralLoose(["\n width: ", "px;\n height: ", "px;\n border: 5px solid #ddd;\n border-top-color: ", ";\n border-radius: 50%;\n animation: ", " 1s linear infinite;\n"])), function (_ref) {
|
|
6202
6278
|
var $size = _ref.$size;
|
|
6203
6279
|
return $size;
|
|
6204
6280
|
}, function (_ref2) {
|
|
@@ -6239,8 +6315,8 @@ var Loader = function Loader(_ref4) {
|
|
|
6239
6315
|
}, title))));
|
|
6240
6316
|
};
|
|
6241
6317
|
|
|
6242
|
-
var _templateObject$
|
|
6243
|
-
var PageInput = styled.input(_templateObject$
|
|
6318
|
+
var _templateObject$l;
|
|
6319
|
+
var PageInput = styled.input(_templateObject$l || (_templateObject$l = _taggedTemplateLiteralLoose(["\n width: 40px;\n height: 32px;\n background-color: ", ";\n border: 1px solid ", ";\n border-radius: 8px;\n padding: 4px;\n color: ", ";\n text-align: center;\n &::-webkit-outer-spin-button,\n &::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n"])), colorVariables.accent.extraLight, colorVariables.border.light, colorVariables.text.dark);
|
|
6244
6320
|
var Pagination = function Pagination(_ref) {
|
|
6245
6321
|
var totalPages = _ref.totalPages,
|
|
6246
6322
|
currentPage = _ref.currentPage,
|
|
@@ -6424,21 +6500,21 @@ var ProgressBar = function ProgressBar(_ref) {
|
|
|
6424
6500
|
})));
|
|
6425
6501
|
};
|
|
6426
6502
|
|
|
6427
|
-
var _templateObject$
|
|
6428
|
-
var SidebarContainer = styled.div(_templateObject$
|
|
6503
|
+
var _templateObject$m, _templateObject2$i, _templateObject3$c, _templateObject4$9, _templateObject5$8;
|
|
6504
|
+
var SidebarContainer = styled.div(_templateObject$m || (_templateObject$m = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: 100vh;\n background: ", ";\n transition: width 0.3s ease-in-out;\n display: flex;\n flex-direction: column;\n align-items: start;\n padding: 20px;\n position: fixed;\n left: 0;\n top: 0;\n overflow: hidden;\n z-index: 10;\n justify-content: space-between;\n"])), function (_ref) {
|
|
6429
6505
|
var $isExpanded = _ref.$isExpanded;
|
|
6430
6506
|
return $isExpanded ? '225px' : '68px';
|
|
6431
6507
|
}, function (_ref2) {
|
|
6432
6508
|
var $background = _ref2.$background;
|
|
6433
6509
|
return $background || colorVariables.accent.softBlue;
|
|
6434
6510
|
});
|
|
6435
|
-
var SidebarLink = styled(NavLink)(_templateObject2$
|
|
6436
|
-
var IconWrapper$2 = styled.div(_templateObject3$
|
|
6511
|
+
var SidebarLink = styled(NavLink)(_templateObject2$i || (_templateObject2$i = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n height: 28px;\n width: 100%;\n gap: 10px;\n cursor: pointer;\n border-radius: 4px;\n color: ", ";\n text-decoration: none;\n transition: background 0.3s;\n\n &:hover {\n background: ", ";\n }\n"])), colorVariables.text.medium, colorVariables["default"].primary);
|
|
6512
|
+
var IconWrapper$2 = styled.div(_templateObject3$c || (_templateObject3$c = _taggedTemplateLiteralLoose(["\n background: ", ";\n padding: 4px;\n border-radius: 4px;\n width: 28px;\n display: flex;\n align-items: center;\n justify-content: center;\n"])), function (_ref3) {
|
|
6437
6513
|
var $selected = _ref3.$selected;
|
|
6438
6514
|
return $selected ? colorVariables["default"].primary : colorVariables["default"].tertiary;
|
|
6439
6515
|
});
|
|
6440
|
-
var Logo = styled.div(_templateObject4$
|
|
6441
|
-
var TextContainer = styled.span(_templateObject5$
|
|
6516
|
+
var Logo = styled.div(_templateObject4$9 || (_templateObject4$9 = _taggedTemplateLiteralLoose(["\n display: flex;\n width: 100%;\n min-width: max-content;\n height: 32px;\n align-items: center;\n justify-content: start;\n gap: 10px;\n"])));
|
|
6517
|
+
var TextContainer = styled.span(_templateObject5$8 || (_templateObject5$8 = _taggedTemplateLiteralLoose(["\n white-space: nowrap;\n padding: ", ";\n font-size: ", ";\n font-weight: ", ";\n color: ", ";\n opacity: ", ";\n visibility: ", ";\n transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;\n"])), function (_ref4) {
|
|
6442
6518
|
var $padding = _ref4.$padding;
|
|
6443
6519
|
return $padding;
|
|
6444
6520
|
}, function (_ref5) {
|
|
@@ -6576,14 +6652,14 @@ var Sidebar = function Sidebar(_ref10) {
|
|
|
6576
6652
|
}))), ProfileContent);
|
|
6577
6653
|
};
|
|
6578
6654
|
|
|
6579
|
-
var _templateObject$
|
|
6580
|
-
var ContainerWrapper = styled.div(_templateObject$
|
|
6655
|
+
var _templateObject$n, _templateObject2$j, _templateObject3$d, _templateObject4$a;
|
|
6656
|
+
var ContainerWrapper = styled.div(_templateObject$n || (_templateObject$n = _taggedTemplateLiteralLoose(["\n height: auto;\n display: flex;\n align-items: center;\n justify-content: center;\n width: ", ";\n min-height: ", ";\n word-break: break-word;\n"])), function (props) {
|
|
6581
6657
|
return props.$width || 'auto';
|
|
6582
6658
|
}, function (_ref) {
|
|
6583
6659
|
var $minHeight = _ref.$minHeight;
|
|
6584
6660
|
return $minHeight;
|
|
6585
6661
|
});
|
|
6586
|
-
var CellContainer = styled.div(_templateObject2$
|
|
6662
|
+
var CellContainer = styled.div(_templateObject2$j || (_templateObject2$j = _taggedTemplateLiteralLoose(["\n align-items:", ";\n justify-content: center;\n width: ", ";\n min-width: ", ";\n display: flex;\n flex-direction: column;\n background: ", ";\n padding: ", ";\n gap: 4px;\n height: 100%\n"])), function (props) {
|
|
6587
6663
|
return props.$align;
|
|
6588
6664
|
}, function (props) {
|
|
6589
6665
|
return props.$width || 'auto';
|
|
@@ -6594,14 +6670,14 @@ var CellContainer = styled.div(_templateObject2$i || (_templateObject2$i = _tagg
|
|
|
6594
6670
|
}, function (props) {
|
|
6595
6671
|
return props.$padding;
|
|
6596
6672
|
});
|
|
6597
|
-
var MainText = styled.div(_templateObject3$
|
|
6673
|
+
var MainText = styled.div(_templateObject3$d || (_templateObject3$d = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-size:", ";\n font-weight:", ";\n line-height: 100%;\n"])), function (props) {
|
|
6598
6674
|
return props.$mtc;
|
|
6599
6675
|
}, function (props) {
|
|
6600
6676
|
return props.$mtfs;
|
|
6601
6677
|
}, function (props) {
|
|
6602
6678
|
return props.$mtw;
|
|
6603
6679
|
});
|
|
6604
|
-
var SubText = styled.div(_templateObject4$
|
|
6680
|
+
var SubText = styled.div(_templateObject4$a || (_templateObject4$a = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-size:", ";\n font-weight:", ";\n line-height: 100%;\n"])), function (props) {
|
|
6605
6681
|
return props.$stc;
|
|
6606
6682
|
}, function (props) {
|
|
6607
6683
|
return props.$stfs;
|
|
@@ -6653,8 +6729,8 @@ var TableCell = function TableCell(_ref2) {
|
|
|
6653
6729
|
}, subtext)));
|
|
6654
6730
|
};
|
|
6655
6731
|
|
|
6656
|
-
var _templateObject$
|
|
6657
|
-
var TableRowContainer = styled$1.div(_templateObject$
|
|
6732
|
+
var _templateObject$o;
|
|
6733
|
+
var TableRowContainer = styled$1.div(_templateObject$o || (_templateObject$o = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n background: inherit;\n align-items:center;\n padding: 16px 12px;\n width: 100%;\n"])));
|
|
6658
6734
|
var TableRow = function TableRow(_ref) {
|
|
6659
6735
|
var rowconfig = _ref.rowconfig,
|
|
6660
6736
|
tableheaderconfig = _ref.tableheaderconfig;
|
|
@@ -6697,16 +6773,16 @@ var TableRow = function TableRow(_ref) {
|
|
|
6697
6773
|
}));
|
|
6698
6774
|
};
|
|
6699
6775
|
|
|
6700
|
-
var _templateObject$
|
|
6701
|
-
var TableContainer = styled.div(_templateObject$
|
|
6702
|
-
var TableHeader = styled.div(_templateObject2$
|
|
6776
|
+
var _templateObject$p, _templateObject2$k, _templateObject3$e, _templateObject4$b, _templateObject5$9;
|
|
6777
|
+
var TableContainer = styled.div(_templateObject$p || (_templateObject$p = _taggedTemplateLiteralLoose(["\n background: ", ";\n width: 100%;\n display: flex;\n overflow: hidden;\n border-radius: 8px;\n"])), colorVariables.brand.light);
|
|
6778
|
+
var TableHeader = styled.div(_templateObject2$k || (_templateObject2$k = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n display: flex;\n background: ", ";\n color: ", ";\n min-height: 36px;\n align-items: center;\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n padding: 9px 12px;\n"])), function (props) {
|
|
6703
6779
|
return props.$hbcolor || 'transparent';
|
|
6704
6780
|
}, function (props) {
|
|
6705
6781
|
return props.$tcolor || 'white';
|
|
6706
6782
|
});
|
|
6707
|
-
var TableContent = styled.div(_templateObject3$
|
|
6708
|
-
var TableData = styled.div(_templateObject4$
|
|
6709
|
-
var Divider = styled.div(_templateObject5$
|
|
6783
|
+
var TableContent = styled.div(_templateObject3$e || (_templateObject3$e = _taggedTemplateLiteralLoose(["\n width: 100%;\n svg {\n cursor: pointer;\n }\n"])));
|
|
6784
|
+
var TableData = styled.div(_templateObject4$b || (_templateObject4$b = _taggedTemplateLiteralLoose(["\n overflow: auto;\n scrollbar-width: thin;\n height: 100%;\n max-height: calc(100% - 36px);\n"])));
|
|
6785
|
+
var Divider = styled.div(_templateObject5$9 || (_templateObject5$9 = _taggedTemplateLiteralLoose(["\n height: 2px;\n background: ", ";\n"])), colorVariables.border.extraLight);
|
|
6710
6786
|
var Table = function Table(_ref) {
|
|
6711
6787
|
var tableObject = _ref.tableObject,
|
|
6712
6788
|
_ref$filter = _ref.filter,
|
|
@@ -6828,8 +6904,8 @@ var Table = function Table(_ref) {
|
|
|
6828
6904
|
}))));
|
|
6829
6905
|
};
|
|
6830
6906
|
|
|
6831
|
-
var _templateObject$
|
|
6832
|
-
var Container$4 = styled.div(_templateObject$
|
|
6907
|
+
var _templateObject$q, _templateObject2$l, _templateObject3$f, _templateObject4$c, _templateObject5$a;
|
|
6908
|
+
var Container$4 = styled.div(_templateObject$q || (_templateObject$q = _taggedTemplateLiteralLoose(["\n width: 100%;\n height: 100%; \n display: flex;\n flex-direction: column;\n overflow: ", ";\n gap: ", ";\n border: ", ";\n border-radius: 8px;\n"])), function (_ref) {
|
|
6833
6909
|
var $overflow = _ref.$overflow;
|
|
6834
6910
|
return $overflow || 'visible';
|
|
6835
6911
|
}, function (_ref2) {
|
|
@@ -6839,11 +6915,11 @@ var Container$4 = styled.div(_templateObject$p || (_templateObject$p = _taggedTe
|
|
|
6839
6915
|
var $border = _ref3.$border;
|
|
6840
6916
|
return $border;
|
|
6841
6917
|
});
|
|
6842
|
-
var FirstContainer = styled.div(_templateObject2$
|
|
6918
|
+
var FirstContainer = styled.div(_templateObject2$l || (_templateObject2$l = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n font-family: NotoSans, sans-serif;\n font-size: 16px;\n gap: 24px;\n border-bottom: 1px solid ", ";\n padding: ", ";\n"])), colorVariables.border.light, function (_ref4) {
|
|
6843
6919
|
var $headerPadding = _ref4.$headerPadding;
|
|
6844
6920
|
return $headerPadding ? $headerPadding : '0px';
|
|
6845
6921
|
});
|
|
6846
|
-
var TabContainer = styled.div(_templateObject3$
|
|
6922
|
+
var TabContainer = styled.div(_templateObject3$f || (_templateObject3$f = _taggedTemplateLiteralLoose(["\n width: auto;\n display: flex;\n align-items: center;\n cursor: ", ";\n opacity: ", ";\n gap: 8px;\n font-family: NotoSans, sans-serif;\n font-size: 14px;\n font-weight: 500;\n color: ", ";\n height: ", ";\n\n svg {\n cursor: ", ";\n }\n\n"])), function (_ref5) {
|
|
6847
6923
|
var $disabled = _ref5.$disabled;
|
|
6848
6924
|
return $disabled ? 'not-allowed' : 'pointer';
|
|
6849
6925
|
}, function (_ref6) {
|
|
@@ -6856,13 +6932,13 @@ var TabContainer = styled.div(_templateObject3$e || (_templateObject3$e = _tagge
|
|
|
6856
6932
|
var $disabled = _ref8.$disabled;
|
|
6857
6933
|
return $disabled ? 'not-allowed' : 'pointer';
|
|
6858
6934
|
});
|
|
6859
|
-
var TabItemContainer = styled.div(_templateObject4$
|
|
6935
|
+
var TabItemContainer = styled.div(_templateObject4$c || (_templateObject4$c = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n position: relative;\n gap: 8px;\n height: 100%;\n max-height: ", ";\n\n &:after {\n content: \"\";\n display: ", ";\n width: 100%;\n height: 3px;\n background: ", ";\n position: absolute;\n bottom: -1px;\n left: 0px;\n }\n"])), function (_ref9) {
|
|
6860
6936
|
var $headerHeight = _ref9.$headerHeight;
|
|
6861
6937
|
return $headerHeight ? $headerHeight : '34px';
|
|
6862
6938
|
}, function (props) {
|
|
6863
6939
|
return props.$active ? 'block' : 'none';
|
|
6864
6940
|
}, colorVariables["default"].primary);
|
|
6865
|
-
var DetailsFirstContainer = styled.div(_templateObject5$
|
|
6941
|
+
var DetailsFirstContainer = styled.div(_templateObject5$a || (_templateObject5$a = _taggedTemplateLiteralLoose(["\n text-align: center;\n font-size: 14px;\n line-height: 18px;\n font-weight: 500;\n font-family: NotoSans, sans-serif;\n height: 100%;\n display: flex;\n align-items: center;\n color: ", ";\n"])), function (props) {
|
|
6866
6942
|
return props.$active ? colorVariables["default"].primary : colorVariables.text.medium;
|
|
6867
6943
|
});
|
|
6868
6944
|
var Tabs = function Tabs(_ref10) {
|
|
@@ -6944,5 +7020,5 @@ var InternalTabs = function InternalTabs(_ref) {
|
|
|
6944
7020
|
}));
|
|
6945
7021
|
};
|
|
6946
7022
|
|
|
6947
|
-
export { Badge, Breadcrumbs, ButtonComponent as Button, ButtonCarousel, CheckBox, CircularLoader, Container, DatePicker, DropdownMenu$1 as DropdownMenu, Icon, InternalTabs, Loader, MultiSelectDropdown, OptionComponent, Options, Pagination, ProgressBar, SearchBox, SelectOption, SelectedOption, Sidebar, Span, Table, TableCell, TableRow, Tabs, TextArea, TextField, TextFieldWithDropdown, colorVariables, convertEpochToDateString, convertEpochToOnlyDate, convertToEpoch, formatCalendarDateTime, formatDate, formatEpochToIST, formatTimestamp, getSystemTimezoneAbbreviation, themes, timeAgo, timeStringToSeconds, useClickOutside, useCustomModal, useNotification };
|
|
7023
|
+
export { Badge, Breadcrumbs, ButtonComponent as Button, ButtonCarousel, CheckBox, CircularLoader, Container, DatePicker, DropdownMenu$1 as DropdownMenu, Icon, IconTooltip, InternalTabs, Loader, MultiSelectDropdown, OptionComponent, Options, Pagination, ProgressBar, SearchBox, SelectOption, SelectedOption, Sidebar, Span, Table, TableCell, TableRow, Tabs, TextArea, TextField, TextFieldWithDropdown, colorVariables, convertEpochToDateString, convertEpochToOnlyDate, convertToEpoch, formatCalendarDateTime, formatDate, formatEpochToIST, formatTimestamp, getSystemTimezoneAbbreviation, themes, timeAgo, timeStringToSeconds, useClickOutside, useCustomModal, useNotification };
|
|
6948
7024
|
//# sourceMappingURL=index.modern.js.map
|