sag_components 2.0.0-beta302 → 2.0.0-beta304

package/dist/index.esm.js

@@ -3744,14 +3744,24 @@ const LinnerDataBox = props => {
 const TextFieldContainer = styled.div`
     position: relative;
     width: ${props => props.width};
+    display: flex;
+    align-items: center;
+    align-self: flex-end;
 `;
 const IconWrapper$3 = styled.div`
   position: absolute;
-  top: 50%;
-  transform: translateY(-50%);
   left: ${props => props.position === 'left' ? '10px' : 'unset'};
   right: ${props => props.position === 'right' ? '10px' : 'unset'};
   cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  pointer-events: none;
+  
+  & > * {
+    display: block;
+  }
 `;
 const TextFieldInput = styled.input`
   width: 100%;
@@ -3760,14 +3770,17 @@ const TextFieldInput = styled.input`
   font-weight: 400;
   padding: 6px 16px;
   border-radius: 8px;
-  padding-right: ${props => props.position === 'right' ? '30px' : '10px'};
+  padding-left: ${props => props.position === 'left' ? '40px' : '16px'};
+  padding-right: ${props => props.position === 'right' ? '40px' : '16px'};
   border: 1px solid #B1B1B1;
   background: transparent;
-  text-indent: ${props => props.position === 'left' ? '14px' : '0'};
+  box-sizing: border-box;
+  
   &:hover, 
   &:focus {
     border: 1px solid #212121;
   }
+  
   &::placeholder {
     color: #B1B1B1;
   }
@@ -10608,23 +10621,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('');
@@ -11066,22 +11080,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('');
@@ -24192,21 +24207,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("");
@@ -24658,25 +24674,26 @@ const IconContainer$2 = styled.div`
   cursor:  pointer;
 `;
 
-const QuickFilterDropdownMultiSelection = ({
-  label,
-  labelEmptyValue,
-  options,
-  selectedValue,
-  placeHolder,
-  onChange,
-  required,
-  disabled,
-  width,
-  height,
-  error,
-  errorMessage,
-  labelColor,
-  xIconShow,
-  checkBoxColor,
-  showLabelOnTop,
-  dropdownHeight
-}) => {
+const QuickFilterDropdownMultiSelection = _ref => {
+  let {
+    label,
+    labelEmptyValue,
+    options,
+    selectedValue,
+    placeHolder,
+    onChange,
+    required,
+    disabled,
+    width,
+    height,
+    error,
+    errorMessage,
+    labelColor,
+    xIconShow,
+    checkBoxColor,
+    showLabelOnTop,
+    dropdownHeight
+  } = _ref;
   const [isFocused, setIsFocused] = useState(false);
   const [showOptions, setShowOptions] = useState(false);
   const [inputValue, setInputValue] = useState('');
@@ -36216,9 +36233,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 {
@@ -43378,7 +43395,9 @@ const TableBody = /*#__PURE__*/forwardRef(({
           }
         case "status":
           try {
-            const statusObj = statuses.find(status => status && status.status === value) || {};
+            // Treat "Submitted" like "Received"
+            const normalizedStatus = value === "Submitted" ? "Received" : value;
+            const statusObj = statuses.find(status => status && status.status === normalizedStatus) || {};
             const palette = statusObj.palette || ["#F3F4F6", "#374151"];
             const [palette0, palette1] = palette;
             return /*#__PURE__*/React$1.createElement(StatusCell$1, {