sag_components 2.0.0-beta244 → 2.0.0-beta246

package/dist/index.esm.js

@@ -35223,6 +35223,7 @@ const WeeksPicker = _ref => {
   const [isFocused, setIsFocused] = useState(false);
   const [isOpen, setIsOpen] = useState(false);
   const [showAbove, setShowAbove] = useState(false);
+  const [previousText, setPreviousText] = useState(text);
 
   // Function to parse the value string and extract week numbers
   const parseValueToWeeks = valueString => {
@@ -35230,27 +35231,23 @@ const WeeksPicker = _ref => {
       startWeek: null,
       endWeek: null
     };
-
-    // Handle single week: "Week 5"
-    const singleWeekMatch = valueString.match(/^Week (\d+)$/);
-    if (singleWeekMatch) {
-      const week = parseInt(singleWeekMatch[1]);
-      return {
-        startWeek: week,
-        endWeek: week
-      };
-    }
-
-    // Handle week range: "Weeks 5 - 10"
-    const rangeMatch = valueString.match(/^Weeks (\d+) - (\d+)$/);
+    const rangeMatch = valueString.match(/^(.+?)\s*(\d+)\s*-\s*(\d+)$/);
     if (rangeMatch) {
-      const startWeek = parseInt(rangeMatch[1]);
-      const endWeek = parseInt(rangeMatch[2]);
+      const startWeek = parseInt(rangeMatch[2]);
+      const endWeek = parseInt(rangeMatch[3]);
       return {
         startWeek,
         endWeek
       };
     }
+    const singleMatch = valueString.match(/^(.+?)\s*(\d+)$/);
+    if (singleMatch) {
+      const week = parseInt(singleMatch[2]);
+      return {
+        startWeek: week,
+        endWeek: week
+      };
+    }
     return {
       startWeek: null,
       endWeek: null
@@ -35324,6 +35321,27 @@ const WeeksPicker = _ref => {
       }
     }
   }, [allowedWeekRange, restrictToRange]);
+  useEffect(() => {
+    if (previousText !== text) {
+      setPreviousText(text);
+    }
+    const currentValue = value || selectedValue;
+    if (currentValue) {
+      const {
+        startWeek,
+        endWeek
+      } = parseValueToWeeks(currentValue);
+      if (startWeek && endWeek) {
+        const newValue = endWeek === startWeek ? text === 'Week' ? `${text} ${startWeek}` : `${text}${startWeek}` : text === 'Week' ? `${text}s ${startWeek} - ${endWeek}` : `${text}${startWeek} - ${endWeek}`;
+        if (newValue !== value) {
+          setValue(newValue);
+          if (onChange) {
+            onChange(newValue);
+          }
+        }
+      }
+    }
+  }, [text, value, selectedValue, previousText, onChange]);
   const handleToggle = () => {
     setIsOpen(!isOpen);
   };
@@ -35344,11 +35362,6 @@ const WeeksPicker = _ref => {
     onChange(newValue);
     setValue(newValue);
   };
-  useEffect(() => {
-    if (selectedValue !== undefined) {
-      setValue(selectedValue);
-    }
-  }, [selectedValue]);
   const handleApply = () => {
     setIsOpen(false);
   };
@@ -36099,15 +36112,19 @@ const ToggleInput = styled.input`
 const ToggleSlider = styled.span`
   display: block;
   position: relative;
-  background: ${({
-  checked,
-  disabled
-}) => checked ? "#006d6a" : disabled ? "#B1B1B1" : "#D0D0D0"};
+  background: ${_ref => {
+  let {
+    checked,
+    disabled
+  } = _ref;
+  return checked ? "#006d6a" : disabled ? "#B1B1B1" : "#D0D0D0";
+}};
   border-radius: 999px;
   transition: background 0.2s;
-  ${({
-  size
-}) => {
+  ${_ref2 => {
+  let {
+    size
+  } = _ref2;
   switch (size) {
     case "s":
       return css`width: 40px; height: 20px;`;
@@ -36123,14 +36140,18 @@ const ToggleSlider = styled.span`
     left: 3px;
     top: 50%;
     transform: translateY(-50%);
-    background: ${({
-  disabled
-}) => disabled ? "#D0D0D0" : "#fff"};
+    background: ${_ref3 => {
+  let {
+    disabled
+  } = _ref3;
+  return disabled ? "#D0D0D0" : "#fff";
+}};
     border-radius: 50%;
     transition: left 0.2s, width 0.2s, height 0.2s;
-    ${({
-  size
-}) => {
+    ${_ref4 => {
+  let {
+    size
+  } = _ref4;
   switch (size) {
     case "s":
       return css`width: 14px; height: 14px;`;
@@ -36140,10 +36161,11 @@ const ToggleSlider = styled.span`
       return css`width: 20px; height: 20px;`;
   }
 }}
-    left: ${({
-  checked,
-  size
-}) => {
+    left: ${_ref5 => {
+  let {
+    checked,
+    size
+  } = _ref5;
   if (!checked) return "3px";
   switch (size) {
     case "s":
@@ -48191,10 +48213,8 @@ const NewSubitem = ({
   }, [packageObject]);
   useEffect(() => {
     if (packageObject && packageObject.brands === negotiatedBrands) return;
-    setIsPackageDuplicated(itemAndPackage.some(obj => {
-      obj.name === vendor && obj.packages.some(pkg => pkg.brands === negotiatedBrands);
-    }));
-    setIsApplyEnabled(negotiatedBrands.trim().length > 2 && vendor.packages.some(pkg => pkg.brands === negotiatedBrands) === false);
+    setIsPackageDuplicated(itemAndPackage.some(obj => obj.name === vendor.name && obj.packages?.some(pkg => pkg.brands === negotiatedBrands)));
+    setIsApplyEnabled(negotiatedBrands.trim().length > 2 && !itemAndPackage.some(obj => obj.name === vendor.name && obj.packages?.some(pkg => pkg.brands === negotiatedBrands)));
   }, [negotiatedBrands]);
   return /*#__PURE__*/React$1.createElement(NewSubitemContainer, null, /*#__PURE__*/React$1.createElement(Header, null, /*#__PURE__*/React$1.createElement(BackButton, {
     onClick: onBack
@@ -57743,6 +57763,8 @@ const OverlayDropdown = _ref => {
   const [hoveredText, setHoveredText] = useState(null);
   const [templateDialog, setTemplateDialog] = useState(null);
   const [dropdownPosition, setDropdownPosition] = useState("below");
+  const [selected, setSelected] = useState("");
+  const [hasValue, setHasValue] = useState(false);
   const [lastDefinedGroup, setLastDefinedGroup] = useState(data.find(group => group.overlayCode === "last_defined"));
   const buttonRef = useRef(null);
   const dropdownRef = useRef(null);
@@ -57799,8 +57821,10 @@ const OverlayDropdown = _ref => {
     }
     return null;
   };
-  const selected = findSelectedItem();
-  const hasValue = !!selected;
+  useEffect(() => {
+    setSelected(findSelectedItem());
+    setHasValue(!!findSelectedItem());
+  }, [value]);
   const getTemplateParams = label => {
     if (!label) return [];