fix(oui-header-tabs): set as button when no href

Signed-off-by: Axel Peter <axel.peter@live.com>

Author: AxelPeter

packages/oui-header-tabs/README.md

@@ -13,6 +13,7 @@
     <oui-header-tabs-item text="Header Tabs" href="/#!/oui-angular/header-tabs" active></oui-header-tabs-item>
     <oui-header-tabs-item text="Pagination" href="/#!/oui-angular/pagination"></oui-header-tabs-item>
     <oui-header-tabs-item text="Datagrid" href="/#!/oui-angular/datagrid"></oui-header-tabs-item>
+    <oui-header-tabs-item text="Button"></oui-header-tabs-item>
 </oui-header-tabs>
 ```
 
@@ -28,6 +29,7 @@
         <oui-header-tabs-divider></oui-header-tabs-divider>
         <oui-header-tabs-item text="Select" href="/#!/oui-angular/select"></oui-header-tabs-item>
         <oui-header-tabs-item text="Select Picker" href="/#!/oui-angular/select-picker"></oui-header-tabs-item>
+    <oui-header-tabs-item text="Button"></oui-header-tabs-item>
     </oui-header-tabs-dropdown>
     <oui-header-tabs-dropdown text="Datagrid">
         <oui-header-tabs-item text="Datagrid" href="/#!/oui-angular/datagrid"></oui-header-tabs-item>

packages/oui-header-tabs/src/header-tabs-item.html

@@ -1,21 +1,30 @@
 <div class="oui-header-tabs__item" role="listitem"
     ui-sref-active="oui-header-tabs__item_active"
     ng-class="{ 'oui-header-tabs__item_active': $ctrl.active, 'oui-header-tabs__item_disabled': $ctrl.disabled }">
-    <a ng-attr-rel="{{::$ctrl.linkRel}}"
-       ng-attr-target="{{::$ctrl.linkTarget}}"
-       ng-href="{{::$ctrl.href}}"
-       ng-if="!!$ctrl.href && !$ctrl.disabled"
-       ng-click="$ctrl.onClick()">
+    <button class="oui-header-tabs__action"
+        ng-bind="::$ctrl.text"
+        ng-click="$ctrl.onClick()"
+        ng-if="!$ctrl.href && !$ctrl.state && !$ctrl.disabled">
+    </button>
+    <a class="oui-header-tabs__action"
+        ng-attr-rel="{{::$ctrl.linkRel}}"
+        ng-attr-target="{{::$ctrl.linkTarget}}"
+        ng-href="{{::$ctrl.href}}"
+        ng-if="!!$ctrl.href && !$ctrl.disabled"
+        ng-click="$ctrl.onClick()">
         <span ng-bind="::$ctrl.text"></span>
         <span class="oui-icon oui-icon-external_link" aria-hidden="true"
-              ng-if="::$ctrl.external">
+                ng-if="::$ctrl.external">
         </span>
     </a>
-    <a ng-bind="::$ctrl.text"
-       ng-click="$ctrl.onClick()"
-       ng-if="!!$ctrl.state && !$ctrl.disabled"
-       ui-sref="{{::$ctrl.getFullSref()}}">
+    <a class="oui-header-tabs__action"
+        ng-bind="::$ctrl.text"
+        ng-click="$ctrl.onClick()"
+        ng-if="!!$ctrl.state && !$ctrl.disabled"
+        ui-sref="{{::$ctrl.getFullSref()}}">
     </a>
-    <span ng-bind="::$ctrl.text"
-          ng-if="!!$ctrl.disabled"></span>
+    <span class="oui-header-tabs__action"
+        ng-bind="::$ctrl.text"
+        ng-if="!!$ctrl.disabled">
+    </span>
 </div>