STCOM-1238v2 - reduce 'focus()' calls within SelectList/Selection (#2249

)

* reduce 'focus()' calls within SelectList/Selection

* comment selection adjustment

* remove unnecessary assignment

* log changes

CHANGELOG.md

@@ -30,6 +30,7 @@
 * Fix `<FilterAccordionHeader>` does not have correct `aria-label` when `label` prop type is string. Fixes STCOM-1271.
 * Add `number-generator` icon. Refs STCOM-1269.
 * Accordions retain their z-index after being blurred, and assume the highest z-index when focus enters them. Refs STCOM-1238.
+* `<Selection>` should only move focus back to its control/trigger if focus within the list. Refs STCOM-1238.
 
 ## [12.0.5](https://github.com/folio-org/stripes-components/tree/v12.0.4) (2024-02-28)
 [Full Changelog](https://github.com/folio-org/stripes-components/compare/v12.0.4...v12.0.5)

lib/Accordion/Accordion.js

@@ -137,13 +137,20 @@ const Accordion = (props) => {
   const handleFocusIn = () => {
     if (!focused) {
       updateFocused(true);
-      const highest = getHighestStackOrder();
-      if (zIndex !== highest) {
-        updateZIndex(highest);
-      }
+      updateZIndex((cur) => {
+        if(content.current.matches(':focus-within')) {
+          // we assign one greater than the highest z-index value.
+          const highest = getHighestStackOrder() + 1;
+          if (cur !== highest) {
+            return highest;
+          }
+        }
+        return cur;
+      });
     }
   }
 
+
   const handleFocusOut = () => {
     updateFocused(false);
   }

lib/Selection/SelectList.js

@@ -111,7 +111,10 @@ class SelectList extends React.Component {
     // like a good overlay, send focus back to our trigger when we close...
     if (prevProps.visible && !this.props.visible) {
       if (this.props.controlRef.current) {
-        this.props.controlRef.current.focus();
+        // we only need to send focus back to the control if focus is still within the list.
+        if(this.container.current.matches(':focus-within')) {
+          this.props.controlRef.current.focus();
+        }
       }
     }