sag_components 2.0.0-beta281 → 2.0.0-beta283

package/dist/index.d.ts

@@ -1305,7 +1305,7 @@ declare function WeeksPicker({ label, disabled, borderColor, borderColorFocus, t
     restrictToRange?: boolean;
 }): react_jsx_runtime.JSX.Element;
 
-declare function Input({ label, labelEmptyValue, size, selectedValue, placeHolder, inputType, onChange, onClick, onBlur, required, disabled, isDarkerBackground, width, minWidth, height, error, errorMessage, labelColor, leftIcon, rightIcon, password, leftIconOnClick, rightIconOnClick, multiline, rows, maxLength, regex, onKeyDown, }: {
+declare function Input({ label, labelEmptyValue, size, selectedValue, placeHolder, inputType, onChange, onClick, onBlur, required, disabled, isDarkerBackground, width, minWidth, height, minHeight, error, errorMessage, labelColor, leftIcon, rightIcon, password, leftIconOnClick, rightIconOnClick, multiline, rows, maxLength, regex, onKeyDown, }: {
     label: any;
     labelEmptyValue: any;
     size: any;
@@ -1321,6 +1321,7 @@ declare function Input({ label, labelEmptyValue, size, selectedValue, placeHolde
     width: any;
     minWidth: any;
     height?: string;
+    minHeight: any;
     error: any;
     errorMessage: any;
     labelColor: any;
@@ -1345,6 +1346,7 @@ declare namespace Input {
         const required: PropTypes.Requireable<boolean>;
         const width: PropTypes.Requireable<string>;
         const minWidth: PropTypes.Requireable<string>;
+        const minHeight: PropTypes.Requireable<string>;
         const disabled: PropTypes.Requireable<boolean>;
         const error: PropTypes.Requireable<boolean>;
         const errorMessage: PropTypes.Requireable<string>;
@@ -1380,6 +1382,8 @@ declare namespace Input {
         export { width_1 as width };
         const minWidth_1: string;
         export { minWidth_1 as minWidth };
+        const minHeight_1: any;
+        export { minHeight_1 as minHeight };
         const disabled_1: boolean;
         export { disabled_1 as disabled };
         const error_1: boolean;

package/dist/index.esm.js

@@ -8768,6 +8768,7 @@ const DropdownWrapper$2 = styled.div`
   align-items: flex-start;
   width: ${props => props.width || '300px'};  
   height: ${props => props.height || '40px'};
+  min-height: ${props => props.minHeight || 'auto'};
   font-family: "Poppins", sans-serif;
   font-weight: 400;
   font-size: 14px;
@@ -8778,7 +8779,7 @@ const DropdownWrapper$2 = styled.div`
     top: 100%;
     left: 0;
     right: 0;
-    height: 2px;           // Creates invisible bridge for hover
+    height: 2px;
     z-index: 99;
     pointer-events: none;
   }
@@ -8939,6 +8940,7 @@ const DropdownSingleNew = ({
   disabled,
   width,
   height,
+  minHeight,
   withMarginBottom = true,
   error,
   errorMessage,
@@ -9117,10 +9119,10 @@ const DropdownSingleNew = ({
   };
   return /*#__PURE__*/React$1.createElement(DropdownWrapper$2, {
     className: "DropdownWrapper",
-    ref: dropdownRef // Add ref to the wrapper
-    ,
+    ref: dropdownRef,
     width: width,
     height: height,
+    minHeight: minHeight,
     onMouseEnter: () => setHoverInputContainer(true),
     onMouseLeave: () => setHoverInputContainer(false)
   }, /*#__PURE__*/React$1.createElement(InputContainer$8, {
@@ -9262,6 +9264,7 @@ const DropdownWrapper$1 = styled.div`
   align-items: flex-start;
   width: ${props => props.width || '300px'};  
   height: ${props => props.height || '50px'};
+  min-height: ${props => props.minHeight || 'auto'};
   font-family: "Poppins", sans-serif;
   font-weight: 400;
   font-size: 14px;
@@ -9272,7 +9275,7 @@ const DropdownWrapper$1 = styled.div`
     top: 100%;
     left: 0;
     right: 0;
-    height: 2px;           // Creates invisible bridge for hover
+    height: 2px;
     z-index: 99;
     pointer-events: none;
   }
@@ -9462,6 +9465,7 @@ const DropdownMultiNew = ({
   disabled,
   width,
   height,
+  minHeight,
   withMarginBottom = true,
   error,
   errorMessage,
@@ -9638,6 +9642,7 @@ const DropdownMultiNew = ({
     className: "DropdownWrapper",
     width: width,
     height: height,
+    minHeight: minHeight,
     onMouseEnter: () => setHoverInputContainer(true),
     onMouseLeave: () => setHoverInputContainer(false)
   }, /*#__PURE__*/React$1.createElement(InputContainer$7, {
@@ -9736,6 +9741,7 @@ const DropdownMain = styled.div`
   align-items: flex-start;
   width: ${props => props.width || '300px'};  
   height: ${props => props.height || '50px'};
+  min-height: ${props => props.minHeight || 'auto'};
   font-family: "Poppins", sans-serif;
   font-weight: 400;
   font-size: 14px;
@@ -9757,6 +9763,7 @@ const DropdownNew = props => {
     disabled = false,
     width = "300px",
     height = "52px",
+    minHeight = "",
     withMarginBottom = true,
     error = false,
     showLabelOnTop = true,
@@ -9776,7 +9783,8 @@ const DropdownNew = props => {
   return /*#__PURE__*/React$1.createElement(DropdownMain, {
     className: "DropdownMain",
     width: width,
-    height: height
+    height: height,
+    minHeight: minHeight
   }, isMulti ? /*#__PURE__*/React$1.createElement(DropdownMultiNew, {
     className: "DropdownMultiNew",
     placeHolder: placeHolder,
@@ -9788,6 +9796,7 @@ const DropdownNew = props => {
     options: options,
     width: width,
     height: height,
+    minHeight: minHeight,
     withMarginBottom: withMarginBottom,
     disabled: disabled,
     error: error,
@@ -9809,6 +9818,7 @@ const DropdownNew = props => {
     options: options,
     width: width,
     height: height,
+    minHeight: minHeight,
     withMarginBottom: withMarginBottom,
     disabled: disabled,
     error: error,
@@ -10580,23 +10590,24 @@ const QuarterPopupPicker = ({
 };
 
 /* eslint-disable import/no-extraneous-dependencies */
-const QuarterPicker = ({
-  availableQuarters,
-  // ["Q1-2024"]
-  label,
-  onChange,
-  borderRadius,
-  required,
-  width,
-  height,
-  placeholder,
-  disabled,
-  borderColor,
-  borderColorFocus,
-  textColor,
-  selectedValue,
-  startYear
-}) => {
+const QuarterPicker = _ref => {
+  let {
+    availableQuarters,
+    // ["Q1-2024"]
+    label,
+    onChange,
+    borderRadius,
+    required,
+    width,
+    height,
+    placeholder,
+    disabled,
+    borderColor,
+    borderColorFocus,
+    textColor,
+    selectedValue,
+    startYear
+  } = _ref;
   const [isFocused, setIsFocused] = useState(false);
   const [isOpen, setIsOpen] = useState(false);
   const [value, setValue] = useState('');
@@ -11038,22 +11049,23 @@ const MonthPopupPicker = ({
 };
 
 /* eslint-disable import/no-extraneous-dependencies */
-const MonthPicker = ({
-  availableMonths,
-  label,
-  onChange,
-  borderRadius,
-  required,
-  width,
-  height,
-  placeholder,
-  disabled,
-  borderColor,
-  borderColorFocus,
-  textColor,
-  selectedValue,
-  startYear
-}) => {
+const MonthPicker = _ref => {
+  let {
+    availableMonths,
+    label,
+    onChange,
+    borderRadius,
+    required,
+    width,
+    height,
+    placeholder,
+    disabled,
+    borderColor,
+    borderColorFocus,
+    textColor,
+    selectedValue,
+    startYear
+  } = _ref;
   const [isFocused, setIsFocused] = useState(false);
   const [isOpen, setIsOpen] = useState(false);
   const [value, setValue] = useState('');
@@ -24164,21 +24176,22 @@ const DeleteIcon = styled.div`
   position: absolute;
 `;
 
-const QuickFilterDropdownSingle = ({
-  label,
-  hoverColor,
-  options,
-  selectedValue,
-  placeHolder,
-  onChange,
-  disabled,
-  width,
-  error,
-  errorMessage,
-  xIconShow,
-  labelColor,
-  showLabelOnTop
-}) => {
+const QuickFilterDropdownSingle = _ref => {
+  let {
+    label,
+    hoverColor,
+    options,
+    selectedValue,
+    placeHolder,
+    onChange,
+    disabled,
+    width,
+    error,
+    errorMessage,
+    xIconShow,
+    labelColor,
+    showLabelOnTop
+  } = _ref;
   const [isFocused, setIsFocused] = useState(false);
   const [showOptions, setShowOptions] = useState(false);
   const [inputValue, setInputValue] = useState("");
@@ -35655,7 +35668,7 @@ const MainContainer = styled.div`
   width: ${props => props.width || '300px'};
   min-width: ${props => props.minWidth || 'unset'};
   height: ${props => props.height || '45px'};  
-  min-height: ${props => props.multiline ? '80px' : 'auto'};
+  min-height: ${props => props.minHeight || (props.multiline ? '80px' : 'auto')};
   font-family: "Poppins", sans-serif;
   font-weight: 400;
   font-size: 14px;
@@ -35677,7 +35690,10 @@ const Label$3 = styled.label`
   if (props.multiline) {
     return props.isFocused || props.hasValue ? '0px' : '20px';
   }
-  return props.isFocused || props.hasValue ? '0px' : props.size === 'medium' ? '50%' : '17px';
+  if (props.isFocused || props.hasValue) {
+    return '0px';
+  }
+  return props.size === 'medium' ? '26px' : '17px';
 }};
   left: ${props => {
   if (props.multiline) {
@@ -35844,6 +35860,7 @@ const Input$2 = _ref => {
     width,
     minWidth,
     height = "50px",
+    minHeight,
     error,
     errorMessage,
     labelColor,
@@ -35963,6 +35980,7 @@ const Input$2 = _ref => {
     className: "MainContainer",
     width: width,
     height: calculateHeight(),
+    minHeight: minHeight,
     size: size,
     disabled: disabled,
     isDarkerBackground: isDarkerBackground,
@@ -36049,6 +36067,7 @@ Input$2.propTypes = {
   required: PropTypes.bool,
   width: PropTypes.string,
   minWidth: PropTypes.string,
+  minHeight: PropTypes.string,
   disabled: PropTypes.bool,
   error: PropTypes.bool,
   errorMessage: PropTypes.string,
@@ -36076,6 +36095,7 @@ Input$2.defaultProps = {
   required: true,
   width: "300px",
   minWidth: "unset",
+  minHeight: undefined,
   disabled: false,
   error: false,
   errorMessage: "",
@@ -36164,9 +36184,9 @@ const ToggleSlider = styled.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 {