Added Tabbing to datatable and keyboard functionality (#2262)

ng2-components/ng2-alfresco-datatable/src/components/datatable/datatable.component.html

@@ -18,7 +18,11 @@
             [attr.data-automation-id]="'auto_id_' + col.key"
             [class.adf-data-table__header--sorted-asc]="isColumnSorted(col, 'asc')"
             [class.adf-data-table__header--sorted-desc]="isColumnSorted(col, 'desc')"
-            (click)="onColumnHeaderClick(col)">
+            (click)="onColumnHeaderClick(col)"
+            (keyup.enter)="onColumnHeaderClick(col)"
+            role="button"
+            tabindex="0"
+            title="{{col.title}}">
             <span *ngIf="col.srTitle" class="sr-only">{{col.srTitle}}</span>
             <span *ngIf="col.title">{{ col.title | translate}}</span>
         </th>
@@ -31,11 +35,15 @@
 
     <tbody>
     <ng-container *ngIf="!loading">
-        <tr *ngFor="let row of data.getRows(); let idx = index" tabindex="0"
+        <tr *ngFor="let row of data.getRows(); let idx = index"
             [class.is-selected]="row.isSelected"
             [adf-upload]="allowDropFiles && rowAllowsDrop(row)" [adf-upload-data]="row"
             [ngStyle]="rowStyle"
-            [ngClass]="getRowStyle(row)">
+            [ngClass]="getRowStyle(row)"
+            (click)="onRowClick(row, $event)"
+            (keyup.enter)="onRowClick(row, $event)"
+            tabindex="0"
+            role="button">
 
             <!-- Actions (left) -->
             <td *ngIf="actions && actionsPosition === 'left'">
@@ -64,7 +72,8 @@
                 class="adf-data-table-cell adf-data-table-cell--{{col.type || 'text'}} {{col.cssClass}}"
                 (click)="onRowClick(row, $event)"
                 [context-menu]="getContextMenuActions(row, col)"
-                [context-menu-enabled]="contextMenu">
+                [context-menu-enabled]="contextMenu"
+                tabindex="0">
                 <div *ngIf="!col.template" class="cell-container">
                     <ng-container [ngSwitch]="col.type">
                         <div *ngSwitchCase="'image'" class="cell-value">
@@ -151,4 +160,4 @@
         </td>
     </tr>
     </tbody>
-</table>
+</table>