chore(Table): improve accessibility

This commit is contained in:
Benjamin Canac
2023-09-11 11:25:06 +02:00
parent 3fef86834f
commit 87fd85ec3f

View File

@@ -4,7 +4,7 @@
<thead :class="ui.thead">
<tr :class="ui.tr.base">
<th v-if="modelValue" scope="col" class="ps-4">
<UCheckbox :checked="indeterminate || selected.length === rows.length" :indeterminate="indeterminate" @change="onChange" />
<UCheckbox :checked="indeterminate || selected.length === rows.length" :indeterminate="indeterminate" aria-label="Select all" @change="onChange" />
</th>
<th v-for="(column, index) in columns" :key="index" scope="col" :class="[ui.th.base, ui.th.padding, ui.th.color, ui.th.font, ui.th.size, column.class]">
@@ -51,7 +51,7 @@
<template v-else>
<tr v-for="(row, index) in rows" :key="index" :class="[ui.tr.base, isSelected(row) && ui.tr.selected, $attrs.onSelect && ui.tr.active]" @click="() => onSelect(row)">
<td v-if="modelValue" class="ps-4">
<UCheckbox v-model="selected" :value="row" @click.stop />
<UCheckbox v-model="selected" :value="row" aria-label="Select row" @click.stop />
</td>
<td v-for="(column, subIndex) in columns" :key="subIndex" :class="[ui.td.base, ui.td.padding, ui.td.color, ui.td.font, ui.td.size]">