Skip to content

Commit

Permalink
feat(dependencies): upgrade covalent dependencies @angular@5.1 (Terad…
Browse files Browse the repository at this point in the history
…ata#1096)

* chore(dependencies): upgrade covalent dependencies @angular@5.1

* perf(divider): import divider module instead of list module in layout and menu modules

* feat(enums): leverage typescript string enums to remove the <any> cast

* fix(chips): underline not working properly on 5.1 material

* fix(chips): remove disabled chip since now we cant focus a chip if its disabled

* chore(): rollback test.ts

* fix(chips): deselect first option only if it has been selected before and was done internally

* fix(docs): divider issue in json-formatter docs

* fix(docs): divider issue in dynamic-forms docs

* fix(docs): divider issue in layouts overview

* fix(docs): divider issue in logo docs

* fix(docs): divider issue in stepper pattern docs

* fix(docs): divider issue in empty state pattern docs

* feat(divider): replace matInset with [inset]="true"

* chore(): upgrade to angular/cli 1.6.5 and TS 2.6.2
  • Loading branch information
emoralesb05 authored Jan 19, 2018
1 parent b4b1141 commit 517d669
Show file tree
Hide file tree
Showing 37 changed files with 487 additions and 437 deletions.
30 changes: 15 additions & 15 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -67,18 +67,18 @@
"ie 11"
],
"dependencies": {
"@angular/animations": "^5.1.0",
"@angular/cdk": "^5.0.0",
"@angular/common": "^5.1.0",
"@angular/compiler": "^5.1.0",
"@angular/core": "^5.1.0",
"@angular/forms": "^5.1.0",
"@angular/http": "^5.1.0",
"@angular/material": "^5.0.0",
"@angular/platform-browser": "^5.1.0",
"@angular/platform-browser-dynamic": "^5.1.0",
"@angular/platform-server": "^5.1.0",
"@angular/router": "^5.1.0",
"@angular/animations": "^5.2.0",
"@angular/cdk": "^5.1.0",
"@angular/common": "^5.2.0",
"@angular/compiler": "^5.2.0",
"@angular/core": "^5.2.0",
"@angular/forms": "^5.2.0",
"@angular/http": "^5.2.0",
"@angular/material": "^5.1.0",
"@angular/platform-browser": "^5.2.0",
"@angular/platform-browser-dynamic": "^5.2.0",
"@angular/platform-server": "^5.2.0",
"@angular/router": "^5.2.0",
"@covalent/code-editor": "^1.0.0-beta.1",
"@covalent/text-editor": "^1.0.0-alpha.4",
"@ngx-translate/core": "9.0.1",
Expand All @@ -96,8 +96,8 @@
"zone.js": "^0.8.17"
},
"devDependencies": {
"@angular/cli": "1.6.0",
"@angular/compiler-cli": "^5.1.0",
"@angular/cli": "1.6.5",
"@angular/compiler-cli": "^5.2.0",
"@types/fs-extra": "^4.0.0",
"@types/hammerjs": "^2.0.30",
"@types/jasmine": "2.5.38",
Expand Down Expand Up @@ -141,7 +141,7 @@
"stylelint": "^8.4.0",
"ts-node": "^3.0.4",
"tslint": "5.2.0",
"typescript": "~2.4.2",
"typescript": "~2.6.2",
"uglify-js": "^2.8.14",
"webpack-bundle-analyzer": "^2.9.1",
"webpack-stats-plugin": "^0.1.5"
Expand Down
8 changes: 4 additions & 4 deletions src/app/components/components/components.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ <h3 matSubheader>Core Components</h3>
<h3 matLine> {{item.title}} </h3>
<p matLine> {{item.description}} </p>
</a>
<mat-divider *ngIf="!last" matInset></mat-divider>
<mat-divider *ngIf="!last" [inset]="true"></mat-divider>
</ng-template>
<h3 matSubheader>Optional Components</h3>
<ng-template let-item let-last="last" ngFor [ngForOf]="optional">
Expand All @@ -33,7 +33,7 @@ <h3 matSubheader>Optional Components</h3>
<h3 matLine> {{item.title}} </h3>
<p matLine> {{item.description}} </p>
</a>
<mat-divider *ngIf="!last" matInset></mat-divider>
<mat-divider *ngIf="!last" [inset]="true"></mat-divider>
</ng-template>
<h3 matSubheader>External Components</h3>
<a mat-list-item
Expand All @@ -44,7 +44,7 @@ <h3 matLine> Angular Material </h3>
<p matLine> Material Design components </p>
<mat-icon matTooltip="External docs" class="text-md tc-grey-600">launch</mat-icon>
</a>
<mat-divider matInset></mat-divider>
<mat-divider [inset]="true"></mat-divider>
<ng-template let-item let-last="last" ngFor [ngForOf]="external">
<a mat-list-item
[routerLink]="[item.route]"
Expand All @@ -55,7 +55,7 @@ <h3 matLine> Angular Material </h3>
<h3 matLine> {{item.title}} </h3>
<p matLine> {{item.description}} </p>
</a>
<mat-divider *ngIf="!last" matInset></mat-divider>
<mat-divider *ngIf="!last" [inset]="true"></mat-divider>
</ng-template>
</mat-nav-list>
<div td-toolbar-content layout="row" layout-align="start center" flex>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -46,106 +46,109 @@
</mat-card-actions>
</mat-card>
</div>
<div class="pad" flex-gt-md="50">
<div class="pad" flex-gt-md="50" class="relative">
<mat-card-title class="push-top-sm push-bottom-sm">
<div layout="row" layout-align="start center" flex>
<div flex class="text-md">Select a type, add element then update</div>
</div>
</mat-card-title>
<mat-divider></mat-divider>
<form #addForm="ngForm">
<div layout="row" layout-align="start center" class="pad-sm">
<mat-form-field class="pad-right" floatPlaceholder="never">
<mat-select placeholder="Select element type" [(ngModel)]="type" name="type" required>
<mat-option *ngFor="let option of elementOptions" [value]="option">
{{ option }}
</mat-option>
</mat-select>
</mat-form-field>
<button matTooltip="Add this element" mat-mini-fab color="accent" [disabled]="!addForm.valid" (click)="addElement()">
<mat-icon>add</mat-icon>
</button>
</div>
</form>
<h4>Form elements</h4>
<ng-template let-model let-last="last" let-index="index" ngFor [ngForOf]="dynamicElements">
<td-expansion-panel [label]="model.name">
<mat-divider></mat-divider>
<div class="pad" layout="column">
<div layout="row">
<mat-form-field class="pad-right-xs" flex>
<input matInput
placeholder="Label"
[(ngModel)]="model.label"
name="label">
</mat-form-field>
<mat-form-field flex="30">
<input matInput
type="number"
min="0"
max="100"
placeholder="Flex (width in %)"
[(ngModel)]="model.flex"
name="flex">
</mat-form-field>
</div>
<div *ngIf="isMinMaxSupported(model.type)" layout="row">
<mat-form-field *ngIf="!isDate(model.type)" class="pad-right-xs" flex>
<input matInput type="number" placeholder="Min" [(ngModel)]="model.min" name="min">
</mat-form-field>
<mat-form-field *ngIf="isDate(model.type)" class="pad-right-xs" flex>
<input matInput
[matDatepicker]="minDatepicker"
placeholder="Min"
[(ngModel)]="model.min"
name="min">
<mat-datepicker-toggle matSuffix [for]="minDatepicker"></mat-datepicker-toggle>
<mat-datepicker #minDatepicker></mat-datepicker>
</mat-form-field>
<mat-form-field *ngIf="!isDate(model.type)" flex="50">
<input matInput type="number" placeholder="Max" [(ngModel)]="model.max" name="max">
</mat-form-field>
<mat-form-field *ngIf="isDate(model.type)" flex="50">
<input matInput
[matDatepicker]="maxDatepicker"
placeholder="Max"
[(ngModel)]="model.max"
name="max">
<mat-datepicker-toggle matSuffix [for]="maxDatepicker"></mat-datepicker-toggle>
<mat-datepicker #maxDatepicker></mat-datepicker>
</mat-form-field>
</div>
<div *ngIf="isMinMaxLengthSupported(model.type)" layout="row">
<mat-form-field class="pad-right-xs" flex>
<input matInput
type="text"
placeholder="MinLength"
[(ngModel)]="model.minLength"
name="min">
</mat-form-field>
<mat-form-field flex="50">
<input matInput
type="text"
placeholder="MaxLength"
[(ngModel)]="model.maxLength"
name="max">
</mat-form-field>
</div>
<div layout="row">
<mat-slide-toggle [(ngModel)]="model.required" name="required">Required</mat-slide-toggle>
<span flex></span>
<button mat-icon-button matTooltip="Delete element" (click)="deleteElement(index)">
<mat-icon>delete</mat-icon>
</button>
</div>
<mat-card-content>
<form #addForm="ngForm">
<div layout="row" layout-align="start center" class="pad-sm">
<mat-form-field class="pad-right" floatPlaceholder="never">
<mat-select placeholder="Select element type" [(ngModel)]="type" name="type" required>
<mat-option *ngFor="let option of elementOptions" [value]="option">
{{ option }}
</mat-option>
</mat-select>
</mat-form-field>
<button matTooltip="Add this element" mat-mini-fab color="accent" [disabled]="!addForm.valid" (click)="addElement()">
<mat-icon>add</mat-icon>
</button>
</div>
</td-expansion-panel>
</ng-template>
<div class="push-top" layout="row">
</form>
<h4>Form elements</h4>
<ng-template let-model let-last="last" let-index="index" ngFor [ngForOf]="dynamicElements">
<td-expansion-panel [label]="model.name">
<mat-divider></mat-divider>
<div class="pad" layout="column">
<div layout="row">
<mat-form-field class="pad-right-xs" flex>
<input matInput
placeholder="Label"
[(ngModel)]="model.label"
name="label">
</mat-form-field>
<mat-form-field flex="30">
<input matInput
type="number"
min="0"
max="100"
placeholder="Flex (width in %)"
[(ngModel)]="model.flex"
name="flex">
</mat-form-field>
</div>
<div *ngIf="isMinMaxSupported(model.type)" layout="row">
<mat-form-field *ngIf="!isDate(model.type)" class="pad-right-xs" flex>
<input matInput type="number" placeholder="Min" [(ngModel)]="model.min" name="min">
</mat-form-field>
<mat-form-field *ngIf="isDate(model.type)" class="pad-right-xs" flex>
<input matInput
[matDatepicker]="minDatepicker"
placeholder="Min"
[(ngModel)]="model.min"
name="min">
<mat-datepicker-toggle matSuffix [for]="minDatepicker"></mat-datepicker-toggle>
<mat-datepicker #minDatepicker></mat-datepicker>
</mat-form-field>
<mat-form-field *ngIf="!isDate(model.type)" flex="50">
<input matInput type="number" placeholder="Max" [(ngModel)]="model.max" name="max">
</mat-form-field>
<mat-form-field *ngIf="isDate(model.type)" flex="50">
<input matInput
[matDatepicker]="maxDatepicker"
placeholder="Max"
[(ngModel)]="model.max"
name="max">
<mat-datepicker-toggle matSuffix [for]="maxDatepicker"></mat-datepicker-toggle>
<mat-datepicker #maxDatepicker></mat-datepicker>
</mat-form-field>
</div>
<div *ngIf="isMinMaxLengthSupported(model.type)" layout="row">
<mat-form-field class="pad-right-xs" flex>
<input matInput
type="text"
placeholder="MinLength"
[(ngModel)]="model.minLength"
name="min">
</mat-form-field>
<mat-form-field flex="50">
<input matInput
type="text"
placeholder="MaxLength"
[(ngModel)]="model.maxLength"
name="max">
</mat-form-field>
</div>
<div layout="row">
<mat-slide-toggle [(ngModel)]="model.required" name="required">Required</mat-slide-toggle>
<span flex></span>
<button mat-icon-button matTooltip="Delete element" (click)="deleteElement(index)">
<mat-icon>delete</mat-icon>
</button>
</div>
</div>
</td-expansion-panel>
</ng-template>
</mat-card-content>
<mat-divider></mat-divider>
<mat-card-actions>
<button mat-raised-button color="primary" class="text-upper" (click)="dynamicForm.refresh()">
Update Form
</button>
</div>
</mat-card-actions>
</div>
</div>
</mat-card>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -257,13 +257,13 @@ <h3 matSubheader>Metadata</h3>
<h4 matLine>John Jameson</h4>
<p matLine>Owner</p>
</mat-list-item>
<mat-divider matInset></mat-divider>
<mat-divider [inset]="true"></mat-divider>
<mat-list-item>
<mat-icon matListAvatar>description</mat-icon>
<h4 matLine>An item description</h4>
<p matLine>Description</p>
</mat-list-item>
<mat-divider matInset></mat-divider>
<mat-divider [inset]="true"></mat-divider>
<mat-list-item>
<mat-icon matListAvatar>vpn_key</mat-icon>
<h4 matLine>1141e8e8-8d24-4956-93c2</h4>
Expand Down Expand Up @@ -305,13 +305,13 @@ <h3 matSubheader>Metadata</h3>
<h4 matLine>John Jameson</h4>
<p matLine>Owner</p>
</mat-list-item>
<mat-divider matInset></mat-divider>
<mat-divider [inset]="true"></mat-divider>
<mat-list-item>
<mat-icon matListAvatar>description</mat-icon>
<h4 matLine>An item description</h4>
<p matLine>Description</p>
</mat-list-item>
<mat-divider matInset></mat-divider>
<mat-divider [inset]="true"></mat-divider>
<mat-list-item>
<mat-icon matListAvatar>vpn_key</mat-icon>
<h4 matLine>1141e8e8-8d24-4956-93c2</h4>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,9 @@
<h3 class="mat-title">Object using JSON Formatting:</h3>
<p>(Use mouse or keyboard to expand/collapse nodes)</p>
<td-json-formatter [data]="data" [levelsOpen]="2"></td-json-formatter>
<mat-divider class="push-top"></mat-divider>
<div class="pad-top pad-bottom">
<mat-divider></mat-divider>
</div>
<h3 class="mat-title">Original JSON Object:</h3>
<td-highlight lang="json">
{{data | json}}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -204,7 +204,7 @@ <h3 matLine> Jyn Erso stole the plans to the Death Star </h3>
<td-notification-count color="accent" [notifications]="1">
</td-notification-count>
</a>
<mat-divider matInset></mat-divider>
<mat-divider [inset]="true"></mat-divider>
<a mat-list-item>
<mat-icon matListAvatar>person</mat-icon>
<h3 matLine> Something something something.. dark side. </h3>
Expand All @@ -213,7 +213,7 @@ <h3 matLine> Something something something.. dark side. </h3>
<td-notification-count color="primary" [notifications]="0">
</td-notification-count>
</a>
<mat-divider matInset></mat-divider>
<mat-divider [inset]="true"></mat-divider>
<a mat-list-item>
<mat-icon matListAvatar>person</mat-icon>
<h3 matLine> Chirrut Îmwe beat down a bunch of storm troopers with a stick </h3>
Expand All @@ -238,7 +238,7 @@ <h3 matLine> Jyn Erso stole the plans to the Death Star </h3>
<td-notification-count color="accent" [notifications]="1">
</td-notification-count>
</a>
<mat-divider matInset></mat-divider>
<mat-divider [inset]="true"></mat-divider>
<a mat-list-item>
<mat-icon matListAvatar>person</mat-icon>
<h3 matLine> Something something something.. dark side. </h3>
Expand All @@ -247,7 +247,7 @@ <h3 matLine> Something something something.. dark side. </h3>
<td-notification-count color="primary" [notifications]="0">
</td-notification-count>
</a>
<mat-divider matInset></mat-divider>
<mat-divider [inset]="true"></mat-divider>
<a mat-list-item>
<mat-icon matListAvatar>person</mat-icon>
<h3 matLine> Chirrut Îmwe beat down a bunch of storm troopers with a stick </h3>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@
<h4 matLine>{ {row.name} }</h4>
<p matLine>Row: { {row.index} }</p>
</mat-list-item>
<mat-divider *ngIf="!last" matInset></mat-divider>
<mat-divider *ngIf="!last" [inset]="true"></mat-divider>
</ng-template>
</td-virtual-scroll-container>
</mat-list>
Expand Down Expand Up @@ -72,7 +72,7 @@ <h4 matLine>{ {row.name} }</h4>
<h4 matLine>{{row.name}}</h4>
<p matLine>Row: {{row.index}}</p>
</mat-list-item>
<mat-divider *ngIf="!last" matInset></mat-divider>
<mat-divider *ngIf="!last" [inset]="true"></mat-divider>
</ng-template>
</td-virtual-scroll-container>
</mat-list>
Expand Down
Loading

0 comments on commit 517d669

Please sign in to comment.