mirror of
https://github.com/CorentinTh/it-tools.git
synced 2025-04-20 06:55:06 -04:00
refactor(c-table): added description on c-table for accessibility
This commit is contained in:
parent
88b881880c
commit
b408df82c1
1 changed files with 2 additions and 2 deletions
|
@ -2,7 +2,7 @@
|
|||
import _ from 'lodash';
|
||||
import type { HeaderConfiguration } from './c-table.types';
|
||||
|
||||
const props = withDefaults(defineProps<{ data?: Record<string, unknown>[]; headers?: HeaderConfiguration ; hideHeaders?: boolean }>(), { data: () => [], headers: undefined, hideHeaders: false });
|
||||
const props = withDefaults(defineProps<{ data?: Record<string, unknown>[]; headers?: HeaderConfiguration ; hideHeaders?: boolean; description?: string }>(), { data: () => [], headers: undefined, hideHeaders: false, description: 'Data table' });
|
||||
const { data, headers: rawHeaders, hideHeaders } = toRefs(props);
|
||||
|
||||
const headers = computed(() => {
|
||||
|
@ -38,7 +38,7 @@ const headers = computed(() => {
|
|||
|
||||
<template>
|
||||
<div class="relative overflow-x-auto rounded">
|
||||
<table class="w-full border-collapse text-left text-sm text-gray-500 dark:text-gray-400">
|
||||
<table class="w-full border-collapse text-left text-sm text-gray-500 dark:text-gray-400" role="table" :aria-label="description">
|
||||
<thead v-if="!hideHeaders" class="bg-#ffffff uppercase text-gray-700 dark:bg-#333333 dark:text-gray-400">
|
||||
<tr>
|
||||
<th v-for="header in headers" :key="header.key" scope="col" class="px-6 py-3 text-xs">
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue