public/svelte-headlessui
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 1 Wiki Activity

Fix listbox label ref

Browse Source
This commit is contained in:
Ryan Gossiaux
2021-12-18 23:17:56 -08:00
parent 4d47ba89a6
commit 03399fc954
1 changed files with 2 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/lib/components/listbox/ListboxButton.svelte
View File

@@ -9,6 +9,7 @@
let id = `headlessui-listbox-button-${useId()}`; let id = `headlessui-listbox-button-${useId()}`;
let buttonRef = $api.buttonRef; let buttonRef = $api.buttonRef;
let optionsRef = $api.optionsRef; let optionsRef = $api.optionsRef;
let labelRef = $api.labelRef;
async function handleKeyDown(event: KeyboardEvent) { async function handleKeyDown(event: KeyboardEvent) {
switch (event.key) { switch (event.key) {
@@ -65,9 +66,7 @@
"aria-expanded": $api.disabled "aria-expanded": $api.disabled
? undefined ? undefined
: $api?.listboxState === ListboxStates.Open, : $api?.listboxState === ListboxStates.Open,
"aria-labelledby": $api?.labelRef "aria-labelledby": $labelRef ? [$labelRef?.id, id].join(" ") : undefined,
? [$api?.labelRef?.id, id].join(" ")
: undefined,
disabled: $api?.disabled === true ? true : undefined, disabled: $api?.disabled === true ? true : undefined,
}; };
</script> </script>