Skip to content

Commit a122e1c

Browse files
committed
feat(tabs/bottomnav): removing redundant variable type, adding dev samples #4297
1 parent f0caa17 commit a122e1c

File tree

12 files changed

+160
-5
lines changed

12 files changed

+160
-5
lines changed

projects/igniteui-angular/src/lib/tabs/tabs-group.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -167,7 +167,7 @@ export class IgxTabsGroupComponent implements IgxTabsGroupBase, AfterContentInit
167167
*```
168168
* @param focusDelay A number representing the expected delay.
169169
*/
170-
public select(focusDelay = 200, navigateToRoute: boolean = true): void {
170+
public select(focusDelay = 200, navigateToRoute = true): void {
171171
if (this.disabled || this.isSelected) {
172172
return;
173173
}

projects/igniteui-angular/src/lib/tabs/tabs.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -321,7 +321,7 @@ export class IgxTabsComponent implements IgxTabsBase, AfterViewInit, OnDestroy {
321321
}, 0);
322322
}
323323

324-
private selectGroupByIndex(selectedIndex: number, navigateToRoute: boolean = true): void {
324+
private selectGroupByIndex(selectedIndex: number, navigateToRoute = true): void {
325325
const selectableGroups = this.groups.filter((selectableGroup) => !selectableGroup.disabled);
326326
const group = selectableGroups[selectedIndex];
327327

src/app/app.component.ts

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,11 @@ export class AppComponent implements OnInit {
5353
icon: 'tab',
5454
name: 'Bottom Navigation'
5555
},
56+
{
57+
link: '/bottom-navigation-routing',
58+
icon: 'tab',
59+
name: 'Bottom Navigation Routing'
60+
},
5661
{
5762
link: '/buttonGroup',
5863
icon: 'group_work',
@@ -278,6 +283,11 @@ export class AppComponent implements OnInit {
278283
icon: 'tab',
279284
name: 'Tabs'
280285
},
286+
{
287+
link: '/tabs-routing',
288+
icon: 'tab',
289+
name: 'Tabs Routing'
290+
},
281291
{
282292
link: '/timePicker',
283293
icon: 'date_range',

src/app/app.module.ts

Lines changed: 16 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -87,8 +87,11 @@ import { GridSearchBoxComponent } from './grid-search-box/grid-search-box.compon
8787
import { GridSearchComponent } from './grid-search/grid-search.sample';
8888
import { AutocompleteSampleComponent, AutocompletePipeContains, AutocompleteGroupPipeContains } from './autocomplete/autocomplete.sample';
8989
import { GridFilterTemplateSampleComponent } from './grid-filter-template/grid-filter-template.sample';
90-
91-
90+
import { BottomNavRoutingSampleComponent } from './bottomnav-routing/bottomnav-routing.sample';
91+
import { RoutingView1Component } from './bottomnav-routing/bottomnav-routing.sample';
92+
import { RoutingView2Component } from './bottomnav-routing/bottomnav-routing.sample';
93+
import { RoutingView3Component } from './bottomnav-routing/bottomnav-routing.sample';
94+
import { TabsRoutingSampleComponent } from './tabs-routing/tabs-routing.sample';
9295

9396
const components = [
9497
AppComponent,
@@ -129,7 +132,12 @@ const components = [
129132
SliderSampleComponent,
130133
SnackbarSampleComponent,
131134
BottomNavSampleComponent,
135+
BottomNavRoutingSampleComponent,
136+
RoutingView1Component,
137+
RoutingView2Component,
138+
RoutingView3Component,
132139
TabsSampleComponent,
140+
TabsRoutingSampleComponent,
133141
TimePickerSampleComponent,
134142
ToastSampleComponent,
135143
VirtualForSampleComponent,
@@ -196,6 +204,11 @@ const components = [
196204
IgxOverlayService,
197205
{ provide: DisplayDensityToken, useFactory: () => ({ displayDensity: DisplayDensity.comfortable }) }
198206
],
199-
bootstrap: [AppComponent]
207+
bootstrap: [AppComponent],
208+
entryComponents: [
209+
RoutingView1Component,
210+
RoutingView2Component,
211+
RoutingView3Component,
212+
]
200213
})
201214
export class AppModule { }

src/app/app.routing.ts

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ import { ColorsSampleComponent } from './styleguide/colors/color.sample';
2525
import { ShadowsSampleComponent } from './styleguide/shadows/shadows.sample';
2626
import { TypographySampleComponent } from './styleguide/typography/typography.sample';
2727
import { BottomNavSampleComponent, CustomContentComponent } from './bottomnav/bottomnav.sample';
28+
import { BottomNavRoutingSampleComponent } from './bottomnav-routing/bottomnav-routing.sample';
2829
import { TabsSampleComponent } from './tabs/tabs.sample';
2930
import { TimePickerSampleComponent } from './time-picker/time-picker.sample';
3031
import { ToastSampleComponent } from './toast/toast.sample';
@@ -52,6 +53,10 @@ import { BannerSampleComponent } from './banner/banner.sample';
5253
import { CalendarViewsSampleComponent } from './calendar-views/calendar-views.sample';
5354
import { AutocompleteSampleComponent } from './autocomplete/autocomplete.sample';
5455
import { SelectSampleComponent } from './select/select.sample';
56+
import { RoutingView1Component } from './bottomnav-routing/bottomnav-routing.sample';
57+
import { RoutingView2Component } from './bottomnav-routing/bottomnav-routing.sample';
58+
import { RoutingView3Component } from './bottomnav-routing/bottomnav-routing.sample';
59+
import { TabsRoutingSampleComponent } from './tabs-routing/tabs-routing.sample';
5560

5661
const appRoutes = [
5762
{
@@ -184,10 +189,28 @@ const appRoutes = [
184189
path: 'bottom-navigation',
185190
component: BottomNavSampleComponent
186191
},
192+
{
193+
path: 'bottom-navigation-routing',
194+
component: BottomNavRoutingSampleComponent,
195+
children: [
196+
{ path: 'view1', component: RoutingView1Component },
197+
{ path: 'view2', component: RoutingView2Component },
198+
{ path: 'view3', component: RoutingView3Component }
199+
]
200+
},
187201
{
188202
path: 'tabs',
189203
component: TabsSampleComponent
190204
},
205+
{
206+
path: 'tabs-routing',
207+
component: TabsRoutingSampleComponent,
208+
children: [
209+
{ path: 'view1', component: RoutingView1Component },
210+
{ path: 'view2', component: RoutingView2Component },
211+
{ path: 'view3', component: RoutingView3Component }
212+
]
213+
},
191214
{
192215
path: 'timePicker',
193216
component: TimePickerSampleComponent

src/app/bottomnav-routing/bottomnav-routing.sample.css

Whitespace-only changes.
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<div class="sample-wrapper">
2+
<app-page-header title="Tabbar">
3+
Allows the user to navigate between different content displayed in one view. Supports routing.
4+
</app-page-header>
5+
<div class="sample-content">
6+
<article class="sample-column">
7+
<div class="tabbar-wrapper" #tabbarEl>
8+
<div>
9+
<router-outlet></router-outlet>
10+
</div>
11+
<igx-bottom-nav>
12+
<igx-tab-panel #tab1 label="Tab 1" routerLink='/bottom-navigation-routing/view1'>
13+
Content in tab # 1
14+
</igx-tab-panel>
15+
<igx-tab-panel #tab2 label="Tab 2" routerLink='/bottom-navigation-routing/view2'>
16+
Content in tab # 2
17+
</igx-tab-panel>
18+
<igx-tab-panel #tab3 label="Tab 3" routerLink='/bottom-navigation-routing/view3'>
19+
Content in tab # 3
20+
</igx-tab-panel>
21+
</igx-bottom-nav>
22+
</div>
23+
</article>
24+
</div>
25+
</div>
Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
import { Component } from '@angular/core';
2+
3+
@Component({
4+
selector: 'app-bottomnav-routing-sample',
5+
styleUrls: ['bottomnav-routing.sample.css'],
6+
templateUrl: 'bottomnav-routing.sample.html'
7+
})
8+
export class BottomNavRoutingSampleComponent {
9+
}
10+
11+
@Component({
12+
selector: 'app-bottomnav-routing-view1-sample',
13+
template: `This is content in component # 1`
14+
})
15+
export class RoutingView1Component {
16+
}
17+
18+
@Component({
19+
selector: 'app-bottomnav-routing-view2-sample',
20+
template: `This is content in component # 2`
21+
})
22+
export class RoutingView2Component {
23+
}
24+
25+
@Component({
26+
selector: 'app-bottomnav-routing-view3-sample',
27+
template: `This is content in component # 3`
28+
})
29+
export class RoutingView3Component {
30+
}

src/app/routing.ts

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ import { ColorsSampleComponent } from './styleguide/colors/color.sample';
2828
import { ShadowsSampleComponent } from './styleguide/shadows/shadows.sample';
2929
import { TypographySampleComponent } from './styleguide/typography/typography.sample';
3030
import { BottomNavSampleComponent, CustomContentComponent } from './bottomnav/bottomnav.sample';
31+
import { BottomNavRoutingSampleComponent } from './bottomnav-routing/bottomnav-routing.sample';
3132
import { TabsSampleComponent } from './tabs/tabs.sample';
3233
import { TimePickerSampleComponent } from './time-picker/time-picker.sample';
3334
import { ToastSampleComponent } from './toast/toast.sample';
@@ -66,6 +67,10 @@ import { SelectSampleComponent } from './select/select.sample';
6667
import { GridSearchComponent } from './grid-search/grid-search.sample';
6768
import { AutocompleteSampleComponent } from './autocomplete/autocomplete.sample';
6869
import { GridFilterTemplateSampleComponent } from './grid-filter-template/grid-filter-template.sample';
70+
import { RoutingView1Component } from './bottomnav-routing/bottomnav-routing.sample';
71+
import { RoutingView2Component } from './bottomnav-routing/bottomnav-routing.sample';
72+
import { RoutingView3Component } from './bottomnav-routing/bottomnav-routing.sample';
73+
import { TabsRoutingSampleComponent } from './tabs-routing/tabs-routing.sample';
6974

7075
const appRoutes = [
7176
{
@@ -230,10 +235,28 @@ const appRoutes = [
230235
path: 'bottom-navigation',
231236
component: BottomNavSampleComponent
232237
},
238+
{
239+
path: 'bottom-navigation-routing',
240+
component: BottomNavRoutingSampleComponent,
241+
children: [
242+
{ path: 'view1', component: RoutingView1Component },
243+
{ path: 'view2', component: RoutingView2Component },
244+
{ path: 'view3', component: RoutingView3Component }
245+
]
246+
},
233247
{
234248
path: 'tabs',
235249
component: TabsSampleComponent
236250
},
251+
{
252+
path: 'tabs-routing',
253+
component: TabsRoutingSampleComponent,
254+
children: [
255+
{ path: 'view1', component: RoutingView1Component },
256+
{ path: 'view2', component: RoutingView2Component },
257+
{ path: 'view3', component: RoutingView3Component }
258+
]
259+
},
237260
{
238261
path: 'timePicker',
239262
component: TimePickerSampleComponent

src/app/tabs-routing/tabs-routing.sample.css

Whitespace-only changes.

0 commit comments

Comments
 (0)