Skip to content

Commit f153441

Browse files
ChronosSFChronosSF
committed
merge from master
1 parent 8190f13 commit f153441

14 files changed

Lines changed: 627 additions & 193 deletions

File tree

‎package-lock.json‎

Lines changed: 467 additions & 169 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/app/data-entries/data-entries-routes-data.ts‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,5 +57,6 @@ export const dataEntriesRoutesData = {
5757
"select-sample-4": { displayName: "Custom Overlay Settings", parentName: "Select" },
5858
"select-input-directives": { displayName: "Select Input Directives", parentName: "Select" },
5959
"select-header-footer": { displayName: "Select with Header&Footer Templates", parentName: "Select" },
60-
"input-text-selection": { displayName: "Input with Text Selection", parentName: "Input Group" }
60+
"input-text-selection": { displayName: "Input with Text Selection", parentName: "Input Group" },
61+
"typed-form": { displayName: "Typed Form", parentName: "Input Group" }
6162
};

‎src/app/data-entries/data-entries-routing.module.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@ import { InputGroupSample5Component } from './input-group/input-group-sample-5/i
4242
import { InputGroupSample6Component } from './input-group/input-group-sample-6/input-group-sample-6.component';
4343
import { InputGroupStyleComponent } from './input-group/input-group-styling/input-group-styling.component';
4444
import { InputTextSelectionComponent } from './input-group/input-text-selection/input-text-selection.component';
45+
import { TypedFormComponent } from './input-group/typed-form/typed-form.component';
4546
import { ReactiveFormsSampleComponent } from '../how-to/reactive-forms/reactive-forms.component';
4647
import { RadioGroupVerticalComponent } from './radio/radio-group-vertical/radio-group-vertical.component';
4748
import { RadioGroupSampleComponent } from './radio/radio-group-sample/radio-group-sample.component';
@@ -344,6 +345,11 @@ export const dataEntriesRoutes: Routes = [
344345
component: InputTextSelectionComponent,
345346
data: dataEntriesRoutesData['input-text-selection'],
346347
path: 'input-text-selection'
348+
},
349+
{
350+
component: TypedFormComponent,
351+
data: dataEntriesRoutesData['typed-form'],
352+
path: 'typed-form'
347353
}
348354
];
349355

‎src/app/data-entries/data-entries.module.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,7 @@ import { SelectSample4Component } from './select/select-sample-4/select-sample-4
6666
import { SwitchSample1Component } from './switch/switch-sample-1/switch-sample-1.component';
6767
import { SwitchSample2Component } from './switch/switch-sample-2/switch-sample-2.component';
6868
import { SwitchStylingComponent } from './switch/switch-styling/switch-styling.component';
69+
import { TypedFormComponent } from './input-group/typed-form/typed-form.component';
6970
import { RatingInFormComponent } from './rating/rating-form/rating-form.component';
7071

7172
@NgModule({
@@ -127,7 +128,8 @@ import { RatingInFormComponent } from './rating/rating-form/rating-form.componen
127128
ButtonsDisplayDensityComponent,
128129
ButtonsStyleComponent,
129130
ButtonGroupStyleComponent,
130-
InputTextSelectionComponent
131+
InputTextSelectionComponent,
132+
TypedFormComponent
131133
],
132134
imports: [
133135
CommonModule,

‎src/app/data-entries/input-group/typed-form/typed-form.component.html‎

Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
<article class="sample-column">
2+
<form [formGroup]="registerForm" (ngSubmit)="onSubmit()">
3+
<h4>Registration Form</h4>
4+
<div class="container">
5+
<igx-input-group>
6+
<label igxLabel for="fName">First Name</label>
7+
<input igxInput name="fName" type="text" formControlName="fName" required />
8+
</igx-input-group>
9+
10+
<igx-input-group>
11+
<label igxLabel for="lName">Last Name</label>
12+
<input igxInput name="lName" type="text" formControlName="lName" required />
13+
</igx-input-group>
14+
15+
<igx-input-group>
16+
<label igxLabel for="email">Email</label>
17+
<input igxInput name="email" type="text" formControlName="email" required />
18+
</igx-input-group>
19+
20+
<igx-input-group>
21+
<label igxLabel for="number">Phone Number</label>
22+
<input igxInput name="number" type="number" formControlName="number" />
23+
</igx-input-group>
24+
25+
<igx-input-group>
26+
<label igxLabel for="company">Company</label>
27+
<input igxInput name="company" type="text" formControlName="company" />
28+
</igx-input-group>
29+
30+
<igx-date-picker name="date" [maxValue]="maxDate">
31+
<label igxLabel for="date">Date of Birth</label>
32+
<igx-picker-toggle igxSuffix>
33+
<igx-icon>today</igx-icon>
34+
</igx-picker-toggle>
35+
</igx-date-picker>
36+
37+
<igx-input-group>
38+
<label igxLabel for="password">Password</label>
39+
<input igxInput name="password" type="password" formControlName="password" required />
40+
</igx-input-group>
41+
42+
<button igxButton="raised" igxRipple type="submit">Submit</button>
43+
</div>
44+
</form>
45+
</article>

‎src/app/data-entries/input-group/typed-form/typed-form.component.scss‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
@use '../../../../variables' as *;
2+
3+
.container > * {
4+
margin-top: 32px;
5+
}
6+
7+
form {
8+
box-shadow: elevation($elevation: 4);
9+
padding: 24px;
10+
margin-bottom: 48px;
11+
}
12+
13+
h4 {
14+
margin-top: 0;
15+
}

‎src/app/data-entries/input-group/typed-form/typed-form.component.spec.ts‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import { ComponentFixture, TestBed } from '@angular/core/testing';
2+
3+
import { TypedFormComponent } from './typed-form.component';
4+
5+
describe('TypedFormComponent', () => {
6+
let component: TypedFormComponent;
7+
let fixture: ComponentFixture<TypedFormComponent>;
8+
9+
beforeEach(async () => {
10+
await TestBed.configureTestingModule({
11+
declarations: [ TypedFormComponent ]
12+
})
13+
.compileComponents();
14+
15+
fixture = TestBed.createComponent(TypedFormComponent);
16+
component = fixture.componentInstance;
17+
fixture.detectChanges();
18+
});
19+
20+
it('should create', () => {
21+
expect(component).toBeTruthy();
22+
});
23+
});

‎src/app/data-entries/input-group/typed-form/typed-form.component.ts‎

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
import { Component } from '@angular/core';
2+
import { FormControl, FormGroup } from "@angular/forms";
3+
4+
export interface registrationFormGroup
5+
{
6+
fName: FormControl<string>;
7+
lName: FormControl<string>;
8+
email: FormControl<string>;
9+
number?: FormControl<number|null>;
10+
company?: FormControl<string|null>;
11+
birthDate?: FormControl<string|null>;
12+
password: FormControl<string>;
13+
}
14+
15+
@Component({
16+
selector: 'app-typed-form',
17+
templateUrl: './typed-form.component.html',
18+
styleUrls: ['./typed-form.component.scss']
19+
})
20+
export class TypedFormComponent {
21+
public minDate = new Date();
22+
public maxDate = new Date(new Date(this.minDate.getFullYear(), this.minDate.getMonth(), this.minDate.getDate()));
23+
24+
registerForm = new FormGroup<registrationFormGroup>({
25+
fName: new FormControl<string>('', { nonNullable: true }),
26+
lName: new FormControl<string>('', { nonNullable: true }),
27+
email: new FormControl<string>('', { nonNullable: true}),
28+
number: new FormControl<number>(null, { nonNullable: false}),
29+
company: new FormControl<string>('', { nonNullable: false}),
30+
birthDate: new FormControl<string>('', { nonNullable: false}),
31+
password: new FormControl<string>('', { nonNullable: false})
32+
});
33+
34+
constructor() { }
35+
36+
public onSubmit() {
37+
console.log(this.registerForm.value);
38+
this.registerForm.reset();
39+
}
40+
}

‎src/app/data-entries/radio/radio-group-sample/radio-group-sample.component.ts‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
11
import { Component } from '@angular/core';
2-
import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
2+
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
33

44
@Component({
55
selector: 'app-radio-group-sample',
66
styleUrls: ['./radio-group-sample.component.scss'],
77
templateUrl: './radio-group-sample.component.html'
88
})
99
export class RadioGroupSampleComponent {
10-
public fruitsForm: UntypedFormGroup;
10+
public fruitsForm: FormGroup;
1111
public fruits = ['Apple', 'Mango', 'Banana', 'Orange'];
1212
public newModel: FruitData;
1313
public model: FruitData;
1414

15-
constructor(private _formBuilder: UntypedFormBuilder) {
15+
constructor(private _formBuilder: FormBuilder) {
1616
// Simulate getting data from external service
1717
this.model = {
1818
favFruit: this.fruits[0],

‎src/app/hierarchical-grid/hierarchical-grid-selection/hierarchical-grid-selection.component.ts‎

Lines changed: 10 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
import { Component, OnInit, ViewChild } from '@angular/core';
2-
import { IgxSnackbarComponent } from 'igniteui-angular';
1+
import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core';
2+
import { IgxSnackbarComponent, IRowSelectionEventArgs } from 'igniteui-angular';
33
import { SINGERS } from '../../data/singersData';
44

55
@Component({
@@ -8,7 +8,7 @@ import { SINGERS } from '../../data/singersData';
88
templateUrl: 'hierarchical-grid-selection.component.html'
99
})
1010

11-
export class HGridSelectionSampleComponent implements OnInit {
11+
export class HGridSelectionSampleComponent implements OnInit, OnDestroy {
1212
@ViewChild('snackbarRowCount', { static: true }) public snackbarRowCount: IgxSnackbarComponent;
1313
@ViewChild('snackbar', { static: true }) public snackbar: IgxSnackbarComponent;
1414
public localdata;
@@ -31,6 +31,10 @@ export class HGridSelectionSampleComponent implements OnInit {
3131
this.snackbar.open();
3232
}
3333

34+
public ngOnDestroy(): void {
35+
this.snackbar.close();
36+
}
37+
3438
public selectCellSelectionMode(args) {
3539
this.selectionMode = this.selectionModes[args.index].label;
3640
this.snackbarRowCount.close();
@@ -39,9 +43,9 @@ export class HGridSelectionSampleComponent implements OnInit {
3943
this.selectedRowIndex = undefined;
4044
}
4145

42-
public handleRowSelection(event) {
46+
public handleRowSelection(event: IRowSelectionEventArgs) {
4347
this.selectedRowsCount = event.newSelection.length;
44-
if(event.newSelection.length > 0){
48+
if (event.newSelection.length > 0) {
4549
this.selectedRowIndex = event.newSelection[0].ID;
4650
}
4751
else this.selectedRowIndex = undefined;
@@ -50,4 +54,5 @@ export class HGridSelectionSampleComponent implements OnInit {
5054
}
5155

5256
public formatter = (a) => a;
57+
5358
}

0 commit comments

Comments
 (0)