labsense-ui-kit 1.4.44 → 1.4.45
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.js +82 -71
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +82 -71
- package/dist/index.modern.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -8717,7 +8717,7 @@ var timeStringToSeconds = function timeStringToSeconds(timeString) {
|
|
|
8717
8717
|
return hours * 3600 + minutes * 60 + seconds;
|
|
8718
8718
|
};
|
|
8719
8719
|
|
|
8720
|
-
var _templateObject$9, _templateObject2$6, _templateObject3$3, _templateObject4$2, _templateObject5$2, _templateObject6$2, _templateObject7$1, _templateObject8$1, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22;
|
|
8720
|
+
var _templateObject$9, _templateObject2$6, _templateObject3$3, _templateObject4$2, _templateObject5$2, _templateObject6$2, _templateObject7$1, _templateObject8$1, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24;
|
|
8721
8721
|
var DatePickerContainer = styled__default.div(_templateObject$9 || (_templateObject$9 = _taggedTemplateLiteralLoose(["\n width: 100%;\n display: flex;\n flex-direction: column;\n position: relative;\n"])));
|
|
8722
8722
|
var CalendarContainer = styled__default.div(_templateObject2$6 || (_templateObject2$6 = _taggedTemplateLiteralLoose(["\n overflow: auto;\n display: flex;\n flex-direction: row;\n background: ", ";\n position: absolute;\n border: ", ";\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 transition: border 0.3s ease;\n"])), function (_ref) {
|
|
8723
8723
|
var theme = _ref.theme;
|
|
@@ -8747,105 +8747,113 @@ var Selectedtime = styled__default.div(_templateObject9 || (_templateObject9 = _
|
|
|
8747
8747
|
return theme.vms.text.medium;
|
|
8748
8748
|
});
|
|
8749
8749
|
var Line$1 = styled__default.div(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n width: 100%;\n padding-top: 10px;\n padding-bottom: 10px;\n"])));
|
|
8750
|
-
var Zones = styled__default.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n"])));
|
|
8751
|
-
var
|
|
8752
|
-
var CalendarMonthYear = styled__default.span(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n color: ", ";\n justify-content: center;\n align-items: center;\n"])), function (_ref7) {
|
|
8750
|
+
var Zones = styled__default.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n\n & + & {\n margin-top: 8px;\n }\n"])));
|
|
8751
|
+
var ZoneLabel = styled__default.span(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n font-weight: 400;\n font-size: 12px;\n color: ", ";\n"])), function (_ref7) {
|
|
8753
8752
|
var theme = _ref7.theme;
|
|
8754
8753
|
return theme.vms.text.medium;
|
|
8755
8754
|
});
|
|
8756
|
-
var
|
|
8757
|
-
var Button = styled__default.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"])), function (_ref8) {
|
|
8755
|
+
var ZoneValue = styled__default.span(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n font-weight: 600;\n font-size: 13px;\n color: ", ";\n"])), function (_ref8) {
|
|
8758
8756
|
var theme = _ref8.theme;
|
|
8759
|
-
return theme.vms
|
|
8760
|
-
}
|
|
8757
|
+
return theme.vms.text.dark;
|
|
8758
|
+
});
|
|
8759
|
+
var CalendarHeader = styled__default.div(_templateObject14 || (_templateObject14 = _taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 10px;\n"])));
|
|
8760
|
+
var CalendarMonthYear = styled__default.span(_templateObject15 || (_templateObject15 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n color: ", ";\n justify-content: center;\n align-items: center;\n"])), function (_ref9) {
|
|
8761
8761
|
var theme = _ref9.theme;
|
|
8762
|
-
return theme.vms.text.
|
|
8763
|
-
}, function (_ref10) {
|
|
8764
|
-
var $size = _ref10.$size;
|
|
8765
|
-
return $size ? $size + "px" : '30px';
|
|
8766
|
-
}, function (_ref11) {
|
|
8767
|
-
var $size = _ref11.$size;
|
|
8768
|
-
return $size ? $size + "px" : '30px';
|
|
8762
|
+
return theme.vms.text.medium;
|
|
8769
8763
|
});
|
|
8770
|
-
var
|
|
8764
|
+
var CalendarContent = styled__default.div(_templateObject16 || (_templateObject16 = _taggedTemplateLiteralLoose(["\n display: grid;\n grid-template-columns: repeat(7, 1fr);\n gap: 5px;\n padding: 10px;\n"])));
|
|
8765
|
+
var Button = styled__default.div(_templateObject17 || (_templateObject17 = _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"])), function (_ref10) {
|
|
8766
|
+
var theme = _ref10.theme;
|
|
8767
|
+
return theme.vms["default"].secondary;
|
|
8768
|
+
}, function (_ref11) {
|
|
8769
|
+
var theme = _ref11.theme;
|
|
8770
|
+
return theme.vms.text.white;
|
|
8771
|
+
}, function (_ref12) {
|
|
8771
8772
|
var $size = _ref12.$size;
|
|
8772
8773
|
return $size ? $size + "px" : '30px';
|
|
8773
8774
|
}, function (_ref13) {
|
|
8774
8775
|
var $size = _ref13.$size;
|
|
8776
|
+
return $size ? $size + "px" : '30px';
|
|
8777
|
+
});
|
|
8778
|
+
var CalendarDates = styled__default.div(_templateObject18 || (_templateObject18 = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n display: flex;\n align-items: center;\n justify-content: flex-start;\n flex-direction: column;\n position: relative;\n cursor: ", ";\n font-size: 12px;\n opacity: ", ";\n\n &::after {\n content: '';\n display: ", ";\n position: absolute;\n bottom: 0;\n left: 50%;\n width: 4px;\n height: 4px;\n border-radius: 50%;\n transform: translateX(-50%);\n background: ", ";\n }\n"])), function (_ref14) {
|
|
8779
|
+
var $size = _ref14.$size;
|
|
8780
|
+
return $size ? $size + "px" : '30px';
|
|
8781
|
+
}, function (_ref15) {
|
|
8782
|
+
var $size = _ref15.$size;
|
|
8775
8783
|
return $size ? $size + 8 + "px" : '38px';
|
|
8776
|
-
}, function (
|
|
8777
|
-
var $isFuture =
|
|
8778
|
-
$futureDateTime =
|
|
8784
|
+
}, function (_ref16) {
|
|
8785
|
+
var $isFuture = _ref16.$isFuture,
|
|
8786
|
+
$futureDateTime = _ref16.$futureDateTime;
|
|
8779
8787
|
return !$futureDateTime && $isFuture ? 'default' : 'pointer';
|
|
8780
|
-
}, function (
|
|
8781
|
-
var $isFuture =
|
|
8782
|
-
$futureDateTime =
|
|
8788
|
+
}, function (_ref17) {
|
|
8789
|
+
var $isFuture = _ref17.$isFuture,
|
|
8790
|
+
$futureDateTime = _ref17.$futureDateTime;
|
|
8783
8791
|
return !$futureDateTime && $isFuture ? 0.5 : 1;
|
|
8784
|
-
}, function (
|
|
8785
|
-
var $showDot =
|
|
8792
|
+
}, function (_ref18) {
|
|
8793
|
+
var $showDot = _ref18.$showDot;
|
|
8786
8794
|
return $showDot ? 'block' : 'none';
|
|
8787
|
-
}, function (
|
|
8788
|
-
var $dotColor =
|
|
8789
|
-
theme =
|
|
8795
|
+
}, function (_ref19) {
|
|
8796
|
+
var $dotColor = _ref19.$dotColor,
|
|
8797
|
+
theme = _ref19.theme;
|
|
8790
8798
|
return $dotColor || theme.vms["default"].primary;
|
|
8791
8799
|
});
|
|
8792
|
-
var CalendarDateLabel = styled__default.div(
|
|
8793
|
-
var $size =
|
|
8794
|
-
return $size ? $size + "px" : '30px';
|
|
8795
|
-
}, function (_ref19) {
|
|
8796
|
-
var $size = _ref19.$size;
|
|
8800
|
+
var CalendarDateLabel = styled__default.div(_templateObject19 || (_templateObject19 = _taggedTemplateLiteralLoose(["\n width: ", ";\n height: ", ";\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n background-color: ", ";\n color: ", ";\n border: ", ";\n\n ", ":hover & {\n background-color: ", ";\n }\n"])), function (_ref20) {
|
|
8801
|
+
var $size = _ref20.$size;
|
|
8797
8802
|
return $size ? $size + "px" : '30px';
|
|
8798
|
-
}, function (_ref20) {
|
|
8799
|
-
var $selected = _ref20.$selected,
|
|
8800
|
-
$inRange = _ref20.$inRange,
|
|
8801
|
-
$plain = _ref20.$plain,
|
|
8802
|
-
theme = _ref20.theme;
|
|
8803
|
-
return $plain ? 'transparent' : $selected ? theme.vms["default"].primary : $inRange ? theme.vms["default"].primary : theme.vms["default"].tertiary;
|
|
8804
8803
|
}, function (_ref21) {
|
|
8805
|
-
var $
|
|
8806
|
-
|
|
8807
|
-
$plain = _ref21.$plain,
|
|
8808
|
-
theme = _ref21.theme;
|
|
8809
|
-
return $plain ? theme.vms.text.medium : $selected ? theme.vms.text.white : $inRange ? theme.vms.text.white : theme.vms.text.medium;
|
|
8804
|
+
var $size = _ref21.$size;
|
|
8805
|
+
return $size ? $size + "px" : '30px';
|
|
8810
8806
|
}, function (_ref22) {
|
|
8811
|
-
var $
|
|
8812
|
-
|
|
8813
|
-
|
|
8807
|
+
var $selected = _ref22.$selected,
|
|
8808
|
+
$inRange = _ref22.$inRange,
|
|
8809
|
+
$plain = _ref22.$plain,
|
|
8810
|
+
theme = _ref22.theme;
|
|
8811
|
+
return $plain ? 'transparent' : $selected ? theme.vms["default"].primary : $inRange ? theme.vms["default"].primary : theme.vms["default"].tertiary;
|
|
8812
|
+
}, function (_ref23) {
|
|
8814
8813
|
var $selected = _ref23.$selected,
|
|
8815
8814
|
$inRange = _ref23.$inRange,
|
|
8816
8815
|
$plain = _ref23.$plain,
|
|
8817
|
-
$isFuture = _ref23.$isFuture,
|
|
8818
|
-
$futureDateTime = _ref23.$futureDateTime,
|
|
8819
8816
|
theme = _ref23.theme;
|
|
8817
|
+
return $plain ? theme.vms.text.medium : $selected ? theme.vms.text.white : $inRange ? theme.vms.text.white : theme.vms.text.medium;
|
|
8818
|
+
}, function (_ref24) {
|
|
8819
|
+
var $highlightBorder = _ref24.$highlightBorder;
|
|
8820
|
+
return $highlightBorder ? "2px solid " + $highlightBorder : '2px solid transparent';
|
|
8821
|
+
}, CalendarDates, function (_ref25) {
|
|
8822
|
+
var $selected = _ref25.$selected,
|
|
8823
|
+
$inRange = _ref25.$inRange,
|
|
8824
|
+
$plain = _ref25.$plain,
|
|
8825
|
+
$isFuture = _ref25.$isFuture,
|
|
8826
|
+
$futureDateTime = _ref25.$futureDateTime,
|
|
8827
|
+
theme = _ref25.theme;
|
|
8820
8828
|
return $plain ? 'transparent' : !$futureDateTime && $isFuture ? 'transparent' : $selected ? theme.vms.disabled.primary : $inRange ? theme.vms.disabled.primary : theme.vms.disabled.primary;
|
|
8821
8829
|
});
|
|
8822
|
-
var Year = styled__default.div(
|
|
8823
|
-
var Month = styled__default.div(
|
|
8824
|
-
var InputWrapper = styled__default.div(
|
|
8825
|
-
var TimeInputWrapper = styled__default.div(
|
|
8826
|
-
var StyledInput = styled__default.input(
|
|
8827
|
-
var theme =
|
|
8830
|
+
var Year = styled__default.div(_templateObject20 || (_templateObject20 = _taggedTemplateLiteralLoose(["\n font-weight: 500;\n font-size: 12px;\n"])));
|
|
8831
|
+
var Month = styled__default.div(_templateObject21 || (_templateObject21 = _taggedTemplateLiteralLoose(["\n font-weight: 600;\n font-size: 14px;\n"])));
|
|
8832
|
+
var InputWrapper = styled__default.div(_templateObject22 || (_templateObject22 = _taggedTemplateLiteralLoose(["\n display: flex;\n gap: 24px;\n"])));
|
|
8833
|
+
var TimeInputWrapper = styled__default.div(_templateObject23 || (_templateObject23 = _taggedTemplateLiteralLoose(["\n position: relative;\n display: flex;\n align-items: center;\n"])));
|
|
8834
|
+
var StyledInput = styled__default.input(_templateObject24 || (_templateObject24 = _taggedTemplateLiteralLoose(["\n outline: none;\n width: 60px;\n height: 30px;\n text-align: center;\n font-size: 16px;\n border-radius: 5px;\n background: ", ";\n border: ", ";\n color: ", ";\n"])), function (_ref26) {
|
|
8835
|
+
var theme = _ref26.theme;
|
|
8828
8836
|
return theme.vms.text.white;
|
|
8829
|
-
}, function (
|
|
8830
|
-
var theme =
|
|
8837
|
+
}, function (_ref27) {
|
|
8838
|
+
var theme = _ref27.theme;
|
|
8831
8839
|
return "1px solid " + theme.vms.border.extraBold;
|
|
8832
|
-
}, function (
|
|
8833
|
-
var theme =
|
|
8840
|
+
}, function (_ref28) {
|
|
8841
|
+
var theme = _ref28.theme;
|
|
8834
8842
|
return theme.vms.text.dark;
|
|
8835
8843
|
});
|
|
8836
|
-
var DatePicker = function DatePicker(
|
|
8844
|
+
var DatePicker = function DatePicker(_ref29) {
|
|
8837
8845
|
var _renderState$startDat3, _renderState$startDat4;
|
|
8838
|
-
var
|
|
8839
|
-
dateSize =
|
|
8840
|
-
dateTime =
|
|
8841
|
-
setDateTime =
|
|
8842
|
-
|
|
8843
|
-
futureDateTime =
|
|
8844
|
-
|
|
8845
|
-
clockType =
|
|
8846
|
-
|
|
8847
|
-
markedDateRanges =
|
|
8848
|
-
calendarBorder =
|
|
8846
|
+
var _ref29$dateSize = _ref29.dateSize,
|
|
8847
|
+
dateSize = _ref29$dateSize === void 0 ? 30 : _ref29$dateSize,
|
|
8848
|
+
dateTime = _ref29.dateTime,
|
|
8849
|
+
setDateTime = _ref29.setDateTime,
|
|
8850
|
+
_ref29$futureDateTime = _ref29.futureDateTime,
|
|
8851
|
+
futureDateTime = _ref29$futureDateTime === void 0 ? true : _ref29$futureDateTime,
|
|
8852
|
+
_ref29$clockType = _ref29.clockType,
|
|
8853
|
+
clockType = _ref29$clockType === void 0 ? '24hr' : _ref29$clockType,
|
|
8854
|
+
_ref29$markedDateRang = _ref29.markedDateRanges,
|
|
8855
|
+
markedDateRanges = _ref29$markedDateRang === void 0 ? [] : _ref29$markedDateRang,
|
|
8856
|
+
calendarBorder = _ref29.calendarBorder;
|
|
8849
8857
|
var themeColors = useTheme();
|
|
8850
8858
|
var _useTranslation = reactI18next.useTranslation(),
|
|
8851
8859
|
t = _useTranslation.t;
|
|
@@ -9086,6 +9094,9 @@ var DatePicker = function DatePicker(_ref27) {
|
|
|
9086
9094
|
var formatTime = function formatTime(value) {
|
|
9087
9095
|
return value.toString().padStart(2, '0');
|
|
9088
9096
|
};
|
|
9097
|
+
var formatClockType = function formatClockType(value) {
|
|
9098
|
+
return value === '12hr' ? '12-hour' : '24-hour';
|
|
9099
|
+
};
|
|
9089
9100
|
return React__default.createElement(DatePickerContainer, null, React__default.createElement(CalendarContainer, {
|
|
9090
9101
|
"$border": calendarBorder,
|
|
9091
9102
|
onClick: function onClick(e) {
|
|
@@ -9147,7 +9158,7 @@ var DatePicker = function DatePicker(_ref27) {
|
|
|
9147
9158
|
onChange: function onChange(e) {
|
|
9148
9159
|
return handleMinuteChange(e, false);
|
|
9149
9160
|
}
|
|
9150
|
-
}))))), React__default.createElement(Line$1, null, React__default.createElement("hr", null)), React__default.createElement(Zones, null, React__default.createElement(
|
|
9161
|
+
}))))), React__default.createElement(Line$1, null, React__default.createElement("hr", null)), React__default.createElement(Zones, null, React__default.createElement(ZoneLabel, null, t('TimePicker_Zone')), React__default.createElement(ZoneValue, null, getSystemTimezoneAbbreviation())), React__default.createElement(Zones, null, React__default.createElement(ZoneLabel, null, t('TimePicker_ClockType')), React__default.createElement(ZoneValue, null, formatClockType(clockType))))));
|
|
9151
9162
|
};
|
|
9152
9163
|
|
|
9153
9164
|
var _templateObject$a, _templateObject2$7, _templateObject3$4, _templateObject4$3, _templateObject5$3, _templateObject6$3;
|