diff options
author | Israel Lavi <il0695@att.com> | 2018-08-07 10:54:17 +0300 |
---|---|---|
committer | Israel Lavi <il0695@att.com> | 2018-08-07 11:06:44 +0300 |
commit | b2a3acea0d0f66028c9ce5fad02d4ecc64abf70c (patch) | |
tree | 8d70110f34cb845965c42a5915e950bca967d2c3 /src/angular/tabs | |
parent | 05b37297177e8a342668c15e5d6f738b51f7aedd (diff) |
Initial commit.
Adding files needed for Linux Foundation.
Change-Id: I9f2b4851a5ae01f83800c7f8bab8608a2221c730
Issue-ID: SDC-1608
Signed-off-by: Israel Lavi <il0695@att.com>
Diffstat (limited to 'src/angular/tabs')
-rw-r--r-- | src/angular/tabs/children/tab.component.html.ts | 2 | ||||
-rw-r--r-- | src/angular/tabs/children/tab.component.ts | 2 | ||||
-rw-r--r-- | src/angular/tabs/tabs.component.html.ts | 2 | ||||
-rw-r--r-- | src/angular/tabs/tabs.component.ts | 31 | ||||
-rw-r--r-- | src/angular/tabs/tabs.module.ts | 1 |
5 files changed, 19 insertions, 19 deletions
diff --git a/src/angular/tabs/children/tab.component.html.ts b/src/angular/tabs/children/tab.component.html.ts index 36ff413..cff7a8c 100644 --- a/src/angular/tabs/children/tab.component.html.ts +++ b/src/angular/tabs/children/tab.component.html.ts @@ -1,4 +1,4 @@ -export default ` +export const template = ` <div [hidden]="!active" class="sdc-tab-content" role="tabpanel"> <ng-content></ng-content> </div> diff --git a/src/angular/tabs/children/tab.component.ts b/src/angular/tabs/children/tab.component.ts index 3b96e87..a289aab 100644 --- a/src/angular/tabs/children/tab.component.ts +++ b/src/angular/tabs/children/tab.component.ts @@ -1,6 +1,6 @@ import { Component, Input } from '@angular/core'; import { Mode } from './../../common/enums'; -import template from "./tab.component.html"; +import { template } from "./tab.component.html"; @Component({ selector: 'sdc-tab', diff --git a/src/angular/tabs/tabs.component.html.ts b/src/angular/tabs/tabs.component.html.ts index 2333b86..ac82dd6 100644 --- a/src/angular/tabs/tabs.component.html.ts +++ b/src/angular/tabs/tabs.component.html.ts @@ -1,4 +1,4 @@ -export default ` +export const template = ` <ul class="sdc-tabs-list" role="tablist"> <li *ngFor="let tab of tabs" class="sdc-tab" role="tab" (click)="selectTab(tab)" [class.sdc-tab-active]="tab.active"> <span *ngIf="tab.title">{{tab.title}}</span> diff --git a/src/angular/tabs/tabs.component.ts b/src/angular/tabs/tabs.component.ts index 595f304..c3b6507 100644 --- a/src/angular/tabs/tabs.component.ts +++ b/src/angular/tabs/tabs.component.ts @@ -1,8 +1,7 @@ -import { Component, Input, AfterContentInit, ContentChildren, QueryList, HostBinding } from '@angular/core'; +import { Component, Input, AfterContentInit, ContentChildren, QueryList, HostBinding, EventEmitter, Output } from '@angular/core'; import { TabComponent } from './children/tab.component'; -import { SvgIconComponent } from "./../../../src/angular/svg-icon/svg-icon.component"; -import { Mode, Placement, Size } from './../common/enums'; -import template from "./tabs.component.html"; +import { Mode, Size } from './../common/enums'; +import { template } from "./tabs.component.html"; @Component({ selector: 'sdc-tabs', @@ -12,20 +11,22 @@ import template from "./tabs.component.html"; export class TabsComponent implements AfterContentInit { @HostBinding('class') classes = 'sdc-tabs sdc-tabs-header'; - @ContentChildren(TabComponent) private tabs: QueryList<TabComponent>; + @ContentChildren(TabComponent) public tabs: QueryList<TabComponent>; + @Output() public selectedTab: EventEmitter<TabComponent> = new EventEmitter<TabComponent>(); public _size = Size.medium; public selectTab(tab: TabComponent) { - // deactivate all tabs - this.tabs.toArray().forEach((_tab: TabComponent) => { - _tab.active = false; - _tab.titleIconMode = Mode.secondary; - }); - - // activate the tab the user has clicked on. - tab.active = true; - tab.titleIconMode = Mode.primary; + this.selectedTab.emit(tab); + // deactivate all tabs + this.tabs.toArray().forEach((_tab: TabComponent) => { + _tab.active = false; + _tab.titleIconMode = Mode.secondary; + }); + + // activate the tab the user has clicked on. + tab.active = true; + tab.titleIconMode = Mode.primary; } public ngAfterContentInit() { @@ -38,4 +39,4 @@ export class TabsComponent implements AfterContentInit { } } - } +} diff --git a/src/angular/tabs/tabs.module.ts b/src/angular/tabs/tabs.module.ts index 107942d..6b42c0e 100644 --- a/src/angular/tabs/tabs.module.ts +++ b/src/angular/tabs/tabs.module.ts @@ -1,6 +1,5 @@ import { NgModule } from "@angular/core"; import { CommonModule } from "@angular/common"; -import { FormElementsModule } from "../form-elements/form-elements.module"; import { TabsComponent } from "./tabs.component"; import { TabComponent } from './children/tab.component'; import { SvgIconModule } from './../svg-icon/svg-icon.module'; |