@7shifts/sous-chef 3.44.2-beta.0 → 3.44.2

package/dist/index.modern.js

@@ -6394,6 +6394,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"};
 
@@ -6822,6 +6827,7 @@ var Dropdown = function Dropdown(_ref) {
   var triggerRef = useRef(null);
   var paneRef = useRef(null);
   var isFocusingOverlay = useRef(false);
+  var triggerIsKnownButton = trigger.type === Button || trigger.type === 'button' || trigger.type === TimeFieldDropdownTrigger;
   var handleToggleDropdown = useCallback(function () {
     return setIsOpen(!isOpen);
   }, [isOpen]);
@@ -6832,7 +6838,7 @@ var Dropdown = function Dropdown(_ref) {
       handleToggleDropdown();
     }
     e.stopPropagation();
-    if ('onClick' in trigger.props) {
+    if (triggerIsKnownButton && 'onClick' in trigger.props) {
       trigger.props.onClick(e);
     }
     e.preventDefault();
@@ -6882,6 +6888,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;
@@ -6893,6 +6917,7 @@ var Dropdown = function Dropdown(_ref) {
     onClick: handleMouseClick,
     onMouseEnter: handleMouseEnter,
     onMouseLeave: handleMouseLeave,
+    onBlur: handleOnBlur,
     ref: updatedRef,
     style: {
       width: triggerWidth === 'full' ? '100%' : 'fit-content'
@@ -6906,9 +6931,10 @@ var Dropdown = function Dropdown(_ref) {
       triggerRef: updatedRef,
       paneRef: paneRef
     }
-  }, trigger.type === Button || trigger.type === 'button' || trigger.type === TimeFieldDropdownTrigger ? React__default.cloneElement(trigger, _extends({}, trigger.props, triggerProps)) : React__default.createElement("button", _extends({}, triggerProps, {
+  }, triggerIsKnownButton ? React__default.cloneElement(trigger, _extends({}, trigger.props, triggerProps)) : React__default.createElement("button", _extends({}, triggerProps, {
     className: styles$g['dropdown__trigger'],
-    ref: updatedRef
+    ref: updatedRef,
+    onFocus: handleFocus
   }), trigger), React__default.createElement(DropdownPane, {
     width: width,
     maxHeight: maxHeight,