sag_components 2.0.0-beta196 → 2.0.0-beta197

package/dist/index.esm.js

@@ -35023,28 +35023,22 @@ const StyledInput$1 = styled.input`
   box-sizing: border-box;
   color: ${props => props.disabled ? '#888' : (props.isFocused || props.value ? props.textColor : '#757575') || '#333'};
   cursor: ${props => props.disabled ? 'not-allowed' : 'text'};
-  
-  &:disabled {
-    background-color: #f5f5f5;
-    cursor: not-allowed;
-  }
 `;
 const StyledLabel = styled.label`
   font-size: 14px;
+  /* width: ${props => props.isFocused || props.hasValue ? 'auto' : '150px'}; */
   color: ${props => props.disabled ? '#888' : (props.isFocused || props.hasValue ? props.borderColorFocus : '#757575') || '#333'};
   position: absolute;
   top: ${props => props.isFocused || props.hasValue ? '0px' : '50%'};
   left: 15px;
   background-color: ${props => props.isFocused || props.hasValue ? 'white' : 'transparent'};
   transform: translateY(-50%);
-  transition: top 0.3s ease, font-size 0.3s ease, color 0.3s ease;
+  transition: top 0.3s ease, font-size 0.3s ease;
   display: flex;
   font-weight: 400;
   align-items: center;
   box-sizing: border-box;
-  cursor: ${props => props.disabled ? 'not-allowed' : 'pointer'};
-  padding: 0 4px;
-  z-index: 1;
+  cursor: pointer;
 `;
 const RequiredIndicator = styled.span`
   color: red;
@@ -35060,13 +35054,9 @@ const OptionsContainer = styled.div`
   z-index: 999;
   ${props => props.showAbove ? `
     bottom: 100%;
-    margin-bottom: 4px;
   ` : `
     top: 100%;
-    margin-top: 4px;
   `}
-  left: 0;
-  right: 0;
 `;
 const InputContainer$1 = styled.div`
   display: flex;       
@@ -35079,22 +35069,20 @@ const InputContainer$1 = styled.div`
   width: 100%;
   height: 100%;    
   box-sizing: border-box;
-  background-color: ${props => props.disabled ? '#f5f5f5' : 'transparent'};    
-  border: 1px solid ${props => props.disabled ? '#bdbdbd' : props.error ? 'red' : '#B1B1B1'};
+  background-color: transparent;    
+  border:  1px solid ${props => props.disabled ? '#bdbdbd' : props.error ? 'red' : '#B1B1B1'};
   font-weight: 400;
   font-size: 14px;
   border-radius: 12px;
   outline: none;
   color: ${props => props.disabled ? '#888' : '#212121'};
-  position: relative;
-  transition: border-color 0.3s ease, background-color 0.3s ease;
    
   &:hover {
     border: 1px solid ${props => props.disabled ? '#bdbdbd' : props.error ? 'red' : props.borderColorFocus || '#212121'};
     cursor: ${props => props.disabled ? 'not-allowed' : 'pointer'};
   }
 
-  &:focus-within {  
+  &:focus {  
     border: 1px solid ${props => props.disabled ? '#bdbdbd' : props.error ? 'red' : props.borderColorFocus || '#212121'}; 
   }
 `;
@@ -35104,11 +35092,6 @@ const CalendarDiv = styled.div`
   right: 10px;
   display: flex;
   align-items: center;
-  cursor: ${props => props.disabled ? 'not-allowed' : 'pointer'};
-  
-  svg {
-    transition: fill 0.3s ease;
-  }
 `;
 
 // src/components/WeeksPicker/WeeksPicker.jsx