fix(select-rich): only close the overlay on tab when trapsKeyboardFoc…

…us is false (#2273)

.changeset/silly-laws-yell.md

@@ -0,0 +1,5 @@
+---
+'@lion/ui': patch
+---
+
+[select-rich] only close the overlay on tab when trapsKeyboardFocus is false

packages/ui/components/select-rich/src/LionSelectRich.js

@@ -541,6 +541,9 @@ export class LionSelectRich extends SlotMixin(ScopedElementsMixin(OverlayMixin(L
     switch (key) {
       case 'Tab':
         // Tab can only be caught in keydown
+        if (this._overlayCtrl.config.trapsKeyboardFocus === true) {
+          return;
+        }
         this.opened = false;
         break;
       case 'Escape':

packages/ui/components/select-rich/test/lion-select-rich.test.js

@@ -501,6 +501,18 @@ describe('lion-select-rich', () => {
       _listboxNode.dispatchEvent(new KeyboardEvent('keydown', { key: 'Tab' }));
       expect(el.opened).to.be.false;
     });
+
+    it('does not close the listbox with [Tab] key once opened when trapsKeyboardFocus is true', async () => {
+      const el = await fixture(
+        html`
+          <lion-select-rich opened .config=${{ trapsKeyboardFocus: true }}> </lion-select-rich>
+        `,
+      );
+      // tab can only be caught via keydown
+      const { _listboxNode } = getSelectRichMembers(el);
+      _listboxNode.dispatchEvent(new KeyboardEvent('keydown', { key: 'Tab' }));
+      expect(el.opened).to.be.true;
+    });
   });
 
   describe('Mouse navigation', () => {