@7shifts/sous-chef 3.44.2-beta.1 → 3.44.3

package/dist/actions/index.d.ts

@@ -1,5 +1,7 @@
 import Toggle from './Toggle';
 import Button from './Button';
+import { ButtonTheme } from './Button/types';
 import PaginationControls from './PaginationControls';
 import Link from './Link';
 export { Toggle, Button, PaginationControls, Link };
+export type { ButtonTheme };

package/dist/index.css

@@ -2570,7 +2570,7 @@ input:disabled + ._2W10t::after {
 ._11ygA {
   display: flex;
   justify-content: space-between;
-  width: 424px;
+  max-width: 424px;
   gap: 20px;
   flex-direction: column;
   align-items: center;

package/dist/index.js

@@ -6362,6 +6362,16 @@ var PaneOverlay = function PaneOverlay(_ref) {
   var _useState = React.useState({}),
     position = _useState[0],
     setPosition = _useState[1];
+  React.useEffect(function () {
+    var handleScroll = function handleScroll() {
+      console.log('Scrolling');
+      onToggleDropdown();
+    };
+    document.addEventListener('scroll', handleScroll);
+    return function () {
+      document.removeEventListener('scroll', handleScroll);
+    };
+  }, [onToggleDropdown]);
   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)) {
@@ -6398,6 +6408,11 @@ var isGoingTowardsPane = function isGoingTowardsPane(panePosition, mouseYAxisPos
   }
   return isGoingTowardsPane;
 };
+var getKeyboardFocusableElements = function getKeyboardFocusableElements(element) {
+  return Array.prototype.slice.call(element.querySelectorAll('a[href], button, input, textarea, select, details,[tabindex]:not([tabindex="-1"])')).filter(function (el) {
+    return !el.hasAttribute('disabled') && !el.getAttribute('aria-hidden') && !(el.getAttribute('tabindex') === '-1');
+  });
+};
 
 var styles$g = {"dropdown__trigger":"_3INRK"};
 
@@ -6887,6 +6902,24 @@ var Dropdown = function Dropdown(_ref) {
       setIsOpen(false);
     }
   };
+  var handleOnBlur = function handleOnBlur(e) {
+    trigger.props.onBlur && trigger.props.onBlur(e);
+    if (!paneRef || !(paneRef !== null && paneRef !== void 0 && paneRef.current)) {
+      return;
+    }
+    var focusableElements = getKeyboardFocusableElements(paneRef.current);
+    if (focusableElements.length > 0) {
+      window.setTimeout(function () {
+        var _paneRef$current;
+        var focusedElement = document.activeElement;
+        if (!((_paneRef$current = paneRef.current) !== null && _paneRef$current !== void 0 && _paneRef$current.contains(focusedElement))) {
+          focusableElements[0].focus();
+        }
+      }, 0);
+    } else {
+      setIsOpen(false);
+    }
+  };
   var getRef = function getRef() {
     if ((trigger.type === Button || trigger.type === TimeFieldDropdownTrigger) && trigger.ref) {
       return trigger.ref;
@@ -6898,6 +6931,7 @@ var Dropdown = function Dropdown(_ref) {
     onClick: handleMouseClick,
     onMouseEnter: handleMouseEnter,
     onMouseLeave: handleMouseLeave,
+    onBlur: handleOnBlur,
     ref: updatedRef,
     style: {
       width: triggerWidth === 'full' ? '100%' : 'fit-content'