sag_components 2.0.0-beta160 → 2.0.0-beta161

package/dist/index.js

@@ -8620,6 +8620,7 @@ const DropdownWrapper$2 = styled__default["default"].div`
   justify-content: center;
   align-items: flex-start;
   width: ${props => props.width || '300px'};  
+  height: ${props => props.height || '40px'};
   font-family: "Poppins", sans-serif;
   font-weight: 400;
   font-size: 14px;
@@ -8645,7 +8646,10 @@ const Label$8 = styled__default["default"].label`
   color: ${props => props.error ? 'red' : props.disabled ? '#888' : props.labelColor};  
   background-color: ${props => props.showLabelOnTop ? 'white' : 'transparent'} ;
   position: absolute;
-  top: ${props => props.isFocused || props.hasValue ? '0px' : '28px'};
+  top: ${props => {
+  const height = parseInt(props.height.replace('px', ''), 10);
+  return props.isFocused || props.hasValue ? '0px' : `${height / 2}px`;
+}};
   left: ${props => props.isFocused || props.hasValue ? '23px' : '10px'};
   transform: translateY(-50%);  
   transition: ${props => props.showLabelOnTop ? 'top 0.3s ease, font-size 0.3s ease, color 0.3s ease' : ''} ;
@@ -8787,6 +8791,7 @@ const DropdownSingleNew = ({
   required,
   disabled,
   width,
+  height,
   withMarginBottom = true,
   error,
   errorMessage,
@@ -8942,6 +8947,7 @@ const DropdownSingleNew = ({
   return /*#__PURE__*/React__default["default"].createElement(DropdownWrapper$2, {
     className: "DropdownWrapper",
     width: width,
+    height: height,
     onMouseEnter: () => setHoverInputContainer(true),
     onMouseLeave: () => setHoverInputContainer(false)
   }, /*#__PURE__*/React__default["default"].createElement(InputContainer$8, {
@@ -8963,6 +8969,7 @@ const DropdownSingleNew = ({
     labelColor: labelColor,
     hasValue: selectedOptions?.length > 0 || inputValue,
     disabled: disabled,
+    height: height,
     error: error,
     errorMessage: errorMessage,
     onClick: handleLabelClick,
@@ -9079,6 +9086,7 @@ const DropdownWrapper$1 = styled__default["default"].div`
   justify-content: center;
   align-items: flex-start;
   width: ${props => props.width || '300px'};  
+  height: ${props => props.height || '50px'};
   font-family: "Poppins", sans-serif;
   font-weight: 400;
   font-size: 14px;
@@ -9104,7 +9112,10 @@ const Label$7 = styled__default["default"].label`
   color: ${props => props.error ? 'red' : props.disabled ? '#888' : props.labelColor};
   background-color: ${props => props.showLabelOnTop ? 'white' : 'transparent'} ;
   position: absolute;
-  top: ${props => props.isFocused || props.hasValue ? '0px' : '27px'};
+  top: ${props => {
+  const height = parseInt(props.height.replace('px', ''), 10);
+  return props.isFocused || props.hasValue ? '0px' : `${height / 2}px`;
+}};
   left: ${props => props.isFocused || props.hasValue ? '23px' : '10px'};
   font-family: Poppins;  
   transform: translateY(-50%);
@@ -9449,6 +9460,7 @@ const DropdownMultiNew = ({
   return /*#__PURE__*/React__default["default"].createElement(DropdownWrapper$1, {
     className: "DropdownWrapper",
     width: width,
+    height: height,
     onMouseEnter: () => setHoverInputContainer(true),
     onMouseLeave: () => setHoverInputContainer(false)
   }, /*#__PURE__*/React__default["default"].createElement(InputContainer$7, {
@@ -9471,6 +9483,7 @@ const DropdownMultiNew = ({
     labelColor: labelColor,
     hasValue: selectedOptions?.length > 0 || inputValue,
     disabled: disabled,
+    height: height,
     error: error,
     errorMessage: errorMessage,
     onClick: handleLabelClick,
@@ -9545,6 +9558,7 @@ const DropdownMain = styled__default["default"].div`
   justify-content: center;
   align-items: flex-start;
   width: ${props => props.width || '300px'};  
+  height: ${props => props.height || '50px'};
   font-family: "Poppins", sans-serif;
   font-weight: 400;
   font-size: 14px;
@@ -9565,6 +9579,7 @@ const DropdownNew = props => {
     required = false,
     disabled = false,
     width = "300px",
+    height = "52px",
     withMarginBottom = true,
     error = false,
     showLabelOnTop = true,
@@ -9583,7 +9598,8 @@ const DropdownNew = props => {
   };
   return /*#__PURE__*/React__default["default"].createElement(DropdownMain, {
     className: "DropdownMain",
-    width: width
+    width: width,
+    height: height
   }, isMulti ? /*#__PURE__*/React__default["default"].createElement(DropdownMultiNew, {
     className: "DropdownMultiNew",
     placeHolder: placeHolder,
@@ -9594,6 +9610,7 @@ const DropdownNew = props => {
     required: required,
     options: options,
     width: width,
+    height: height,
     withMarginBottom: withMarginBottom,
     disabled: disabled,
     error: error,
@@ -9614,6 +9631,7 @@ const DropdownNew = props => {
     required: required,
     options: options,
     width: width,
+    height: height,
     withMarginBottom: withMarginBottom,
     disabled: disabled,
     error: error,
@@ -10385,24 +10403,23 @@ const QuarterPopupPicker = ({
 };
 
 /* eslint-disable import/no-extraneous-dependencies */
-const QuarterPicker = _ref => {
-  let {
-    availableQuarters,
-    // ["Q1-2024"]
-    label,
-    onChange,
-    borderRadius,
-    required,
-    width,
-    height,
-    placeholder,
-    disabled,
-    borderColor,
-    borderColorFocus,
-    textColor,
-    selectedValue,
-    startYear
-  } = _ref;
+const QuarterPicker = ({
+  availableQuarters,
+  // ["Q1-2024"]
+  label,
+  onChange,
+  borderRadius,
+  required,
+  width,
+  height,
+  placeholder,
+  disabled,
+  borderColor,
+  borderColorFocus,
+  textColor,
+  selectedValue,
+  startYear
+}) => {
   const [isFocused, setIsFocused] = React$1.useState(false);
   const [isOpen, setIsOpen] = React$1.useState(false);
   const [value, setValue] = React$1.useState('');
@@ -10844,23 +10861,22 @@ const MonthPopupPicker = ({
 };
 
 /* eslint-disable import/no-extraneous-dependencies */
-const MonthPicker = _ref => {
-  let {
-    availableMonths,
-    label,
-    onChange,
-    borderRadius,
-    required,
-    width,
-    height,
-    placeholder,
-    disabled,
-    borderColor,
-    borderColorFocus,
-    textColor,
-    selectedValue,
-    startYear
-  } = _ref;
+const MonthPicker = ({
+  availableMonths,
+  label,
+  onChange,
+  borderRadius,
+  required,
+  width,
+  height,
+  placeholder,
+  disabled,
+  borderColor,
+  borderColorFocus,
+  textColor,
+  selectedValue,
+  startYear
+}) => {
   const [isFocused, setIsFocused] = React$1.useState(false);
   const [isOpen, setIsOpen] = React$1.useState(false);
   const [value, setValue] = React$1.useState('');
@@ -23971,22 +23987,21 @@ const DeleteIcon = styled__default["default"].div`
   position: absolute;
 `;
 
-const QuickFilterDropdownSingle = _ref => {
-  let {
-    label,
-    hoverColor,
-    options,
-    selectedValue,
-    placeHolder,
-    onChange,
-    disabled,
-    width,
-    error,
-    errorMessage,
-    xIconShow,
-    labelColor,
-    showLabelOnTop
-  } = _ref;
+const QuickFilterDropdownSingle = ({
+  label,
+  hoverColor,
+  options,
+  selectedValue,
+  placeHolder,
+  onChange,
+  disabled,
+  width,
+  error,
+  errorMessage,
+  xIconShow,
+  labelColor,
+  showLabelOnTop
+}) => {
   const [isFocused, setIsFocused] = React$1.useState(false);
   const [showOptions, setShowOptions] = React$1.useState(false);
   const [inputValue, setInputValue] = React$1.useState("");
@@ -24383,24 +24398,23 @@ const IconContainer$2 = styled__default["default"].div`
   cursor:  pointer;  
 `;
 
-const QuickFilterDropdownMultiSelection = _ref => {
-  let {
-    label,
-    labelEmptyValue,
-    options,
-    selectedValue,
-    placeHolder,
-    onChange,
-    required,
-    disabled,
-    width,
-    error,
-    errorMessage,
-    labelColor,
-    xIconShow,
-    checkBoxColor,
-    showLabelOnTop
-  } = _ref;
+const QuickFilterDropdownMultiSelection = ({
+  label,
+  labelEmptyValue,
+  options,
+  selectedValue,
+  placeHolder,
+  onChange,
+  required,
+  disabled,
+  width,
+  error,
+  errorMessage,
+  labelColor,
+  xIconShow,
+  checkBoxColor,
+  showLabelOnTop
+}) => {
   const [isFocused, setIsFocused] = React$1.useState(false);
   const [showOptions, setShowOptions] = React$1.useState(false);
   const [inputValue, setInputValue] = React$1.useState('');
@@ -35632,9 +35646,9 @@ const ToggleSlider = styled__default["default"].span`
   }
 `;
 
-/**
- * ToggleSwitch component for on/off states.
- * Supports small/large sizes and disabled state.
+/**
+ * ToggleSwitch component for on/off states.
+ * Supports small/large sizes and disabled state.
  */
 function ToggleSwitch(_ref) {
   let {