Give quick-add rows their listbox semantics
Create rows inside the combobox dropdown now carry role="option" like their sibling matches, and a failed creation announces itself with role="alert" instead of a silent list item.
This commit is contained in:
+7
-1
@@ -227,6 +227,8 @@ export function Combobox({
|
|||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
className="combo-option create"
|
className="combo-option create"
|
||||||
|
role="option"
|
||||||
|
aria-selected={false}
|
||||||
disabled={creating}
|
disabled={creating}
|
||||||
onMouseDown={(e) => e.preventDefault()}
|
onMouseDown={(e) => e.preventDefault()}
|
||||||
onClick={() => void runCreate(c)}
|
onClick={() => void runCreate(c)}
|
||||||
@@ -236,7 +238,11 @@ export function Combobox({
|
|||||||
</button>
|
</button>
|
||||||
</li>
|
</li>
|
||||||
))}
|
))}
|
||||||
{createError && <li className="combo-empty error">{createError}</li>}
|
{createError && (
|
||||||
|
<li className="combo-empty error" role="alert">
|
||||||
|
{createError}
|
||||||
|
</li>
|
||||||
|
)}
|
||||||
{shown.length === 0 && creations.length === 0 && !createError && (
|
{shown.length === 0 && creations.length === 0 && !createError && (
|
||||||
<li className="combo-empty">{emptyText}</li>
|
<li className="combo-empty">{emptyText}</li>
|
||||||
)}
|
)}
|
||||||
|
|||||||
Reference in New Issue
Block a user