Skip to content

Commit 42df9e7

Browse files
LipataLipata
committed
Merge branch 'dropdown-poc' into combo
2 parents f46c147 + 4db72ad commit 42df9e7

21 files changed

+4695
-2580
lines changed

‎demos/app/app.component.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,11 @@ export class AppComponent implements OnInit {
2525
};
2626

2727
public componentLinks = [
28+
{
29+
link: "/drop-down",
30+
icon: "account_circle",
31+
name: "DropDown"
32+
},
2833
{
2934
link: "/avatar",
3035
icon: "account_circle",

‎demos/app/app.module.ts

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,13 +19,14 @@ import { CarouselSampleModule } from "./carousel/sample.module";
1919
import { IgxDatePickerSampleModule } from "./date-picker/sample.module";
2020
import { DialogSampleModule } from "./dialog/sample.module";
2121
import { MaskSampleModule } from "./directives/mask/sample.module";
22+
import { DropDownSampleModule } from "./drop-down/sample.module";
2223
import { GridColumnPinningSampleModule } from "./grid-column-pinning/sample.module";
2324
import { GridColumnResizingSampleModule } from "./grid-column-resizing/sample.module";
2425
import { GridPerformanceSampleModule } from "./grid-performance/sample.module";
25-
import { GridSummarySampleModule } from "./grid-summaries/sample.module";
26+
import { GridVirtualizationSampleModule } from "./grid-remote-virtualization/sample.module";
2627
import { GridSelectionModule } from "./grid-selection/sample.module";
28+
import { GridSummarySampleModule } from "./grid-summaries/sample.module";
2729
import { GridSampleModule } from "./grid/sample.module";
28-
import { GridVirtualizationSampleModule } from "./grid-remote-virtualization/sample.module";
2930
import { IconSampleModule } from "./icon/sample.module";
3031
import { InputGroupSampleModule } from "./input-group/sample.module";
3132
import { InputSampleModule } from "./input/sample.module";
@@ -100,7 +101,8 @@ import { VirtualForSampleModule } from "./virtual-for-directive/sample.module";
100101
ListPerformanceSampleModule,
101102
VirtualForSampleModule,
102103
IgxTimePickerSampleModule,
103-
MaskSampleModule
104+
MaskSampleModule,
105+
DropDownSampleModule
104106
],
105107
providers: [IgxNavigationService]
106108
})

‎demos/app/app.routing.ts

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,18 +7,18 @@ import { ButtonsSampleComponent } from "./button/sample.component";
77
import { ButtonGroupSampleComponent } from "./buttonGroup/sample.component";
88
import { IgxCalendarSampleComponent } from "./calendar/sample.component";
99
import { IgxCardSampleComponent } from "./card/sample.component";
10-
import { IgxTimePickerSampleComponent } from "./time-picker/sample.component";
1110
import { CarouselSampleComponent } from "./carousel/sample.component";
1211
import { IgxDatePickerSampleComponent } from "./date-picker/sample.component";
1312
import { DialogSampleComponent } from "./dialog/sample.component";
1413
import { MaskSampleComponent } from "./directives/mask/sample.component";
14+
import { DropDownSampleComponent } from "./drop-down/sample.component";
1515
import { GridColumnPinningSampleComponent } from "./grid-column-pinning/sample.component";
1616
import { GridColumnResizingSampleComponent } from "./grid-column-resizing/sample.component"
1717
import { GridPerformanceSampleComponent } from "./grid-performance/sample.component";
18+
import { GridVirtualizationSampleComponent } from "./grid-remote-virtualization/sample.component";
1819
import { GridSelectionComponent } from "./grid-selection/sample.component";
1920
import { GridSummaryComponent } from "./grid-summaries/sample.component";
2021
import { GridSampleComponent } from "./grid/sample.component";
21-
import { GridVirtualizationSampleComponent } from "./grid-remote-virtualization/sample.component";
2222
import { IconSampleComponent } from "./icon/sample.component";
2323
import { InputGroupSampleComponent } from "./input-group/input-group.component";
2424
import { InputSampleComponent } from "./input/sample.component";
@@ -41,6 +41,7 @@ import {
4141
import {
4242
TabsSampleComponent
4343
} from "./tabs/sample.component";
44+
import { IgxTimePickerSampleComponent } from "./time-picker/sample.component";
4445
import { IgxToastSampleComponent } from "./toast/sample.component";
4546
import { VirtualForSampleComponent } from "./virtual-for-directive/sample.component";
4647

@@ -50,6 +51,10 @@ const appRoutes: Routes = [
5051
pathMatch: "full",
5152
redirectTo: "/avatar"
5253
},
54+
{
55+
component: DropDownSampleComponent,
56+
path: "drop-down"
57+
},
5358
{
5459
component: InputSampleComponent,
5560
path: "inputs"

‎demos/app/drop-down/sample.component.css

Whitespace-only changes.

‎demos/app/drop-down/sample.component.html

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<div class="sample-wrapper">
2+
<page-header title="Dropdown menu" description="description for dropdown menu"></page-header>
3+
<section class="sample-content">
4+
5+
<button igxButton="raised" igxRipple (click)="toggleDropDown()">Toggle</button>
6+
<igx-drop-down (onSelection)="onSelection($event)">
7+
<igx-drop-down-item *ngFor="let item of items" isDisabled={{item.disabled}} isHeader={{item.header}}>
8+
{{ item.field }}
9+
</igx-drop-down-item>
10+
</igx-drop-down>
11+
<div class=""></div>
12+
</section>
13+
</div>

‎demos/app/drop-down/sample.component.ts

Lines changed: 112 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,112 @@
1+
import { Component, OnInit, ViewChild } from "@angular/core";
2+
import { IgxDropDownComponent } from "../../lib/main";
3+
@Component({
4+
// tslint:disable-next-line:component-selector
5+
selector: "drop-down-sample",
6+
templateUrl: "./sample.component.html",
7+
styleUrls: ["sample.component.css"]
8+
})
9+
export class DropDownSampleComponent implements OnInit {
10+
private width = "160px";
11+
@ViewChild(IgxDropDownComponent) public igxDropDown: IgxDropDownComponent;
12+
13+
items: any[] = [];
14+
15+
ngOnInit() {
16+
this.igxDropDown.height = "400px";
17+
// this.igxDropDown.allowItemsFocus = false;
18+
}
19+
20+
constructor() {
21+
const states = [
22+
"New England",
23+
"Connecticut",
24+
"Maine",
25+
"Massachusetts",
26+
"New Hampshire",
27+
"Rhode Island",
28+
"Vermont",
29+
"Mid-Atlantic",
30+
"New Jersey",
31+
"New York",
32+
"Pennsylvania",
33+
"East North Central",
34+
"Illinois",
35+
"Indiana",
36+
"Michigan",
37+
"Ohio",
38+
"Wisconsin",
39+
"West North Central",
40+
"Iowa",
41+
"Kansas",
42+
"Minnesota",
43+
"Missouri",
44+
"Nebraska",
45+
"North Dakota",
46+
"South Dakota",
47+
"South Atlantic",
48+
"Delaware",
49+
"Florida",
50+
"Georgia",
51+
"Maryland",
52+
"North Carolina",
53+
"South Carolina",
54+
"Virginia",
55+
"District of Columbia",
56+
"West Virginia",
57+
"East South Central",
58+
"Alabama",
59+
"Kentucky",
60+
"Mississippi",
61+
"Tennessee",
62+
"West South Central",
63+
"Arkansas",
64+
"Louisiana",
65+
"Oklahoma",
66+
"Texas",
67+
"Mountain",
68+
"Arizona",
69+
"Colorado",
70+
"Idaho",
71+
"Montana",
72+
"Nevada",
73+
"New Mexico",
74+
"Utah",
75+
"Wyoming",
76+
"Pacific",
77+
"Alaska",
78+
"California",
79+
"Hawaii",
80+
"Oregon",
81+
"Washington"];
82+
83+
const areas = [
84+
"New England",
85+
"Mid-Atlantic",
86+
"East North Central",
87+
"West North Central",
88+
"South Atlantic",
89+
"East South Central",
90+
"West South Central",
91+
"Mountain",
92+
"Pacific"
93+
];
94+
95+
for (let i = 0; i < states.length; i += 1) {
96+
const item = { field: states[i] };
97+
if (areas.indexOf(states[i]) !== -1) {
98+
item["header"] = true;
99+
} else if (i % 7 === 4 || i > 49) {
100+
item["disabled"] = true;
101+
}
102+
this.items.push(item);
103+
}
104+
}
105+
106+
public toggleDropDown() {
107+
this.igxDropDown.toggle();
108+
}
109+
110+
onSelection(ev) {
111+
}
112+
}

‎demos/app/drop-down/sample.module.ts

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import { CommonModule } from "@angular/common";
2+
import { NgModule } from "@angular/core";
3+
4+
import { IgxDropDownModule, IgxToggleModule } from "../../lib/main";
5+
import { PageHeaderModule } from "../pageHeading/pageHeading.module";
6+
import { DropDownSampleComponent } from "./sample.component";
7+
8+
@NgModule({
9+
declarations: [DropDownSampleComponent],
10+
imports: [CommonModule, PageHeaderModule, IgxToggleModule, IgxDropDownModule]
11+
})
12+
export class DropDownSampleModule { }

0 commit comments

Comments
 (0)