Skip to content

Commit 5b72ec7

Browse files
devversionjosephperrott
authored andcommitted
refactor(schematics): no longer duplicate files for inline flags (#12273)
1 parent f35a314 commit 5b72ec7

File tree

11 files changed

+97
-294
lines changed

11 files changed

+97
-294
lines changed

src/lib/schematics/address-form/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts

Lines changed: 8 additions & 132 deletions
Original file line numberDiff line numberDiff line change
@@ -2,142 +2,18 @@ import { Component, ViewChild<% if(!!viewEncapsulation) { %>, ViewEncapsulation<
22
import { FormBuilder, Validators } from '@angular/forms';
33

44
@Component({
5-
selector: '<%= selector %>',<% if(inlineTemplate) { %>
5+
selector: '<%= selector %>',
6+
<% if(inlineTemplate) { %>
67
template: `
7-
<form [formGroup]="addressForm" novalidate>
8-
<mat-card class="shipping-card">
9-
<mat-card-header>
10-
<mat-card-title>Shipping Information</mat-card-title>
11-
</mat-card-header>
12-
<mat-card-content>
13-
<div class="row">
14-
<div class="col">
15-
<mat-form-field class="full-width">
16-
<input matInput placeholder="Company" formControlName="company">
17-
</mat-form-field>
18-
</div>
19-
</div>
20-
<div class="row">
21-
<div class="col">
22-
<mat-form-field class="full-width">
23-
<input matInput placeholder="First name" formControlName="firstName">
24-
<mat-error *ngIf="addressForm.controls['firstName'].hasError('required')">
25-
First name is <strong>required</strong>
26-
</mat-error>
27-
</mat-form-field>
28-
</div>
29-
<div class="col">
30-
<mat-form-field class="full-width">
31-
<input matInput placeholder="Last name" formControlName="lastName">
32-
<mat-error *ngIf="addressForm.controls['lastName'].hasError('required')">
33-
Last name is <strong>required</strong>
34-
</mat-error>
35-
</mat-form-field>
36-
</div>
37-
</div>
38-
<div class="row">
39-
<div class="col">
40-
<mat-form-field class="full-width">
41-
<textarea matInput placeholder="Address" formControlName="address"></textarea>
42-
<mat-error *ngIf="addressForm.controls['address'].hasError('required')">
43-
Address is <strong>required</strong>
44-
</mat-error>
45-
</mat-form-field>
46-
</div>
47-
</div>
48-
<div class="row" *ngIf="!hasUnitNumber">
49-
<div class="col">
50-
<button mat-button type="button" (click)="hasUnitNumber = !hasUnitNumber">
51-
+ Add C/O, Apt, Suite, Unit
52-
</button>
53-
</div>
54-
</div>
55-
<div class="row" *ngIf="hasUnitNumber">
56-
<div class="col">
57-
<mat-form-field class="full-width">
58-
<textarea matInput placeholder="Address 2" formControlName="address2"></textarea>
59-
</mat-form-field>
60-
</div>
61-
</div>
62-
<div class="row">
63-
<div class="col">
64-
<mat-form-field class="full-width">
65-
<input matInput placeholder="City" formControlName="city">
66-
<mat-error *ngIf="addressForm.controls['city'].hasError('required')">
67-
City is <strong>required</strong>
68-
</mat-error>
69-
</mat-form-field>
70-
</div>
71-
<div class="col">
72-
<mat-form-field class="full-width">
73-
<mat-select placeholder="State" formControlName="state">
74-
<mat-option *ngFor="let state of states" [value]="state.abbreviation">
75-
{{ state.name }}
76-
</mat-option>
77-
</mat-select>
78-
<mat-error *ngIf="addressForm.controls['state'].hasError('required')">
79-
State is <strong>required</strong>
80-
</mat-error>
81-
</mat-form-field>
82-
</div>
83-
</div>
84-
<div class="row">
85-
<div class="col">
86-
<mat-form-field class="full-width">
87-
<input matInput #postalCode maxlength="5" placeholder="Postal Code" type="number" formControlName="postalCode">
88-
<mat-hint align="end">{{postalCode.value.length}} / 5</mat-hint>
89-
</mat-form-field>
90-
</div>
91-
</div>
92-
<div class="row">
93-
<div class="col">
94-
<mat-radio-group formControlName="shipping">
95-
<mat-radio-button value="free">Free Shipping</mat-radio-button>
96-
<mat-radio-button value="priority">Priority Shipping</mat-radio-button>
97-
<mat-radio-button value="nextday">Next Day Shipping</mat-radio-button>
98-
</mat-radio-group>
99-
</div>
100-
</div>
101-
</mat-card-content>
102-
<mat-card-actions>
103-
<button mat-raised-button color="primary" type="submit">Submit</button>
104-
</mat-card-actions>
105-
</mat-card>
106-
</form>
8+
<%= resolvedFiles.template %>
1079
`,<% } else { %>
10810
templateUrl: './<%= dasherize(name) %>.component.html',<% } if(inlineStyle) { %>
109-
styles: [
110-
`
111-
.full-width {
112-
width: 100%;
113-
}
114-
115-
.shipping-card {
116-
min-width: 120px;
117-
margin: 20px auto;
118-
}
119-
120-
.mat-radio-button {
121-
display: block;
122-
margin: 5px 0;
123-
}
124-
125-
.row {
126-
display: flex;
127-
flex-direction: row;
128-
}
129-
130-
.col {
131-
flex: 1;
132-
margin-right: 20px;
133-
}
134-
135-
.col:last-child {
136-
margin-right: 0;
137-
}
11+
styles: [
13812
`
139-
]<% } else { %>
140-
styleUrls: ['./<%= dasherize(name) %>.component.<%= styleext %>']<% } %><% if(!!viewEncapsulation) { %>,
13+
<%= resolvedFiles.stylesheet %>
14+
`
15+
],<% } else { %>
16+
styleUrls: ['./<%= dasherize(name) %>.component.<%= styleext %>'],<% } %><% if(!!viewEncapsulation) { %>
14117
encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>,
14218
changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %>
14319
})

src/lib/schematics/address-form/index.ts

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,12 @@ import {buildComponent} from '../utils/devkit-utils/component';
1717
*/
1818
export default function(options: Schema): Rule {
1919
return chain([
20-
buildComponent({...options}),
20+
buildComponent({...options}, {
21+
template: options.inlineTemplate &&
22+
'./__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html',
23+
stylesheet: options.inlineStyle &&
24+
'./__path__/__name@dasherize@if-flat__/__name@dasherize__.component.__styleext__',
25+
}),
2126
options.skipImport ? noop() : addFormModulesToModule(options)
2227
]);
2328
}

src/lib/schematics/dashboard/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts

Lines changed: 6 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -1,62 +1,19 @@
11
import { Component<% if(!!viewEncapsulation) { %>, ViewEncapsulation<% }%><% if(changeDetection !== 'Default') { %>, ChangeDetectionStrategy<% }%> } from '@angular/core';
22
import { map } from 'rxjs/operators';
3-
import { Breakpoints, BreakpointState, BreakpointObserver } from '@angular/cdk/layout';
3+
import { Breakpoints, BreakpointObserver } from '@angular/cdk/layout';
44

55
@Component({
66
selector: '<%= selector %>',<% if(inlineTemplate) { %>
77
template: `
8-
<div class="grid-container">
9-
<h1 class="mat-h1">Dashboard</h1>
10-
<mat-grid-list cols="2" rowHeight="350px">
11-
<mat-grid-tile *ngFor="let card of cards | async" [colspan]="card.cols" [rowspan]="card.rows">
12-
<mat-card class="dashboard-card">
13-
<mat-card-header>
14-
<mat-card-title>
15-
{{card.title}}
16-
<button mat-icon-button class="more-button" [matMenuTriggerFor]="menu" aria-label="Toggle menu">
17-
<mat-icon>more_vert</mat-icon>
18-
</button>
19-
<mat-menu #menu="matMenu" xPosition="before">
20-
<button mat-menu-item>Expand</button>
21-
<button mat-menu-item>Remove</button>
22-
</mat-menu>
23-
</mat-card-title>
24-
</mat-card-header>
25-
<mat-card-content class="dashboard-card-content">
26-
<div>Card Content Here</div>
27-
</mat-card-content>
28-
</mat-card>
29-
</mat-grid-tile>
30-
</mat-grid-list>
31-
</div>
8+
<%= resolvedFiles.template %>
329
`,<% } else { %>
3310
templateUrl: './<%= dasherize(name) %>.component.html',<% } if(inlineStyle) { %>
3411
styles: [
3512
`
36-
.grid-container {
37-
margin: 20px;
38-
}
39-
40-
.dashboard-card {
41-
position: absolute;
42-
top: 15px;
43-
left: 15px;
44-
right: 15px;
45-
bottom: 15px;
46-
}
47-
48-
.more-button {
49-
position: absolute;
50-
top: 5px;
51-
right: 10px;
52-
}
53-
54-
.dashboard-card-content {
55-
text-align: center;
56-
}
57-
`
58-
]<% } else { %>
59-
styleUrls: ['./<%= dasherize(name) %>.component.<%= styleext %>']<% } %><% if(!!viewEncapsulation) { %>,
13+
<%= resolvedFiles.stylesheet %>
14+
`
15+
],<% } else { %>
16+
styleUrls: ['./<%= dasherize(name) %>.component.<%= styleext %>'],<% } %><% if(!!viewEncapsulation) { %>
6017
encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>,
6118
changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %>
6219
})

src/lib/schematics/dashboard/index.ts

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,12 @@ import {buildComponent} from '../utils/devkit-utils/component';
1717
*/
1818
export default function(options: Schema): Rule {
1919
return chain([
20-
buildComponent({ ...options }),
20+
buildComponent({...options}, {
21+
template: options.inlineTemplate &&
22+
'./__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html',
23+
stylesheet: options.inlineStyle &&
24+
'./__path__/__name@dasherize@if-flat__/__name@dasherize__.component.__styleext__',
25+
}),
2126
options.skipImport ? noop() : addNavModulesToModule(options)
2227
]);
2328
}

src/lib/schematics/nav/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts

Lines changed: 5 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -6,55 +6,15 @@ import { map } from 'rxjs/operators';
66
@Component({
77
selector: '<%= selector %>',<% if(inlineTemplate) { %>
88
template: `
9-
<mat-sidenav-container class="sidenav-container">
10-
<mat-sidenav
11-
#drawer
12-
class="sidenav"
13-
fixedInViewport="true"
14-
[attr.role]="(isHandset$ | async) ? 'dialog' : 'navigation'"
15-
[mode]="(isHandset$ | async) ? 'over' : 'side'"
16-
[opened]="!(isHandset$ | async)">
17-
<mat-toolbar color="primary">Menu</mat-toolbar>
18-
<mat-nav-list>
19-
<a mat-list-item href="#">Link 1</a>
20-
<a mat-list-item href="#">Link 2</a>
21-
<a mat-list-item href="#">Link 3</a>
22-
</mat-nav-list>
23-
</mat-sidenav>
24-
<mat-sidenav-content>
25-
<mat-toolbar color="primary">
26-
<button
27-
type="button"
28-
aria-label="Toggle sidenav"
29-
mat-icon-button
30-
(click)="drawer.toggle()"
31-
*ngIf="isHandset$ | async">
32-
<mat-icon aria-label="Side nav toggle icon">menu</mat-icon>
33-
</button>
34-
<span><%= project %></span>
35-
</mat-toolbar>
36-
<!-- Add Content Here -->
37-
</mat-sidenav-content>
38-
</mat-sidenav-container>
9+
<%= resolvedFiles.template %>
3910
`,<% } else { %>
4011
templateUrl: './<%= dasherize(name) %>.component.html',<% } if(inlineStyle) { %>
4112
styles: [
4213
`
43-
.sidenav-container {
44-
height: 100%;
45-
}
46-
47-
.sidenav {
48-
width: 200px;
49-
}
50-
51-
.mat-toolbar.mat-primary {
52-
position: sticky;
53-
top: 0;
54-
}
55-
`
56-
]<% } else { %>
57-
styleUrls: ['./<%= dasherize(name) %>.component.<%= styleext %>']<% } %><% if(!!viewEncapsulation) { %>,
14+
<%= resolvedFiles.stylesheet %>
15+
`
16+
],<% } else { %>
17+
styleUrls: ['./<%= dasherize(name) %>.component.<%= styleext %>'],<% } %><% if(!!viewEncapsulation) { %>
5818
encapsulation: ViewEncapsulation.<%= viewEncapsulation %><% } if (changeDetection !== 'Default') { %>,
5919
changeDetection: ChangeDetectionStrategy.<%= changeDetection %><% } %>
6020
})

src/lib/schematics/nav/index.ts

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,12 @@ import {buildComponent} from '../utils/devkit-utils/component';
1717
*/
1818
export default function(options: Schema): Rule {
1919
return chain([
20-
buildComponent({ ...options }),
20+
buildComponent({...options}, {
21+
template: options.inlineTemplate &&
22+
'./__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html',
23+
stylesheet: options.inlineStyle &&
24+
'./__path__/__name@dasherize@if-flat__/__name@dasherize__.component.__styleext__',
25+
}),
2126
options.skipImport ? noop() : addNavModulesToModule(options)
2227
]);
2328
}

src/lib/schematics/table/files/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts

Lines changed: 1 addition & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -5,32 +5,7 @@ import { <%= classify(name) %>DataSource } from './<%= dasherize(name) %>-dataso
55
@Component({
66
selector: '<%= selector %>',<% if(inlineTemplate) { %>
77
template: `
8-
<div class="mat-elevation-z8">
9-
<table mat-table #table [dataSource]="dataSource" matSort aria-label="Elements">
10-
11-
<!-- Id Column -->
12-
<ng-container matColumnDef="id">
13-
<th mat-header-cell *matHeaderCellDef mat-sort-header>Id</th>
14-
<td mat-cell *matCellDef="let row">{{row.id}}</td>
15-
</ng-container>
16-
17-
<!-- Name Column -->
18-
<ng-container matColumnDef="name">
19-
<th mat-header-cell *matHeaderCellDef mat-sort-header>Name</th>
20-
<td mat-cell *matCellDef="let row">{{row.name}}</td>
21-
</ng-container>
22-
23-
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
24-
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
25-
</table>
26-
27-
<mat-paginator #paginator
28-
[length]="dataSource.data.length"
29-
[pageIndex]="0"
30-
[pageSize]="10"
31-
[pageSizeOptions]="[25, 50, 100, 250]">
32-
</mat-paginator>
33-
</div>
8+
<%= resolvedFiles.template %>
349
`,<% } else { %>
3510
templateUrl: './<%= dasherize(name) %>.component.html',<% } if(inlineStyle) { %>
3611
styles: []<% } else { %>

src/lib/schematics/table/index.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,10 @@ import {buildComponent} from '../utils/devkit-utils/component';
1717
*/
1818
export default function(options: Schema): Rule {
1919
return chain([
20-
buildComponent({...options}),
20+
buildComponent({...options}, {
21+
template: options.inlineTemplate &&
22+
'./__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html'
23+
}),
2124
options.skipImport ? noop() : addTableModulesToModule(options)
2225
]);
2326
}

0 commit comments

Comments
 (0)