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 @@ Boolean Disable the tab and prevent his actions. Default false + + + md-tooltip + String + Add a tooltip on the tab header. Default: No tooltip. + + + + md-tooltip-direction + String + Direction of the tab header tooltip. Default: bottom + @@ -137,7 +149,7 @@

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt dolorum quas.

- +

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deserunt dolorum quas.

@@ -159,7 +171,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> 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 }; },