feat(tabs): added input tabId (#151)

positive-js · Jun 26, 2019 · d06ffa5 · d06ffa5
1 parent 7311fab
commit d06ffa5
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 3 deletions.
diff --git a/packages/mosaic-dev/tabs/module.ts b/packages/mosaic-dev/tabs/module.ts
@@ -75,6 +75,10 @@ export class TabsDemoComponent {
     toggleBackground() {
         this.background = this.background ? '' : 'primary';
     }
+
+    selectedTabChange($event: any) {
+        console.log('selectedTabChange');
+    }
 }
 
 

diff --git a/packages/mosaic-dev/tabs/template.html b/packages/mosaic-dev/tabs/template.html
@@ -1,8 +1,8 @@
 <div>
     <h4>Default tabs</h4>
-    <mc-tab-group>
-        <mc-tab label="First">Content 1</mc-tab>
-        <mc-tab label="Second">Content 2</mc-tab>
+    <mc-tab-group (selectedTabChange)="selectedTabChange($event)">
+        <mc-tab [tabId]="'firstTab'" label="First">Content 1</mc-tab>
+        <mc-tab [tabId]="'secondTab'" label="Second">Content 2</mc-tab>
         <mc-tab disabled label="Third">Content 3</mc-tab>
         <mc-tab label="4">Content 4</mc-tab>
         <mc-tab label="5">Content 5</mc-tab>

diff --git a/packages/mosaic/tabs/tab.ts b/packages/mosaic/tabs/tab.ts
@@ -64,6 +64,9 @@ export class McTab extends mcTabMixinBase
     @Input('label')
     textLabel: string = '';
 
+    @Input('tabId')
+    tabId: string;
+
     /** Aria label for the tab. */
     @Input('aria-label')
     ariaLabel: string;