Adding aria role to hyperlink cell in slickgrid (#21998)

* Adding aria role to hyperlink

* Adding default
This commit is contained in:
Aasim Khan
2023-02-22 10:42:11 -08:00
committed by GitHub
parent 656a86a103
commit c3e0478447
4 changed files with 10 additions and 2 deletions

View File

@@ -749,6 +749,10 @@ declare module 'azdata' {
* The url to open.
*/
url?: string;
/**
* The role of the hyperlink. By default, the role is 'link' and the url will be opened in a new tab.
*/
role?: 'button' | 'link';
}
export interface ContextMenuColumnCellValue {

View File

@@ -11,6 +11,7 @@ export interface HyperlinkCellValue {
iconCssClass?: string;
title: string;
url?: string;
role?: 'button' | 'link';
}
export interface HyperlinkColumnOptions extends IconColumnOptions, ClickableColumnOptions {
@@ -32,7 +33,7 @@ export class HyperlinkColumn<T extends Slick.SlickData> extends BaseClickableCol
const cssClasses = iconValue.iconCssClass ? `codicon icon slick-plugin-icon ${iconValue.iconCssClass}` : '';
const urlPart = cellValue?.url ? `href="${encodeURI(cellValue.url)}" target="blank"` : '';
const disabledAttribute = this.isCellEnabled(row, cell) ? '' : 'disabled';
return `<a ${urlPart} class="slick-hyperlink-cell ${cssClasses}" tabindex=-1 title="${escapedTitle}" aria-label="${escapedTitle}" ${disabledAttribute}>${escapedTitle}</a>`;
return `<a ${urlPart} class="slick-hyperlink-cell ${cssClasses}" tabindex=-1 title="${escapedTitle}" aria-label="${escapedTitle}" role="${cellValue.role ?? 'link'}" ${disabledAttribute}>${escapedTitle}</a>`;
},
name: this.options.name,
resizable: true,

View File

@@ -205,7 +205,8 @@ export default class TableComponent extends ComponentBase<azdata.TableComponentP
cellValue = <HyperlinkCellValue>{
iconCssClass: hyperlinkValue.icon ? this.createIconCssClassInternal(hyperlinkValue.icon) : undefined,
title: hyperlinkValue.title,
url: hyperlinkValue.url
url: hyperlinkValue.url,
role: hyperlinkValue.role
};
break;
}