Improve aria-label support for columns

[nicolas-c-dev]

Hi, i've noticed that is not possible to add an aria-label for every column in the columns definition and it's very important to give better accessibility. Sometimes there are abbreviations that screen readers do not interpret, and it gives a bad exprience for those people.

Could it be simply adding a new key to ColumnDef type. Example:

const columns: ColumnDef<Record<string, unknown>>[] = [
  {
    header: 'N° Ticket',
    accessorKey: 'ticketNumber',
    ariaLabel: 'Número de ticket'
  },
];

[tannerlinsley]

Please pass this in column.meta and apply it in your template. Tanner Linsley

…

On Aug 5, 2022, 8:42 AM -0600, Nicolas Castano ***@***.***>, wrote: Hi, i've noticed that is not possible to add an aria-label for every column in the columns definition and it's very important to give better accessibility. Sometimes there are abbreviations that screen readers do not interpret, and it gives a bad exprience for those people. Could it be simply adding a new key to ColumnDef type. Example: const columns: ColumnDef<Record<string, unknown>>[] = [ { header: 'N° Ticket', accessorKey: 'ticketNumber', ariaLabel: 'Número de ticket' }, ]; — Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you are subscribed to this thread.Message ID: ***@***.***>

[nicolas-c-dev]

Thanks, I can't find an example of use. Could you show me from where to destructure the prop?

[tannerlinsley]

columnHelper.accessor(‘firstName’, {
meta: { myProp: true }
})

then in table:

column.columnDef.meta.myProp