sag_components 2.0.0-beta135 → 2.0.0-beta136

package/dist/index.esm.js

@@ -23903,22 +23903,21 @@ const DeleteIcon = styled.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] = useState(false);
   const [showOptions, setShowOptions] = useState(false);
   const [inputValue, setInputValue] = useState("");
@@ -38206,6 +38205,18 @@ const TableBody = /*#__PURE__*/forwardRef(({
     }, formattedValue);
   }))));
 });
+TableBody.propTypes = {
+  columns: PropTypes.array.isRequired,
+  data: PropTypes.array.isRequired,
+  onRowClick: PropTypes.func,
+  onSendClick: PropTypes.func,
+  buttonColor: PropTypes.string,
+  onDeleteClick: PropTypes.func,
+  resetFocus: PropTypes.bool,
+  onFocusChange: PropTypes.func,
+  indexToShimmer: PropTypes.number
+};
+TableBody.displayName = 'TableBody';
 
 var nm$1 = "calendar_lottie";
 var ddd$1 = 0;
@@ -41659,7 +41670,8 @@ const VendorNameAndPackagesContainer$1 = styled.div`
   align-items: flex-start;
 `;
 const DotContainer = styled.div`
-  display: flex;
+  text-align: center;
+  margin-top: 10px;
   width: 40px;
   height: 100%;
 `;
@@ -41886,7 +41898,10 @@ const NewItemList = ({
   }, /*#__PURE__*/React$1.createElement(VendorList$1, null, filteredItems.map((item, idx) => /*#__PURE__*/React$1.createElement(VendorItem, {
     key: idx,
     onClick: e => {
-      if (onVendorClick) onVendorClick(item);
+      // Always call onVendorClick - it will handle the conversion from null to []
+      if (onVendorClick) {
+        onVendorClick(item);
+      }
     }
   }, /*#__PURE__*/React$1.createElement(VendorNameAndPackagesContainer, null, /*#__PURE__*/React$1.createElement(VendorName$1, null, highlightMatch(item.name, searchLower)), item.packages && /*#__PURE__*/React$1.createElement(VendorPackages, null, `0/${item.packages.length} Packages Sent`)), /*#__PURE__*/React$1.createElement(VendorChevron, null, /*#__PURE__*/React$1.createElement(ArrowRightFullIcon, null)))))));
 };
@@ -51008,6 +51023,10 @@ const ItemManagerPanel = _ref => {
   const [isEditingExisting, setIsEditingExisting] = useState(false);
   const [headerHeight, setHeaderHeight] = useState(0);
   const headerRef = useRef(null);
+  useEffect(() => {
+    console.log("Screen changed to:", screen);
+    console.log("Selected Vendor:", selectedVendor);
+  }, [screen, selectedVendor]);
   useEffect(() => {
     if (headerRef.current) {
       setHeaderHeight(headerRef.current.offsetHeight);
@@ -51017,7 +51036,11 @@ const ItemManagerPanel = _ref => {
     return itemAndPackage.some(item => item.packages !== null && Array.isArray(item.packages) && item.packages.length > 0);
   };
   const handleVendorClick = vendor => {
-    setSelectedVendor(vendor);
+    const modifiedVendor = {
+      ...vendor,
+      packages: vendor.packages || []
+    };
+    setSelectedVendor(modifiedVendor);
     setScreen("subitem");
   };
   const addNewPackage = (vendorName, packageName, component) => {
@@ -51100,16 +51123,25 @@ const ItemManagerPanel = _ref => {
       setItemAndPackage: setItemAndPackage,
       vendor: selectedVendor,
       itemAndPackage: itemAndPackage,
-      onBack: () => setScreen("initial"),
+      onBack: () => {
+        // Check if selected vendor originally had packages: null
+        const currentVendor = itemAndPackage.find(v => v.name === selectedVendor.name);
+        if (currentVendor && currentVendor.packages === null) {
+          // User visited vendor but didn't add packages - convert to empty array to show red dot
+          setItemAndPackage(prev => prev.map(item => item.name === selectedVendor.name ? {
+            ...item,
+            packages: []
+          } : item));
+        }
+        setScreen("initial");
+      },
       onTrashClick: () => onDeleteInner(selectedVendor),
       handleSubitemDetail: function () {
         let pkg = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
         if (pkg) {
-          // Editing existing package
           setSelectedPackage(pkg);
           setIsEditingExisting(true);
         } else {
-          // Adding new package
           setSelectedPackage(null);
           setIsEditingExisting(false);
         }
@@ -51219,11 +51251,11 @@ const ItemManagerPanel = _ref => {
       const allHaveStatus = packagesWithStatus.length === item.packages.length;
       const noneHaveStatus = packagesWithStatus.length === 0;
       if (noneHaveStatus) {
-        return 'No Packages sent';
+        return `0/${item.packages.length} sent`;
       } else if (allHaveStatus) {
-        return `${item.packages.length} Package${item.packages.length !== 1 ? 's' : ''} Sent`;
+        return `${item.packages.length}/${item.packages.length} sent`;
       } else {
-        return `${item.packages.length} Package${item.packages.length !== 1 ? 's' : ''}`;
+        return `${packagesWithStatus.length}/${item.packages.length} sent`;
       }
     })())), /*#__PURE__*/React$1.createElement(VendorChevron$1, null, /*#__PURE__*/React$1.createElement(ArrowRightFullIcon, null))), /*#__PURE__*/React$1.createElement(Trash$1, {
       className: "trash-icon",