@7shifts/sous-chef 3.44.5 → 3.44.7

package/dist/index.js

@@ -6363,15 +6363,17 @@ var PaneOverlay = function PaneOverlay(_ref) {
     position = _useState[0],
     setPosition = _useState[1];
   React.useEffect(function () {
-    var handleScroll = function handleScroll() {
-      console.log('Scrolling 2');
-      onToggleDropdown();
+    var handleScroll = function handleScroll(e) {
+      var _paneRef$current;
+      if (e.target !== paneRef.current && !((_paneRef$current = paneRef.current) !== null && _paneRef$current !== void 0 && _paneRef$current.contains(e.target))) {
+        onToggleDropdown();
+      }
     };
     window.addEventListener('scroll', handleScroll, true);
     return function () {
       window.removeEventListener('scroll', handleScroll, true);
     };
-  }, [onToggleDropdown]);
+  }, [onToggleDropdown, paneRef]);
   useOnClickOutsideRole('dialog', onToggleDropdown);
   React.useLayoutEffect(function () {
     if (!triggerRef || !('current' in triggerRef) || !(triggerRef !== null && triggerRef !== void 0 && triggerRef.current) || !(paneRef !== null && paneRef !== void 0 && paneRef.current)) {
@@ -11018,6 +11020,12 @@ var DateRangeCalendar = function DateRangeCalendar(_ref) {
     calendarRef = _useState[0],
     setCalendarRef = _useState[1];
   var anchorNode = anchorRef.current;
+  React.useEffect(function () {
+    window.addEventListener('scroll', onClickOutside, true);
+    return function () {
+      window.removeEventListener('scroll', onClickOutside, true);
+    };
+  }, [onClickOutside]);
   useOnClickOutside({
     current: calendarRef
   }, function (event) {
@@ -11126,6 +11134,9 @@ var FromDate = function FromDate(_ref) {
     onChange(date);
     onDayClick();
   };
+  var onClickOutside = React.useCallback(function () {
+    return setShowCalendar(false);
+  }, [setShowCalendar]);
   return React__default.createElement(React__default.Fragment, null, React__default.createElement("input", {
     name: name,
     id: id,
@@ -11142,9 +11153,7 @@ var FromDate = function FromDate(_ref) {
     placeholder: placeholder
   }), showCalendar && React__default.createElement(DateRangeCalendar, {
     onSelect: handleChange,
-    onClickOutside: function onClickOutside() {
-      return setShowCalendar(false);
-    },
+    onClickOutside: onClickOutside,
     anchorRef: inputRef,
     start: start,
     end: end,
@@ -11182,6 +11191,9 @@ var ToDateElement = function ToDateElement(_ref, ref) {
       disabledDaysChecks.push(disabledDays);
     }
   }
+  var onClickOutside = React.useCallback(function () {
+    return setShowCalendar(false);
+  }, [setShowCalendar]);
   return React__default.createElement(React__default.Fragment, null, React__default.createElement("input", {
     name: name,
     autoComplete: "off",
@@ -11198,9 +11210,7 @@ var ToDateElement = function ToDateElement(_ref, ref) {
     onBlur: onBlur
   }), showCalendar && React__default.createElement(DateRangeCalendar, {
     onSelect: onChange,
-    onClickOutside: function onClickOutside() {
-      return setShowCalendar(false);
-    },
+    onClickOutside: onClickOutside,
     anchorRef: ref,
     start: start,
     end: end,