From e3f3fda63efff9488d147170ce47944831889775 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A9r=C3=A9my=20TOUZY?= <jtouzy2@gmail.com>
Date: Fri, 9 Dec 2016 16:55:04 +0100
Subject: [PATCH] add md-tooltip for tabheader (#171)

* [new] md-tabs improvements : md-tooltip

* [fix] Set the bottom default value on the prop definition
---
 docs/src/pages/components/Tabs.vue | 16 ++++++++++++++--
 src/components/mdTabs/mdTab.vue    | 15 ++++++++++++++-
 2 files changed, 28 insertions(+), 3 deletions(-)

diff --git a/docs/src/pages/components/Tabs.vue b/docs/src/pages/components/Tabs.vue
index 3f00e97..f53de49 100644
--- a/docs/src/pages/components/Tabs.vue
+++ b/docs/src/pages/components/Tabs.vue
@@ -115,6 +115,18 @@
                 <md-table-cell><code>Boolean</code></md-table-cell>
                 <md-table-cell>Disable the tab and prevent his actions. Default <code>false</code></md-table-cell>
               </md-table-row>
+
+              <md-table-row>
+                <md-table-cell>md-tooltip</md-table-cell>
+                <md-table-cell><code>String</code></md-table-cell>
+                <md-table-cell>Add a tooltip on the tab header. Default: No tooltip.</md-table-cell>
+              </md-table-row>
+
+              <md-table-row>
+                <md-table-cell>md-tooltip-direction</md-table-cell>
+                <md-table-cell><code>String</code></md-table-cell>
+                <md-table-cell>Direction of the tab header tooltip. Default: <code>bottom</code></md-table-cell>
+              </md-table-row>
             </md-table-body>
           </md-table>
         </api-table>
@@ -137,7 +149,7 @@
                 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt dolorum quas.</p>
               </md-tab>
 
-              <md-tab id="pictures" md-label="Pictures">
+              <md-tab id="pictures" md-label="Pictures" md-tooltip="This is the pictures tab!">
                 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt dolorum quas.</p>
               </md-tab>
             </md-tabs>
@@ -159,7 +171,7 @@
                   &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt dolorum quas.&lt;/p&gt;
                 &lt;/md-tab&gt;
 
-                &lt;md-tab id=&quot;pictures&quot; md-label=&quot;Pictures&quot;&gt;
+                &lt;md-tab id=&quot;pictures&quot; md-label=&quot;Pictures&quot; md-tooltip=&quot;This is the pictures tab!&quot;&gt;
                   &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt dolorum quas.&lt;/p&gt;
                 &lt;/md-tab&gt;
               &lt;/md-tabs&gt;
diff --git a/src/components/mdTabs/mdTab.vue b/src/components/mdTabs/mdTab.vue
index d1f4f5a..cf99bc1 100644
--- a/src/components/mdTabs/mdTab.vue
+++ b/src/components/mdTabs/mdTab.vue
@@ -14,7 +14,12 @@
       mdLabel: [String, Number],
       mdIcon: String,
       mdActive: Boolean,
-      mdDisabled: Boolean
+      mdDisabled: Boolean,
+      mdTooltip: String,
+      mdTooltipDirection: {
+        type: String,
+        default: 'bottom'
+      }
     },
     data() {
       return {
@@ -36,6 +41,12 @@
       },
       mdLabel() {
         this.updateTabData();
+      },
+      mdTooltip() {
+        this.updateTabData();
+      },
+      mdTooltipDirection() {
+        this.updateTabData();
       }
     },
     computed: {
@@ -54,6 +65,8 @@
           icon: this.mdIcon,
           active: this.mdActive,
           disabled: this.mdDisabled,
+          tooltip: this.mdTooltip,
+          tooltipDirection: this.mdTooltipDirection,
           ref: this
         };
       },