sag_components 2.0.0-beta130 → 2.0.0-beta131

package/dist/index.js

@@ -34344,7 +34344,7 @@ const Modal = styled__default["default"].div`
   display: flex;
   gap: 20px;
   padding: 20px;
-  margin-top: 40px;
+  margin-top: -30px;
   flex-direction: column;
   background-color: white;
   border-radius: 12px;
@@ -38206,9 +38206,6 @@ const TableBody = /*#__PURE__*/React$1.forwardRef(({
   }))));
 });
 
-// Add displayName for better debugging
-TableBody.displayName = 'TableBody';
-
 var nm$1 = "calendar_lottie";
 var ddd$1 = 0;
 var h$1 = 16;
@@ -41376,8 +41373,9 @@ var Lottie = function Lottie(props) {
 };
 
 // Table.jsx
-const Table = /*#__PURE__*/React$1.forwardRef((props, ref) => {
+const Table = props => {
   const {
+    ref,
     width = '100%',
     height = 'auto',
     tableTitle = 'All Events',
@@ -41535,10 +41533,7 @@ const Table = /*#__PURE__*/React$1.forwardRef((props, ref) => {
     animationData: LoadingAnimation,
     loop: true
   }), /*#__PURE__*/React__default["default"].createElement(LoadingText, null, isLoadingText)))));
-});
-
-// Add displayName for better debugging
-Table.displayName = 'Table';
+};
 
 const Card = styled__default["default"].div`
   background: ${props => props.backgroundColor};
@@ -51327,6 +51322,7 @@ const DropdownButton = styled__default["default"].button`
   border: 1px solid #8B8989;
   border-radius: 12px;
   padding: 17px;
+  height: ${props => props.height};
   text-align: left;
   cursor: pointer;
   display: flex;
@@ -51363,10 +51359,13 @@ const DropdownList = styled__default["default"].ul`
 const SectionTitle = styled__default["default"].li`
   font-size: 14px;
   color: #bdbdbd;
-  padding: 16px 12px 0 12px;
+  padding: 12px 12px 0 12px;
   font-weight: 500;
-  border-top: 1px solid #bdbdbd;
   pointer-events: none;
+  &:not(:first-child) {
+    border-top: 1px solid #bdbdbd;
+    padding-top: 16px;
+  }
 `;
 const DropdownItem = styled__default["default"].li`
   padding: 8px 16px;
@@ -51415,16 +51414,16 @@ styled__default["default"].div`
   white-space: pre-line;
 `;
 const Label$1 = styled__default["default"].label`
-  font-size: ${props => props.isFocused || props.hasValue ? '14px' : '14px'};
+  font-size: 14px;
   font-weight: 400;
   padding-inline-end: 5px;
   padding-inline-start: 5px;
   margin-right: 10px; 
   z-index: 2;
   color: ${props => props.error ? 'red' : props.disabled ? '#888' : props.labelColor};  
-  background-color: ${props => props.showLabelOnTop ? 'white' : 'transparent'} ;
+  background-color: ${props => props.disabled ? '#F2F2F2' : props.showLabelOnTop ? 'white' : 'transparent'};
   position: absolute;
-  top: ${props => props.isFocused || props.hasValue ? '0px' : '24px'};
+  top: ${props => props.isFocused || props.hasValue ? '0px' : '50%'};
   left: ${props => props.isFocused || props.hasValue ? '23px' : '14px'};
   transform: translateY(-50%);  
   transition: ${props => props.showLabelOnTop ? 'top 0.3s ease, font-size 0.3s ease, color 0.3s ease' : ''} ;
@@ -51660,6 +51659,7 @@ const OverlayDropdown = _ref => {
     hoverColor = '#E6F0F0',
     dropdownMaxHeight = '600px',
     width = '100%',
+    height = 'auto',
     label,
     labelEmptyValue,
     showLabelOnTop,
@@ -51890,6 +51890,7 @@ const OverlayDropdown = _ref => {
     onClick: toggleDropdown,
     disabled: disabled,
     isDarkerBackground: isDarkerBackground,
+    height: height,
     type: "button"
   }, /*#__PURE__*/React__default["default"].createElement(TruncatedText, {
     onMouseEnter: () => setHoveredText(selected?.label),