1<table class="bmc-table {{$ctrl.size}}">
2  <thead class="bmc-table__head">
3    <!-- Header row (non-sortable) -->
4    <tr ng-if="!$ctrl.sortable">
5      <th ng-repeat="headerItem in $ctrl.header"
6          class="bmc-table__column-header">
7        {{headerItem.label}}
8      </th>
9    </tr>
10    <!-- Header row (sortable) -->
11    <tr ng-if="$ctrl.sortable">
12      <th ng-repeat="headerItem in $ctrl.header track by $index"
13          class="bmc-table__column-header">
14        <span ng-if="!headerItem.sortable">
15          {{headerItem.label}}
16        </span>
17        <span ng-if="headerItem.sortable"
18              ng-click="$ctrl.onClickSort($index)"
19              class="bmc-table__column-header--sortable">
20          {{headerItem.label}}
21          <!-- Sort icons -->
22          <button class="sort-icon"
23                  type="button"
24                  aria-label="sort {{headerItem.label}}">
25            <icon file="icon-arrow--up.svg"
26                  ng-if="$index === $ctrl.activeSort"
27                  ng-class="{
28                    'sort-icon--descending': !$ctrl.sortAscending,
29                    'sort-icon--ascending' : $ctrl.sortAscending }"
30                  class="sort-icon--active"
31                  aria-hidden="true"></icon>
32            <span ng-if="$index !== $ctrl.activeSort"
33                  class="sort-icon--inactive"
34                  aria-hidden="true">
35                <icon file="icon-arrow--up.svg"></icon>
36                <icon file="icon-arrow--down.svg"></icon>
37            </span>
38          </button>
39        </span>
40      </th>
41    </tr>
42  </thead>
43  <tbody class="bmc-table__body">
44    <!-- Data rows -->
45    <tr ng-if="$ctrl.data.length > 0"
46        ng-repeat="row in $ctrl.data"
47        class="bmc-table__row">
48      <!-- Row item -->
49      <td ng-repeat="item in row.uiData track by $index"
50          class="bmc-table__cell">
51          <ng-bind-html ng-bind-html="item"></ng-bind-html>
52      </td>
53      <!-- Row Actions -->
54      <td ng-if="$ctrl.rowActionsEnabled"
55          class="bmc-table__cell  bmc-table__row-actions">
56        <table-actions
57          actions="row.actions"
58          emit-action="$ctrl.onEmitTableAction(action, row)">
59        </table-actions>
60      </td>
61    </tr>
62    <!-- Empty table -->
63    <tr ng-if="$ctrl.data.length === 0">
64      <td>No data</td>
65    </tr>
66  </tbody>
67</table>