diff --git a/.changeset/rare-walls-lay.md b/.changeset/rare-walls-lay.md
new file mode 100644
index 000000000..6042a3d69
--- /dev/null
+++ b/.changeset/rare-walls-lay.md
@@ -0,0 +1,5 @@
+---
+'@lion/ui': patch
+---
+
+[select-rich] block arrow key interaction when singleOption is set
diff --git a/packages/ui/components/select-rich/src/LionSelectRich.js b/packages/ui/components/select-rich/src/LionSelectRich.js
index b8bd014f8..9d806ae21 100644
--- a/packages/ui/components/select-rich/src/LionSelectRich.js
+++ b/packages/ui/components/select-rich/src/LionSelectRich.js
@@ -491,7 +491,7 @@ export class LionSelectRich extends SlotMixin(ScopedElementsMixin(OverlayMixin(L
*/
// TODO: rename to #invokerOnKeyUp() (and move event listener to the invoker) in v1
__onKeyUp(ev) {
- if (this.disabled || this.readOnly) {
+ if (this.disabled || this.readOnly || this.singleOption) {
return;
}
diff --git a/packages/ui/components/select-rich/test/lion-select-rich.test.js b/packages/ui/components/select-rich/test/lion-select-rich.test.js
index 7bc4cc232..e5032362c 100644
--- a/packages/ui/components/select-rich/test/lion-select-rich.test.js
+++ b/packages/ui/components/select-rich/test/lion-select-rich.test.js
@@ -342,7 +342,7 @@ describe('lion-select-rich', () => {
expect(elSingleoption.opened).to.be.false;
});
- it('stays closed with [ArrowUp] or [ArrowDown] key in readonly mode', async () => {
+ it('stays closed with [ArrowUp] or [ArrowDown] key in readonly mode or has a single option', async () => {
const elReadOnly = await fixture(html`
Item 1
@@ -350,11 +350,23 @@ describe('lion-select-rich', () => {
`);
+ const elSingleOption = await fixture(html`
+
+ Item 1
+
+ `);
+
elReadOnly.dispatchEvent(new KeyboardEvent('keyup', { key: 'ArrowDown' }));
expect(elReadOnly.opened).to.be.false;
elReadOnly.dispatchEvent(new KeyboardEvent('keyup', { key: 'ArrowUp' }));
expect(elReadOnly.opened).to.be.false;
+
+ elSingleOption.dispatchEvent(new KeyboardEvent('keyup', { key: 'ArrowDown' }));
+ expect(elSingleOption.opened).to.be.false;
+
+ elSingleOption.dispatchEvent(new KeyboardEvent('keyup', { key: 'ArrowUp' }));
+ expect(elSingleOption.opened).to.be.false;
});
it('sets inheritsReferenceWidth to min by default', async () => {