labsense-ui-kit 1.1.44 → 1.1.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.
@@ -4545,16 +4545,19 @@ var DropdownButton = styled.div(_templateObject2$6 || (_templateObject2$6 = _tag
4545
4545
  return '14px';
4546
4546
  }
4547
4547
  });
4548
- var TitleText = styled.div(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n width: max-content;\n position: relative;\n font-weight: 500;\n font-size: ", ";\n line-height: ", ";\n\n color: ", ";\n"])), function (_ref15) {
4549
- var $titleSize = _ref15.$titleSize,
4550
- $size = _ref15.$size;
4551
- return $titleSize ? $titleSize + "px" : $size === 'small' ? '14px' : $size === 'large' ? '18px' : '16px';
4548
+ var TitleText = styled.div(_templateObject3$4 || (_templateObject3$4 = _taggedTemplateLiteralLoose(["\n width: max-content;\n position: relative;\n font-weight: ", ";\n font-size: ", ";\n line-height: ", ";\n\n color: ", ";\n"])), function (_ref15) {
4549
+ var $titleWeight = _ref15.$titleWeight;
4550
+ return $titleWeight != null ? $titleWeight : '500';
4552
4551
  }, function (_ref16) {
4553
4552
  var $titleSize = _ref16.$titleSize,
4554
4553
  $size = _ref16.$size;
4555
4554
  return $titleSize ? $titleSize + "px" : $size === 'small' ? '14px' : $size === 'large' ? '18px' : '16px';
4556
4555
  }, function (_ref17) {
4557
- var $titleColor = _ref17.$titleColor;
4556
+ var $titleSize = _ref17.$titleSize,
4557
+ $size = _ref17.$size;
4558
+ return $titleSize ? $titleSize + "px" : $size === 'small' ? '14px' : $size === 'large' ? '18px' : '16px';
4559
+ }, function (_ref18) {
4560
+ var $titleColor = _ref18.$titleColor;
4558
4561
  switch ($titleColor) {
4559
4562
  case 'dark':
4560
4563
  return colorVariables.text.dark;
@@ -4577,24 +4580,24 @@ var TitleText = styled.div(_templateObject3$4 || (_templateObject3$4 = _taggedTe
4577
4580
  }
4578
4581
  });
4579
4582
  var Container$2 = styled.div(_templateObject4$3 || (_templateObject4$3 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n width: 100%;\n gap: 8px;\n"])));
4580
- var LabelText = styled.div(_templateObject5$3 || (_templateObject5$3 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 400;\n font-style:", ";\n color: ", ";\n"])), function (_ref18) {
4581
- var $labelStyle = _ref18.$labelStyle;
4583
+ var LabelText = styled.div(_templateObject5$3 || (_templateObject5$3 = _taggedTemplateLiteralLoose(["\n font-size: 14px;\n font-weight: 400;\n font-style:", ";\n color: ", ";\n"])), function (_ref19) {
4584
+ var $labelStyle = _ref19.$labelStyle;
4582
4585
  return $labelStyle;
4583
4586
  }, colorVariables.text.medium);
4584
- var DropdownMenu = styled.div(_templateObject6$3 || (_templateObject6$3 = _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 (_ref19) {
4585
- var $optionsBorderRadius = _ref19.$optionsBorderRadius;
4587
+ var DropdownMenu = styled.div(_templateObject6$3 || (_templateObject6$3 = _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) {
4588
+ var $optionsBorderRadius = _ref20.$optionsBorderRadius;
4586
4589
  return $optionsBorderRadius || '8px';
4587
- }, function (_ref20) {
4588
- var $width = _ref20.$width;
4589
- return $width ? $width : 'max-content';
4590
4590
  }, function (_ref21) {
4591
- var $menuBackground = _ref21.$menuBackground;
4591
+ var $width = _ref21.$width;
4592
+ return $width ? $width : 'max-content';
4593
+ }, function (_ref22) {
4594
+ var $menuBackground = _ref22.$menuBackground;
4592
4595
  return $menuBackground || colorVariables.accent.extraLight;
4593
4596
  });
4594
4597
  var SelectedOptionsWrapper = styled.div(_templateObject7$1 || (_templateObject7$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n flex-wrap: wrap;\n gap: 6px;\n height: 100%;\n"])));
4595
- var SelectedOptionDiv = styled.div(_templateObject8$1 || (_templateObject8$1 = _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 (_ref22) {
4596
- var $selectedOptionBackground = _ref22.$selectedOptionBackground,
4597
- $disabled = _ref22.$disabled;
4598
+ var SelectedOptionDiv = styled.div(_templateObject8$1 || (_templateObject8$1 = _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) {
4599
+ var $selectedOptionBackground = _ref23.$selectedOptionBackground,
4600
+ $disabled = _ref23.$disabled;
4598
4601
  switch ($selectedOptionBackground) {
4599
4602
  case 'dark':
4600
4603
  return colorVariables.text.dark;
@@ -4615,8 +4618,8 @@ var SelectedOptionDiv = styled.div(_templateObject8$1 || (_templateObject8$1 = _
4615
4618
  default:
4616
4619
  return $selectedOptionBackground || colorVariables.accent.extraLight;
4617
4620
  }
4618
- }, function (_ref23) {
4619
- var $selectedOptionColor = _ref23.$selectedOptionColor;
4621
+ }, function (_ref24) {
4622
+ var $selectedOptionColor = _ref24.$selectedOptionColor;
4620
4623
  switch ($selectedOptionColor) {
4621
4624
  case 'dark':
4622
4625
  return colorVariables.text.dark;
@@ -4638,67 +4641,68 @@ var SelectedOptionDiv = styled.div(_templateObject8$1 || (_templateObject8$1 = _
4638
4641
  return $selectedOptionColor;
4639
4642
  }
4640
4643
  });
4641
- var RemoveIcon = styled.div(_templateObject9$1 || (_templateObject9$1 = _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 (_ref24) {
4642
- var $disabled = _ref24.$disabled;
4644
+ var RemoveIcon = styled.div(_templateObject9$1 || (_templateObject9$1 = _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) {
4645
+ var $disabled = _ref25.$disabled;
4643
4646
  return $disabled ? 'not-allowed' : 'pointer';
4644
- }, function (_ref25) {
4645
- var removeIconBackground = _ref25.removeIconBackground,
4646
- $type = _ref25.$type;
4647
- return removeIconBackground ? removeIconBackground : $type === 'remove' ? '#5E5E5E24' : colorVariables.disabled.primary;
4648
4647
  }, function (_ref26) {
4649
- var $disabled = _ref26.$disabled;
4648
+ var removeIconBackground = _ref26.removeIconBackground,
4649
+ $type = _ref26.$type;
4650
+ return removeIconBackground ? removeIconBackground : $type === 'remove' ? '#5E5E5E24' : colorVariables.disabled.primary;
4651
+ }, function (_ref27) {
4652
+ var $disabled = _ref27.$disabled;
4650
4653
  return $disabled ? 'not-allowed' : 'pointer';
4651
4654
  });
4652
4655
  var TextWrapper = styled.div(_templateObject10$1 || (_templateObject10$1 = _taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n gap: 4px;\n"])));
4653
4656
  var Asterisk = styled.span(_templateObject11$1 || (_templateObject11$1 = _taggedTemplateLiteralLoose(["\n color: ", ";\n font-size: 10px;\n height: fit-content;\n position: absolute;\n top: -2px;\n right: -8px;\n"])), colorVariables["default"].error);
4654
- var MultiSelectDropdown = function MultiSelectDropdown(_ref27) {
4655
- var title = _ref27.title,
4656
- titleSize = _ref27.titleSize,
4657
- _ref27$titleColor = _ref27.titleColor,
4658
- titleColor = _ref27$titleColor === void 0 ? colorVariables.text.dark : _ref27$titleColor,
4659
- _ref27$labelText = _ref27.labelText,
4660
- labelText = _ref27$labelText === void 0 ? 'Select Cameras' : _ref27$labelText,
4661
- labelStyle = _ref27.labelStyle,
4662
- labelColor = _ref27.labelColor,
4663
- _ref27$replaceLabel = _ref27.replaceLabel,
4664
- replaceLabel = _ref27$replaceLabel === void 0 ? true : _ref27$replaceLabel,
4665
- options = _ref27.options,
4666
- width = _ref27.width,
4667
- optionWidth = _ref27.optionWidth,
4668
- height = _ref27.height,
4669
- placeholder = _ref27.placeholder,
4670
- border = _ref27.border,
4671
- _ref27$background = _ref27.background,
4672
- background = _ref27$background === void 0 ? colorVariables["default"].tertiary : _ref27$background,
4673
- selectedOptionBackground = _ref27.selectedOptionBackground,
4674
- selectedOptionColor = _ref27.selectedOptionColor,
4675
- _ref27$menuBackground = _ref27.menuBackground,
4676
- menuBackground = _ref27$menuBackground === void 0 ? 'white' : _ref27$menuBackground,
4677
- optionsBorderRadius = _ref27.optionsBorderRadius,
4678
- borderRadius = _ref27.borderRadius,
4679
- removeIconBackground = _ref27.removeIconBackground,
4680
- handleSelectChange = _ref27.handleSelectChange,
4681
- selectedOptions = _ref27.selectedOptions,
4682
- placeholderColor = _ref27.placeholderColor,
4683
- optionBorder = _ref27.optionBorder,
4684
- optionColor = _ref27.optionColor,
4685
- searchIcon = _ref27.searchIcon,
4686
- searchbarTextColor = _ref27.searchbarTextColor,
4687
- searchBoxBackground = _ref27.searchBoxBackground,
4688
- searchBoxBorder = _ref27.searchBoxBorder,
4689
- searchBoxBorderRadius = _ref27.searchBoxBorderRadius,
4690
- size = _ref27.size,
4691
- removeIcon = _ref27.removeIcon,
4692
- type = _ref27.type,
4693
- icon = _ref27.icon,
4694
- _ref27$disabled = _ref27.disabled,
4695
- disabled = _ref27$disabled === void 0 ? false : _ref27$disabled,
4696
- _ref27$required = _ref27.required,
4697
- required = _ref27$required === void 0 ? false : _ref27$required,
4698
- _ref27$searchBox = _ref27.searchBox,
4699
- searchBox = _ref27$searchBox === void 0 ? true : _ref27$searchBox,
4700
- _ref27$NoOptionsText = _ref27.NoOptionsText,
4701
- NoOptionsText = _ref27$NoOptionsText === void 0 ? 'No Options Available' : _ref27$NoOptionsText;
4657
+ var MultiSelectDropdown = function MultiSelectDropdown(_ref28) {
4658
+ var title = _ref28.title,
4659
+ titleWeight = _ref28.titleWeight,
4660
+ titleSize = _ref28.titleSize,
4661
+ _ref28$titleColor = _ref28.titleColor,
4662
+ titleColor = _ref28$titleColor === void 0 ? colorVariables.text.dark : _ref28$titleColor,
4663
+ _ref28$labelText = _ref28.labelText,
4664
+ labelText = _ref28$labelText === void 0 ? 'Select Cameras' : _ref28$labelText,
4665
+ labelStyle = _ref28.labelStyle,
4666
+ labelColor = _ref28.labelColor,
4667
+ _ref28$replaceLabel = _ref28.replaceLabel,
4668
+ replaceLabel = _ref28$replaceLabel === void 0 ? true : _ref28$replaceLabel,
4669
+ options = _ref28.options,
4670
+ width = _ref28.width,
4671
+ optionWidth = _ref28.optionWidth,
4672
+ height = _ref28.height,
4673
+ placeholder = _ref28.placeholder,
4674
+ border = _ref28.border,
4675
+ _ref28$background = _ref28.background,
4676
+ background = _ref28$background === void 0 ? colorVariables["default"].tertiary : _ref28$background,
4677
+ selectedOptionBackground = _ref28.selectedOptionBackground,
4678
+ selectedOptionColor = _ref28.selectedOptionColor,
4679
+ _ref28$menuBackground = _ref28.menuBackground,
4680
+ menuBackground = _ref28$menuBackground === void 0 ? 'white' : _ref28$menuBackground,
4681
+ optionsBorderRadius = _ref28.optionsBorderRadius,
4682
+ borderRadius = _ref28.borderRadius,
4683
+ removeIconBackground = _ref28.removeIconBackground,
4684
+ handleSelectChange = _ref28.handleSelectChange,
4685
+ selectedOptions = _ref28.selectedOptions,
4686
+ placeholderColor = _ref28.placeholderColor,
4687
+ optionBorder = _ref28.optionBorder,
4688
+ optionColor = _ref28.optionColor,
4689
+ searchIcon = _ref28.searchIcon,
4690
+ searchbarTextColor = _ref28.searchbarTextColor,
4691
+ searchBoxBackground = _ref28.searchBoxBackground,
4692
+ searchBoxBorder = _ref28.searchBoxBorder,
4693
+ searchBoxBorderRadius = _ref28.searchBoxBorderRadius,
4694
+ size = _ref28.size,
4695
+ removeIcon = _ref28.removeIcon,
4696
+ type = _ref28.type,
4697
+ icon = _ref28.icon,
4698
+ _ref28$disabled = _ref28.disabled,
4699
+ disabled = _ref28$disabled === void 0 ? false : _ref28$disabled,
4700
+ _ref28$required = _ref28.required,
4701
+ required = _ref28$required === void 0 ? false : _ref28$required,
4702
+ _ref28$searchBox = _ref28.searchBox,
4703
+ searchBox = _ref28$searchBox === void 0 ? true : _ref28$searchBox,
4704
+ _ref28$NoOptionsText = _ref28.NoOptionsText,
4705
+ NoOptionsText = _ref28$NoOptionsText === void 0 ? 'No Options Available' : _ref28$NoOptionsText;
4702
4706
  var _useState = useState(false),
4703
4707
  isOpen = _useState[0],
4704
4708
  setIsOpen = _useState[1];
@@ -4734,7 +4738,8 @@ var MultiSelectDropdown = function MultiSelectDropdown(_ref27) {
4734
4738
  return React.createElement(Container$2, null, title && React.createElement(TitleText, {
4735
4739
  "$titleColor": titleColor,
4736
4740
  "$titleSize": titleSize,
4737
- "$size": size
4741
+ "$size": size,
4742
+ "$titleWeight": titleWeight
4738
4743
  }, title, required && React.createElement(Asterisk, null, "*")), React.createElement(DropdownContainer, {
4739
4744
  ref: dropdownRef,
4740
4745
  "$width": width,