diff --git a/.changeset/perfect-birds-relate.md b/.changeset/perfect-birds-relate.md new file mode 100644 index 000000000..905d49451 --- /dev/null +++ b/.changeset/perfect-birds-relate.md @@ -0,0 +1,5 @@ +--- +'@lion/listbox': patch +--- + +Remove usage of public class fields diff --git a/packages/listbox/README.md b/packages/listbox/README.md index b0f04a1ee..2252e1c7c 100644 --- a/packages/listbox/README.md +++ b/packages/listbox/README.md @@ -31,6 +31,22 @@ export const main = () => html` `; ``` +## Features + +- Single & Multiple Choice +- Orientation +- Rotation when using keyboard for selection + +## How to use + +### Installation + +```bash +npm i --save @lion/listbox +``` + +## Examples + ## Multiple choice Add `multiple-choice` flag to allow multiple values to be selected. diff --git a/packages/listbox/src/LionOption.js b/packages/listbox/src/LionOption.js index eadc638f2..11d4f3ec6 100644 --- a/packages/listbox/src/LionOption.js +++ b/packages/listbox/src/LionOption.js @@ -67,6 +67,7 @@ export class LionOption extends DisabledMixin(ChoiceInputMixin(FormRegisteringMi constructor() { super(); this.active = false; + this.__onClick = this.__onClick.bind(this); this.__registerEventListeners(); } @@ -117,7 +118,7 @@ export class LionOption extends DisabledMixin(ChoiceInputMixin(FormRegisteringMi this.removeEventListener('click', this.__onClick); } - __onClick = () => { + __onClick() { if (this.disabled) { return; } @@ -127,5 +128,5 @@ export class LionOption extends DisabledMixin(ChoiceInputMixin(FormRegisteringMi } else { this.checked = true; } - }; + } }