arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-31 12:17:54 +01:00
Code Issues Packages Projects Releases Wiki Activity

chore(lighthouse): improve components accessibility (#127)

Browse Source
This commit is contained in:
Sylvain Marroufin
2023-01-12 12:32:42 +01:00
committed by GitHub
parent 8c0e0ec823
commit b6455a151d
4 changed files with 18 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/runtime/components/elements/Dropdown.vue
View File

@@ -1,6 +1,12 @@
<template> <template>
<Menu v-slot="{ open }" as="div" :class="wrapperClass" @mouseleave="onMouseLeave"> <Menu v-slot="{ open }" as="div" :class="wrapperClass" @mouseleave="onMouseLeave">
<MenuButton ref="trigger" as="div" class="inline-flex w-full" @mouseover="onMouseOver"> <MenuButton
ref="trigger"
as="div"
class="inline-flex w-full"
role="button"
@mouseover="onMouseOver"
>
<slot :open="open"> <slot :open="open">
<button>Open</button> <button>Open</button>
</slot> </slot>

4
src/runtime/components/forms/SelectCustom.vue
View File

@@ -10,9 +10,9 @@
:class="wrapperClass" :class="wrapperClass"
@update:model-value="onUpdate" @update:model-value="onUpdate"
> >
<input :value="modelValue" :required="required" class="absolute inset-0 w-px opacity-0 cursor-default" tabindex="-1"> <input :value="modelValue" :required="required" class="absolute inset-0 w-px opacity-0 cursor-default" tabindex="-1" aria-hidden="true">
<ComboboxButton ref="trigger" v-slot="{ disabled: buttonDisabled }" as="div" class="inline-flex w-full"> <ComboboxButton ref="trigger" v-slot="{ disabled: buttonDisabled }" as="div" role="button" class="inline-flex w-full">
<slot :open="open" :disabled="buttonDisabled"> <slot :open="open" :disabled="buttonDisabled">
<button :class="selectCustomClass" :disabled="disabled" type="button"> <button :class="selectCustomClass" :disabled="disabled" type="button">
<slot name="label"> <slot name="label">

9
src/runtime/components/navigation/CommandPalette.vue
View File

@@ -19,7 +19,14 @@
@change="query = $event.target.value" @change="query = $event.target.value"
/> />
<Button v-if="closeIcon" :icon="closeIcon" variant="transparent" class="absolute right-3" @click="onClear" /> <Button
v-if="closeIcon"
:icon="closeIcon"
variant="transparent"
class="absolute right-3"
aria-label="close"
@click="onClear"
/>
</div> </div>
<ComboboxOptions v-if="groups.length" static hold class="relative flex-1 overflow-y-auto divide-y divide-gray-100 dark:divide-gray-800 scroll-py-2"> <ComboboxOptions v-if="groups.length" static hold class="relative flex-1 overflow-y-auto divide-y divide-gray-100 dark:divide-gray-800 scroll-py-2">

2
src/runtime/components/overlays/Popover.vue
View File

@@ -1,6 +1,6 @@
<template> <template>
<Popover v-slot="{ open, close }" :class="wrapperClass" @mouseleave="onMouseLeave"> <Popover v-slot="{ open, close }" :class="wrapperClass" @mouseleave="onMouseLeave">
<PopoverButton ref="trigger" as="div" class="inline-flex w-full" @mouseover="onMouseOver"> <PopoverButton ref="trigger" as="div" class="inline-flex w-full" role="button" @mouseover="onMouseOver">
<slot :open="open" :close="close"> <slot :open="open" :close="close">
<button>Open</button> <button>Open</button>
</slot> </slot>