sag_components 2.0.0-beta279 → 2.0.0-beta280

package/dist/index.js

@@ -10590,24 +10590,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('');
@@ -11049,23 +11048,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('');
@@ -12265,16 +12263,13 @@ const Td$1 = styled__default["default"].td`
 `;
 const Tr = styled__default["default"].tr`
   border-bottom: 1px solid #f3f4f6;
-  ${_ref => {
-  let {
-    enableHover,
-    selectHoverColor
-  } = _ref;
-  return enableHover && `&:hover {
+  ${({
+  enableHover,
+  selectHoverColor
+}) => enableHover && `&:hover {
       background-color: ${selectHoverColor};
       cursor: pointer;
-    }`;
-}}
+    }`}
 `;
 const InfoText = styled__default["default"].div`
   font-weight: 400;
@@ -24176,22 +24171,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("");
@@ -24643,26 +24637,25 @@ const IconContainer$2 = styled__default["default"].div`
   cursor:  pointer;
 `;
 
-const QuickFilterDropdownMultiSelection = _ref => {
-  let {
-    label,
-    labelEmptyValue,
-    options,
-    selectedValue,
-    placeHolder,
-    onChange,
-    required,
-    disabled,
-    width,
-    height,
-    error,
-    errorMessage,
-    labelColor,
-    xIconShow,
-    checkBoxColor,
-    showLabelOnTop,
-    dropdownHeight
-  } = _ref;
+const QuickFilterDropdownMultiSelection = ({
+  label,
+  labelEmptyValue,
+  options,
+  selectedValue,
+  placeHolder,
+  onChange,
+  required,
+  disabled,
+  width,
+  height,
+  error,
+  errorMessage,
+  labelColor,
+  xIconShow,
+  checkBoxColor,
+  showLabelOnTop,
+  dropdownHeight
+}) => {
   const [isFocused, setIsFocused] = React$1.useState(false);
   const [showOptions, setShowOptions] = React$1.useState(false);
   const [inputValue, setInputValue] = React$1.useState('');
@@ -36178,9 +36171,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 {
@@ -37022,104 +37015,104 @@ const LoadingText = styled__default["default"].span`
 const rotation = styled.keyframes`
   0%, 100% {
       box-shadow: 
-          0px -8.32px 0px 0px #1F7677, 
-          5.76px -5.76px 0 0px rgba(31, 118, 119,0.2), 
-          8px 0px 0 0px rgba(31, 118, 119,0.2), 
-          5.6px 5.6px 0 0px rgba(31, 118, 119,0.2), 
-          0px 8px 0 0px rgba(31, 118, 119,0.2), 
-          -5.76px 5.76px 0 0px rgba(31, 118, 119,0.2), 
-          -8.32px 0px 0 0px rgba(31, 118, 119,0.5), 
-          -5.76px -5.76px 0 0px rgba(31, 118, 119,0.7);
+          0px -24.96px 0px 0px #1F7677, 
+          17.28px -17.28px 0 0px rgba(31, 118, 119,0.2), 
+          24px 0px 0 0px rgba(31, 118, 119,0.2), 
+          16.8px 16.8px 0 0px rgba(31, 118, 119,0.2), 
+          0px 24px 0 0px rgba(31, 118, 119,0.2), 
+          -17.28px 17.28px 0 0px rgba(31, 118, 119,0.2), 
+          -24.96px 0px 0 0px rgba(31, 118, 119,0.5), 
+          -17.28px -17.28px 0 0px rgba(31, 118, 119,0.7);
   }
 
   12.5% {
       box-shadow: 
-          0px -8.32px 0px 0px rgba(31, 118, 119,0.7), 
-          5.76px -5.76px 0 0px #1F7677, 
-          8px 0px 0 0px rgba(31, 118, 119,0.2), 
-          5.6px 5.6px 0 0px rgba(31, 118, 119,0.2), 
-          0px 8px 0 0px rgba(31, 118, 119,0.2), 
-          -5.76px 5.76px 0 0px rgba(31, 118, 119,0.2), 
-          -8.32px 0px 0 0px rgba(31, 118, 119,0.2), 
-          -5.76px -5.76px 0 0px rgba(31, 118, 119,0.5);
+          0px -24.96px 0px 0px rgba(31, 118, 119,0.7), 
+          17.28px -17.28px 0 0px #1F7677, 
+          24px 0px 0 0px rgba(31, 118, 119,0.2), 
+          16.8px 16.8px 0 0px rgba(31, 118, 119,0.2), 
+          0px 24px 0 0px rgba(31, 118, 119,0.2), 
+          -17.28px 17.28px 0 0px rgba(31, 118, 119,0.2), 
+          -24.96px 0px 0 0px rgba(31, 118, 119,0.2), 
+          -17.28px -17.28px 0 0px rgba(31, 118, 119,0.5);
   }
 
   25% {
       box-shadow: 
-          0px -8.32px 0px 0px rgba(31, 118, 119,0.5), 
-          5.76px -5.76px 0 0px rgba(31, 118, 119,0.7), 
-          8px 0px 0 0px #1F7677, 
-          5.6px 5.6px 0 0px rgba(31, 118, 119,0.2), 
-          0px 8px 0 0px rgba(31, 118, 119,0.2), 
-          -5.76px 5.76px 0 0px rgba(31, 118, 119,0.2), 
-          -8.32px 0px 0 0px rgba(31, 118, 119,0.2), 
-          -5.76px -5.76px 0 0px rgba(31, 118, 119,0.2);
+          0px -24.96px 0px 0px rgba(31, 118, 119,0.5), 
+          17.28px -17.28px 0 0px rgba(31, 118, 119,0.7), 
+          24px 0px 0 0px #1F7677, 
+          16.8px 16.8px 0 0px rgba(31, 118, 119,0.2), 
+          0px 24px 0 0px rgba(31, 118, 119,0.2), 
+          -17.28px 17.28px 0 0px rgba(31, 118, 119,0.2), 
+          -24.96px 0px 0 0px rgba(31, 118, 119,0.2), 
+          -17.28px -17.28px 0 0px rgba(31, 118, 119,0.2);
   }
 
   37.5% {
       box-shadow: 
-          0px -8.32px 0px 0px rgba(31, 118, 119,0.2), 
-          5.76px -5.76px 0 0px rgba(31, 118, 119,0.5), 
-          8px 0px 0 0px rgba(31, 118, 119,0.7), 
-          5.6px 5.6px 0 0px #1F7677, 
-          0px 8px 0 0px rgba(31, 118, 119,0.2), 
-          -5.76px 5.76px 0 0px rgba(31, 118, 119,0.2), 
-          -8.32px 0px 0 0px rgba(31, 118, 119,0.2), 
-          -5.76px -5.76px 0 0px rgba(31, 118, 119,0.2);
+          0px -24.96px 0px 0px rgba(31, 118, 119,0.2), 
+          17.28px -17.28px 0 0px rgba(31, 118, 119,0.5), 
+          24px 0px 0 0px rgba(31, 118, 119,0.7), 
+          16.8px 16.8px 0 0px #1F7677, 
+          0px 24px 0 0px rgba(31, 118, 119,0.2), 
+          -17.28px 17.28px 0 0px rgba(31, 118, 119,0.2), 
+          -24.96px 0px 0 0px rgba(31, 118, 119,0.2), 
+          -17.28px -17.28px 0 0px rgba(31, 118, 119,0.2);
   }
 
   50% {
       box-shadow: 
-          0px -8.32px 0px 0px rgba(31, 118, 119,0.2), 
-          5.76px -5.76px 0 0px rgba(31, 118, 119,0.2), 
-          8px 0px 0 0px rgba(31, 118, 119,0.5), 
-          5.6px 5.6px 0 0px rgba(31, 118, 119,0.7), 
-          0px 8px 0 0px #1F7677, 
-          -5.76px 5.76px 0 0px rgba(31, 118, 119,0.2), 
-          -8.32px 0px 0 0px rgba(31, 118, 119,0.2), 
-          -5.76px -5.76px 0 0px rgba(31, 118, 119,0.2);
+          0px -24.96px 0px 0px rgba(31, 118, 119,0.2), 
+          17.28px -17.28px 0 0px rgba(31, 118, 119,0.2), 
+          24px 0px 0 0px rgba(31, 118, 119,0.5), 
+          16.8px 16.8px 0 0px rgba(31, 118, 119,0.7), 
+          0px 24px 0 0px #1F7677, 
+          -17.28px 17.28px 0 0px rgba(31, 118, 119,0.2), 
+          -24.96px 0px 0 0px rgba(31, 118, 119,0.2), 
+          -17.28px -17.28px 0 0px rgba(31, 118, 119,0.2);
   }
 
   62.5% {
       box-shadow: 
-          0px -8.32px 0px 0px rgba(31, 118, 119,0.2), 
-          5.76px -5.76px 0 0px rgba(31, 118, 119,0.2), 
-          8px 0px 0 0px rgba(31, 118, 119,0.2), 
-          5.6px 5.6px 0 0px rgba(31, 118, 119,0.5), 
-          0px 8px 0 0px rgba(31, 118, 119,0.7), 
-          -5.76px 5.76px 0 0px #1F7677, 
-          -8.32px 0px 0 0px rgba(31, 118, 119,0.2), 
-          -5.76px -5.76px 0 0px rgba(31, 118, 119,0.2);
+          0px -24.96px 0px 0px rgba(31, 118, 119,0.2), 
+          17.28px -17.28px 0 0px rgba(31, 118, 119,0.2), 
+          24px 0px 0 0px rgba(31, 118, 119,0.2), 
+          16.8px 16.8px 0 0px rgba(31, 118, 119,0.5), 
+          0px 24px 0 0px rgba(31, 118, 119,0.7), 
+          -17.28px 17.28px 0 0px #1F7677, 
+          -24.96px 0px 0 0px rgba(31, 118, 119,0.2), 
+          -17.28px -17.28px 0 0px rgba(31, 118, 119,0.2);
   }
 
   75% {
       box-shadow: 
-          0px -8.32px 0px 0px rgba(31, 118, 119,0.2), 
-          5.76px -5.76px 0 0px rgba(31, 118, 119,0.2), 
-          8px 0px 0 0px rgba(31, 118, 119,0.2), 
-          5.6px 5.6px 0 0px rgba(31, 118, 119,0.2), 
-          0px 8px 0 0px rgba(31, 118, 119,0.5), 
-          -5.76px 5.76px 0 0px rgba(31, 118, 119,0.7), 
-          -8.32px 0px 0 0px #1F7677, 
-          -5.76px -5.76px 0 0px rgba(31, 118, 119,0.2);
+          0px -24.96px 0px 0px rgba(31, 118, 119,0.2), 
+          17.28px -17.28px 0 0px rgba(31, 118, 119,0.2), 
+          24px 0px 0 0px rgba(31, 118, 119,0.2), 
+          16.8px 16.8px 0 0px rgba(31, 118, 119,0.2), 
+          0px 24px 0 0px rgba(31, 118, 119,0.5), 
+          -17.28px 17.28px 0 0px rgba(31, 118, 119,0.7), 
+          -24.96px 0px 0 0px #1F7677, 
+          -17.28px -17.28px 0 0px rgba(31, 118, 119,0.2);
   }
 
   87.5% {
       box-shadow:     
-          0px -8.32px 0px 0px rgba(31, 118, 119,0.2), 
-          5.76px -5.76px 0 0px rgba(31, 118, 119,0.2), 
-          8px 0px 0 0px rgba(31, 118, 119,0.2), 
-          5.6px 5.6px 0 0px rgba(31, 118, 119,0.2), 
-          0px 8px 0 0px rgba(31, 118, 119,0.2), 
-          -5.76px 5.76px 0 0px rgba(31, 118, 119,0.5), 
-          -8.32px 0px 0 0px rgba(31, 118, 119,0.7), 
-          -5.76px -5.76px 0 0px #1F7677;
+          0px -24.96px 0px 0px rgba(31, 118, 119,0.2), 
+          17.28px -17.28px 0 0px rgba(31, 118, 119,0.2), 
+          24px 0px 0 0px rgba(31, 118, 119,0.2), 
+          16.8px 16.8px 0 0px rgba(31, 118, 119,0.2), 
+          0px 24px 0 0px rgba(31, 118, 119,0.2), 
+          -17.28px 17.28px 0 0px rgba(31, 118, 119,0.5), 
+          -24.96px 0px 0 0px rgba(31, 118, 119,0.7), 
+          -17.28px -17.28px 0 0px #1F7677;
   }
 `;
 const Loader = styled__default["default"].span`
-  font-size: 10px;
-  width: 4px;
-  height: 4px;
+  font-size: 30px;
+  width: 12px;
+  height: 12px;
   border-radius: 50%;
   position: relative;
   text-indent: -9999em;
@@ -37128,7 +37121,7 @@ const Loader = styled__default["default"].span`
 `;
 const LoaderWrapper = styled__default["default"].div`
   position: absolute;
-  top: 40%;
+  top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   display: flex;
@@ -37136,6 +37129,7 @@ const LoaderWrapper = styled__default["default"].div`
   justify-content: center;
   gap: 20px;
   color: #1f7677;
+    background-color: rgba(255, 255, 255, 0.8);
   z-index: 10;
   width: 100%;
   height: 100%;