Skip to content
This repository was archived by the owner on Jan 6, 2025. It is now read-only.

Commit 597a4b4

Browse files
ThomasBurlesonThomasBurleson
committed
chore(lint): enable whitespace checks
1 parent 3f5a7e4 commit 597a4b4

11 files changed

+406
-353
lines changed

‎src/lib/flexbox/api/base.ts

+7-8
Original file line numberDiff line numberDiff line change
@@ -116,15 +116,14 @@ export abstract class BaseFxDirective implements OnDestroy {
116116
* and intelligent lookup of the directive's property value that corresponds to that mediaQuery
117117
* (or closest match).
118118
*/
119-
protected _listenForMediaQueryChanges(
120-
key: string,
121-
defaultValue: any,
122-
onMediaQueryChange: MediaQuerySubscriber): ResponsiveActivation {
119+
protected _listenForMediaQueryChanges(key: string,
120+
defaultValue: any,
121+
onMediaQueryChange: MediaQuerySubscriber): ResponsiveActivation { // tslint:disable-line:max-line-length
123122
let keyOptions = new KeyOptions(key, defaultValue, this._inputMap);
124123
return this._mqActivation = new ResponsiveActivation(
125-
keyOptions,
126-
this._mediaMonitor,
127-
(change) => onMediaQueryChange.call(this, change)
124+
keyOptions,
125+
this._mediaMonitor,
126+
(change) => onMediaQueryChange.call(this, change)
128127
);
129128
}
130129

@@ -136,7 +135,7 @@ export abstract class BaseFxDirective implements OnDestroy {
136135
var array = [];
137136

138137
// iterate backwards ensuring that length is an UInt32
139-
for (var i = obj.length; i--;) {
138+
for ( var i = obj.length; i--; ) {
140139
array[i] = obj[i];
141140
}
142141
return array;

‎src/lib/flexbox/api/flex.spec.ts

+33-29
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import {Component, OnInit} from '@angular/core';
22
import {CommonModule} from '@angular/common';
3-
import {ComponentFixture, TestBed } from '@angular/core/testing';
3+
import {ComponentFixture, TestBed} from '@angular/core/testing';
44

55
import {MockMatchMedia} from '../../media-query/mock/mock-match-media';
66
import {MatchMedia} from '../../media-query/match-media';
@@ -16,8 +16,8 @@ import {
1616

1717
describe('flex directive', () => {
1818
let fixture: ComponentFixture<any>;
19-
let expectDOMFrom = makeExpectDOMFrom(()=> TestFlexComponent);
20-
let expectDomForQuery = makeExpectDOMForQuery(()=> TestFlexComponent);
19+
let expectDOMFrom = makeExpectDOMFrom(() => TestFlexComponent);
20+
let expectDomForQuery = makeExpectDOMForQuery(() => TestFlexComponent);
2121

2222
beforeEach(() => {
2323
jasmine.addMatchers(customMatchers);
@@ -33,7 +33,7 @@ describe('flex directive', () => {
3333
});
3434
});
3535
afterEach(() => {
36-
if ( fixture ) {
36+
if (fixture) {
3737
fixture.debugElement.injector.get(MatchMedia).clearAll();
3838
fixture = null;
3939
}
@@ -43,61 +43,61 @@ describe('flex directive', () => {
4343

4444
it('should add correct styles for default `fxFlex` usage', () => {
4545
expectDOMFrom(`<div fxFlex></div>`).toHaveCssStyle({
46-
'flex' : '1 1 1e-09px', // === flex : "1"
46+
'flex': '1 1 1e-09px', // === flex : "1"
4747
'box-sizing': 'border-box',
4848
});
4949
});
5050
it('should add correct styles for `fxFlex="0%"` usage', () => {
5151
expectDOMFrom(`<div fxFlex="2%"></div>`).toHaveCssStyle({
52-
'max-width' : '2%',
53-
'flex' : '1 1 100%',
52+
'max-width': '2%',
53+
'flex': '1 1 100%',
5454
'box-sizing': 'border-box',
5555
});
5656
});
5757

5858
it('should work with percentage values', () => {
5959
expectDOMFrom(`<div fxFlex="37%"></div>`).toHaveCssStyle({
60-
'flex' : '1 1 100%',
61-
'max-width' : '37%',
60+
'flex': '1 1 100%',
61+
'max-width': '37%',
6262
'box-sizing': 'border-box',
6363
});
6464
});
6565
it('should work with pixel values', () => {
6666
expectDOMFrom(`<div fxFlex="37px"></div>`).toHaveCssStyle({
67-
'flex' : '1 1 37px',
67+
'flex': '1 1 37px',
6868
'box-sizing': 'border-box',
6969
});
7070
});
7171
it('should work with calc values', () => {
7272
expectDOMFrom(`<div fxFlex="calc(30vw - 10px)"></div>`).toHaveCssStyle({
7373
'box-sizing': 'border-box',
74-
'flex' : '1 1 calc(30vw - 10px)'
74+
'flex': '1 1 calc(30vw - 10px)'
7575
});
7676
});
7777
it('should work with named values', () => {
7878
expectDOMFrom(`<div fxFlex="nogrow"></div>`).toHaveCssStyle({
79-
'flex' : '0 1 auto'
79+
'flex': '0 1 auto'
8080
});
8181
});
8282

8383
it('should work with full-spec values', () => {
8484
expectDOMFrom(`<div fxFlex="1 2 0.9em"></div>`).toHaveCssStyle({
85-
'flex' : '1 2 0.9em'
85+
'flex': '1 2 0.9em'
8686
});
8787
});
8888
it('should set a min-width when the shrink == 0', () => {
8989
expectDOMFrom(`<div fxFlex="1 0 37px"></div>`).toHaveCssStyle({
90-
'flex' : '1 0 37px',
91-
'max-width' : '37px',
92-
'min-width' : '37px',
90+
'flex': '1 0 37px',
91+
'max-width': '37px',
92+
'min-width': '37px',
9393
'box-sizing': 'border-box',
9494
});
9595
});
9696
it('should set a min-width when basis is a Px value', () => {
9797
expectDOMFrom(`<div fxFlex="312px"></div>`).toHaveCssStyle({
98-
'flex' : '1 1 312px',
99-
'max-width' : '312px',
100-
'min-width' : '312px'
98+
'flex': '1 1 312px',
99+
'max-width': '312px',
100+
'min-width': '312px'
101101
});
102102
});
103103

@@ -108,9 +108,9 @@ describe('flex directive', () => {
108108
<div fxLayout="column" fxFlex="37%">
109109
</div>
110110
`)
111-
.not.toHaveCssStyle({
111+
.not.toHaveCssStyle({
112112
'flex-direction': 'row',
113-
'max-height' : '37%',
113+
'max-height': '37%',
114114
});
115115
});
116116

@@ -121,21 +121,21 @@ describe('flex directive', () => {
121121
</div>
122122
`;
123123

124-
expectDomForQuery( template,"[fxFlex]" )
125-
.toHaveCssStyle({
126-
'max-height' : '37%',
127-
});
124+
expectDomForQuery(template, "[fxFlex]")
125+
.toHaveCssStyle({
126+
'max-height': '37%',
127+
});
128128
});
129129

130130
it('should set max-width for `fxFlex="<%val>"`', () => {
131131
expectDOMFrom(`<div fxFlex="37%"></div>`).toHaveCssStyle({
132-
'max-width' : '37%',
132+
'max-width': '37%',
133133
});
134134
});
135135

136136
it('should set max-width for `fxFlex="2%"` usage', () => {
137137
expectDOMFrom(`<div fxFlex="2%"></div>`).toHaveCssStyle({
138-
'max-width' : '2%',
138+
'max-width': '2%',
139139
});
140140
});
141141

@@ -156,8 +156,12 @@ describe('flex directive', () => {
156156
})
157157
export class TestFlexComponent implements OnInit {
158158
public direction = "column";
159-
constructor() { }
160-
ngOnInit() { }
159+
160+
constructor() {
161+
}
162+
163+
ngOnInit() {
164+
}
161165
}
162166

163167

‎src/lib/flexbox/api/flex.ts

+68-34
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,8 @@ export type FlexBasisAlias = 'grow' | 'initial' | 'auto' | 'none' | 'nogrow' | '
3131
*
3232
* @see https://css-tricks.com/snippets/css/a-guide-to-flexbox/
3333
*/
34-
@Directive({ selector: `
34+
@Directive({
35+
selector: `
3536
[fxFlex],
3637
[fxFlex.xs]
3738
[fxFlex.gt-xs],
@@ -43,7 +44,7 @@ export type FlexBasisAlias = 'grow' | 'initial' | 'auto' | 'none' | 'nogrow' | '
4344
[fxFlex.gt-lg],
4445
[fxFlex.xl]
4546
`
46-
})
47+
})
4748
export class FlexDirective extends BaseFxDirective implements OnInit, OnChanges, OnDestroy {
4849

4950
/** The flex-direction of this element's flex container. Defaults to 'row'. */
@@ -55,29 +56,62 @@ export class FlexDirective extends BaseFxDirective implements OnInit, OnChanges,
5556
*/
5657
private _layoutWatcher: Subscription;
5758

58-
@Input('fxFlex') set flex(val) { this._cacheInput("flex", val); }
59-
@Input('fxShrink') set shrink(val) { this._cacheInput("shrink", val); }
60-
@Input('fxGrow') set grow(val) { this._cacheInput("grow", val); }
59+
@Input('fxFlex') set flex(val) {
60+
this._cacheInput("flex", val);
61+
}
62+
63+
@Input('fxShrink') set shrink(val) {
64+
this._cacheInput("shrink", val);
65+
}
66+
67+
@Input('fxGrow') set grow(val) {
68+
this._cacheInput("grow", val);
69+
}
70+
71+
@Input('fxFlex.xs') set flexXs(val) {
72+
this._cacheInput('flexXs', val);
73+
}
74+
75+
@Input('fxFlex.gt-xs') set flexGtXs(val) {
76+
this._cacheInput('flexGtXs', val);
77+
};
78+
79+
@Input('fxFlex.sm') set flexSm(val) {
80+
this._cacheInput('flexSm', val);
81+
};
82+
83+
@Input('fxFlex.gt-sm') set flexGtSm(val) {
84+
this._cacheInput('flexGtSm', val);
85+
};
86+
87+
@Input('fxFlex.md') set flexMd(val) {
88+
this._cacheInput('flexMd', val);
89+
};
90+
91+
@Input('fxFlex.gt-md') set flexGtMd(val) {
92+
this._cacheInput('flexGtMd', val);
93+
};
94+
95+
@Input('fxFlex.lg') set flexLg(val) {
96+
this._cacheInput('flexLg', val);
97+
};
98+
99+
@Input('fxFlex.gt-lg') set flexGtLg(val) {
100+
this._cacheInput('flexGtLg', val);
101+
};
61102

62-
@Input('fxFlex.xs') set flexXs(val) { this._cacheInput('flexXs', val); }
63-
@Input('fxFlex.gt-xs') set flexGtXs(val) { this._cacheInput('flexGtXs', val); };
64-
@Input('fxFlex.sm') set flexSm(val) { this._cacheInput('flexSm', val); };
65-
@Input('fxFlex.gt-sm') set flexGtSm(val) { this._cacheInput('flexGtSm', val); };
66-
@Input('fxFlex.md') set flexMd(val) { this._cacheInput('flexMd', val); };
67-
@Input('fxFlex.gt-md') set flexGtMd(val) { this._cacheInput('flexGtMd', val); };
68-
@Input('fxFlex.lg') set flexLg(val) { this._cacheInput('flexLg', val); };
69-
@Input('fxFlex.gt-lg') set flexGtLg(val) { this._cacheInput('flexGtLg', val); };
70-
@Input('fxFlex.xl') set flexXl(val) { this._cacheInput('flexXl', val); };
103+
@Input('fxFlex.xl') set flexXl(val) {
104+
this._cacheInput('flexXl', val);
105+
};
71106

72107

73108
// Explicitly @SkipSelf on LayoutDirective and LayoutWrapDirective because we want the
74109
// parent flex container for this flex item.
75-
constructor(
76-
monitor: MediaMonitor,
77-
elRef: ElementRef,
78-
renderer: Renderer,
79-
@Optional() @SkipSelf() private _container: LayoutDirective,
80-
@Optional() @SkipSelf() private _wrap: LayoutWrapDirective) {
110+
constructor(monitor: MediaMonitor,
111+
elRef: ElementRef,
112+
renderer: Renderer,
113+
@Optional() @SkipSelf() private _container: LayoutDirective,
114+
@Optional() @SkipSelf() private _wrap: LayoutWrapDirective) {
81115

82116
super(monitor, elRef, renderer);
83117

@@ -139,34 +173,34 @@ export class FlexDirective extends BaseFxDirective implements OnInit, OnChanges,
139173
}
140174

141175
this._applyStyleToElement(this._validateValue.apply(this,
142-
this._parseFlexParts(String(flexBasis)) ));
176+
this._parseFlexParts(String(flexBasis))));
143177
}
144178

145179
/**
146180
* If the used the short-form `fxFlex="1 0 37%"`, then parse the parts
147181
*/
148-
private _parseFlexParts(basis:string) {
149-
basis = basis.replace(";","");
182+
private _parseFlexParts(basis: string) {
183+
basis = basis.replace(";", "");
150184

151185
let hasCalc = basis && basis.indexOf("calc") > -1;
152186
let matches = !hasCalc ? basis.split(" ") : this._getPartsWithCalc(basis.trim());
153-
return (matches.length === 3) ? matches : [ this._queryInput("grow"),
154-
this._queryInput("shrink"), basis ];
187+
return (matches.length === 3) ? matches : [this._queryInput("grow"),
188+
this._queryInput("shrink"), basis];
155189
}
156190

157191
/**
158192
* Extract more complicated short-hand versions.
159193
* e.g.
160194
* fxFlex="3 3 calc(15em + 20px)"
161195
*/
162-
private _getPartsWithCalc(value:string) {
163-
let parts = [this._queryInput("grow"), this._queryInput("shrink"), value];
196+
private _getPartsWithCalc(value: string) {
197+
let parts = [this._queryInput("grow"), this._queryInput("shrink"), value];
164198
let j = value.indexOf('calc');
165199

166-
if ( j > 0 ) {
200+
if (j > 0) {
167201
parts[2] = value.substring(j);
168202
let matches = value.substr(0, j).trim().split(" ");
169-
if ( matches.length == 2 ) {
203+
if (matches.length == 2) {
170204
parts[0] = matches[0];
171205
parts[1] = matches[1];
172206
}
@@ -236,10 +270,10 @@ export class FlexDirective extends BaseFxDirective implements OnInit, OnChanges,
236270
let isPercent = String(basis).indexOf('%') > -1;
237271

238272
isValue = String(basis).indexOf('px') > -1 ||
239-
String(basis).indexOf('calc') > -1 ||
240-
String(basis).indexOf('em') > -1 ||
241-
String(basis).indexOf('vw') > -1 ||
242-
String(basis).indexOf('vh') > -1;
273+
String(basis).indexOf('calc') > -1 ||
274+
String(basis).indexOf('em') > -1 ||
275+
String(basis).indexOf('vw') > -1 ||
276+
String(basis).indexOf('vh') > -1;
243277

244278
// Defaults to percentage sizing unless `px` is explicitly set
245279
if (!isValue && !isPercent && !isNaN(basis as any)) {
@@ -266,7 +300,7 @@ export class FlexDirective extends BaseFxDirective implements OnInit, OnChanges,
266300
let usingCalc = String(basis).indexOf('calc') > -1;
267301
let isPx = String(basis).indexOf('px') > -1 || usingCalc;
268302

269-
css[min] = (basis == '0%') ? 0 : isPx ? basis : null;
303+
css[min] = (basis == '0%') ? 0 : isPx ? basis : null;
270304
css[max] = (basis == '0%') ? 0 : usingCalc ? null : basis;
271305

272306
return extendObject(css, {'box-sizing': 'border-box'});

0 commit comments

Comments
 (0)