ayo/lion
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(select-rich): solve case of having singleOption and hassNoDefaultSelected at the same time (#1863)

Browse source
This commit is contained in:
gerjanvangeest 2022-12-29 10:37:40 +01:00 committed by GitHub
parent 973b6ff9ac
commit fd09f652d4
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 20 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/chilly-taxis-sin.md Normal file
View file

@ -0,0 +1,5 @@
---
'@lion/ui': patch
---
[select-rich] solve case of having singleOption and hasNoDefaultSelected as the same time

4
packages/ui/components/listbox/src/ListboxMixin.js
View file

@ -384,10 +384,6 @@ const ListboxMixinImplementation = superclass =>
updated(changedProperties) { updated(changedProperties) {
super.updated(changedProperties); super.updated(changedProperties);
if (this.formElements.length === 1) {
this.singleOption = true;
}
if (changedProperties.has('disabled')) { if (changedProperties.has('disabled')) {
if (this.disabled) { if (this.disabled) {
this.__requestOptionsToBeDisabled(); this.__requestOptionsToBeDisabled();

5
packages/ui/components/listbox/types/ListboxMixinTypes.ts
View file

@ -11,7 +11,7 @@ import { LionOption } from '../src/LionOption.js';
export declare class ListboxHost { export declare class ListboxHost {
static get styles(): CSSResultArray; static get styles(): CSSResultArray;
/** /**
* When true, will synchronize activedescendant and selected element on * When true, will synchronize active descendant and selected element on
* arrow key navigation. * arrow key navigation.
* This behavior can usually be seen on <select> on the Windows platform. * This behavior can usually be seen on <select> on the Windows platform.
* Note that this behavior cannot be used when multiple-choice is true. * Note that this behavior cannot be used when multiple-choice is true.
@ -31,9 +31,6 @@ export declare class ListboxHost {
public hasNoDefaultSelected: boolean; public hasNoDefaultSelected: boolean;
public singleOption: boolean;
// protected _invokerNode: HTMLElement;
public checkedIndex: number | number[]; public checkedIndex: number | number[];
public activeIndex: number; public activeIndex: number;

2
packages/ui/components/select-rich/src/LionSelectRich.js
View file

@ -259,7 +259,7 @@ export class LionSelectRich extends SlotMixin(ScopedElementsMixin(OverlayMixin(L
/** @protected */ /** @protected */
_onFormElementsChanged() { _onFormElementsChanged() {
this.singleOption = this.formElements.length === 1; this.singleOption = this.formElements.length === 1 && !this.hasNoDefaultSelected;
this._invokerNode.singleOption = this.singleOption; this._invokerNode.singleOption = this.singleOption;
} }

13
packages/ui/components/select-rich/test/lion-select-rich.test.js
View file

@ -400,6 +400,19 @@ describe('lion-select-rich', () => {
expect(el.singleOption).to.be.false; expect(el.singleOption).to.be.false;
expect(_invokerNode.singleOption).to.be.false; expect(_invokerNode.singleOption).to.be.false;
}); });
it('should have singleOption only if one option and no hasNoDefaultSelected', async () => {
const el = await fixture(html`
<lion-select-rich has-no-default-selected>
<lion-option .choiceValue=${10}>Item 1</lion-option>
</lion-select-rich>
`);
const { _invokerNode } = getSelectRichMembers(el);
expect(el.singleOption).to.be.false;
expect(_invokerNode.singleOption).to.be.false;
});
}); });
describe('interaction-mode', () => { describe('interaction-mode', () => {