Skip to content

Commit

Permalink
refactor(all): additional tslint rules
Browse files Browse the repository at this point in the history
  • Loading branch information
manucorporat committed Sep 1, 2018
1 parent ba22305 commit e741643
Show file tree
Hide file tree
Showing 42 changed files with 419 additions and 380 deletions.
1 change: 1 addition & 0 deletions core/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,7 @@
"stylelint-order": "^0.8.1",
"tslint": "^5.10.0",
"tslint-ionic-rules": "0.0.17",
"tslint-react": "^3.6.0",
"typescript": "^2.9.2",
"yargs": "^12.0.1"
},
Expand Down
462 changes: 231 additions & 231 deletions core/src/components.d.ts

Large diffs are not rendered by default.

25 changes: 14 additions & 11 deletions core/src/components/alert/alert.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -329,8 +329,8 @@ export class Alert implements OverlayInterface {
disabled={i.disabled}
tabIndex={0}
role="checkbox"
class="alert-tappable alert-checkbox alert-checkbox-button">

class="alert-tappable alert-checkbox alert-checkbox-button"
>
<div class="alert-button-inner">
<div class="alert-checkbox-icon">
<div class="alert-checkbox-inner"></div>
Expand All @@ -339,7 +339,7 @@ export class Alert implements OverlayInterface {
{i.label}
</div>
</div>
{ this.mode === 'md' && <ion-ripple-effect /> }
{this.mode === 'md' && <ion-ripple-effect />}
</button>
))}
</div>
Expand All @@ -359,16 +359,18 @@ export class Alert implements OverlayInterface {
onClick={() => this.rbClick(i)}
aria-checked={i.checked ? 'true' : null}
disabled={i.disabled}
id={i.id} tabIndex={0}
id={i.id}
tabIndex={0}
class="alert-radio-button alert-tappable alert-radio"
role="radio">
role="radio"
>
<div class="alert-button-inner">
<div class="alert-radio-icon"><div class="alert-radio-inner"></div></div>
<div class="alert-radio-label">
{i.label}
</div>
</div>
{ this.mode === 'md' && <ion-ripple-effect /> }
{this.mode === 'md' && <ion-ripple-effect />}
</button>
))}
</div>
Expand All @@ -394,7 +396,8 @@ export class Alert implements OverlayInterface {
id={i.id}
disabled={i.disabled}
tabIndex={0}
class="alert-input"/>
class="alert-input"
/>
</div>
))}
</div>
Expand Down Expand Up @@ -451,14 +454,14 @@ export class Alert implements OverlayInterface {
<div class="alert-wrapper">

<div class="alert-head">
{ this.header && <h2 id={hdrId} class="alert-title">{this.header}</h2> }
{ this.subHeader && <h2 id={subHdrId} class="alert-sub-title">{this.subHeader}</h2> }
{this.header && <h2 id={hdrId} class="alert-title">{this.header}</h2>}
{this.subHeader && <h2 id={subHdrId} class="alert-sub-title">{this.subHeader}</h2>}
</div>

<div id={msgId} class="alert-message" innerHTML={this.message}></div>

{ this.renderAlertInputs(labelledById) }
{ this.renderAlertButtons() }
{this.renderAlertInputs(labelledById)}
{this.renderAlertButtons()}

</div>
];
Expand Down
5 changes: 3 additions & 2 deletions core/src/components/anchor/anchor.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -41,8 +41,9 @@ export class Anchor {
return (
<a
href={this.href}
onClick={ev => openURL(this.win, this.href, ev, this.routerDirection)}>
<slot></slot>
onClick={ev => openURL(this.win, this.href, ev, this.routerDirection)}
>
<slot></slot>
</a>
);
}
Expand Down
19 changes: 6 additions & 13 deletions core/src/components/animation-controller/animator.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,9 @@ export const TRANSFORM_PROPS: {[key: string]: number} = {
'perspective': 1
};

const raf = window.requestAnimationFrame || ((f: FrameRequestCallback) => f(Date.now()));
const raf = window.requestAnimationFrame
? window.requestAnimationFrame.bind(window)
: (f: FrameRequestCallback) => f(Date.now());

export class Animator {

Expand Down Expand Up @@ -627,10 +629,7 @@ export class Animator {
/**
* Immediately stop at the end of the animation.
*/
stop(stepValue?: number) {
if (stepValue === undefined) {
stepValue = 1;
}
stop(stepValue = 1) {
// ensure all past transition end events have been cleared
this._clearAsync();
this._hasDur = true;
Expand Down Expand Up @@ -1045,17 +1044,14 @@ export class Animator {
/**
* End the progress animation.
*/
progressEnd(shouldComplete: boolean, currentStepValue: number, dur?: number) {
progressEnd(shouldComplete: boolean, currentStepValue: number, dur = -1) {
if (this._isReverse) {
// if the animation is going in reverse then
// flip the step value: 0 becomes 1, 1 becomes 0
currentStepValue = 1 - currentStepValue;
}
const stepValue = shouldComplete ? 1 : 0;
const diff = Math.abs(currentStepValue - stepValue);
if (dur === undefined) {
dur = -1;
}
if (dur < 0) {
dur = this._duration || 0;
} else if (diff < 0.05) {
Expand Down Expand Up @@ -1178,10 +1174,7 @@ export class Animator {
/**
* Reverse the animation.
*/
reverse(shouldReverse?: boolean): Animator {
if (shouldReverse === undefined) {
shouldReverse = true;
}
reverse(shouldReverse = true): Animator {
const children = this._childAnimations;
if (children) {
for (const child of children) {
Expand Down
9 changes: 5 additions & 4 deletions core/src/components/back-button/back-button.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -77,11 +77,12 @@ export class BackButton {
<button
type="button"
class="back-button-native"
onClick={ev => this.onClick(ev)}>
onClick={ev => this.onClick(ev)}
>
<span class="back-button-inner">
{ backButtonIcon && <ion-icon icon={backButtonIcon} lazy={false}/> }
{ this.mode === 'ios' && backButtonText && <span class="button-text">{backButtonText}</span> }
{ this.mode === 'md' && <ion-ripple-effect /> }
{backButtonIcon && <ion-icon icon={backButtonIcon} lazy={false}/>}
{this.mode === 'ios' && backButtonText && <span class="button-text">{backButtonText}</span>}
{this.mode === 'md' && <ion-ripple-effect />}
</span>
</button>
);
Expand Down
4 changes: 2 additions & 2 deletions core/src/components/back-button/test/basic/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ <h1>Page Two</h1>
// okay cool, we're in the DOM now
await nav.push(secondPage);

const nextButton = secondPage.querySelector('ion-button .next');
const nextButton = secondPage.querySelector('ion-button.next');
nextButton.addEventListener('click', async () => {
await goToPageThree(nav);
});
Expand Down Expand Up @@ -96,7 +96,7 @@ <h1>Page Three</h1>
// okay cool, we're in the DOM now
await nav.push(thirdPage);

const nextButton = thirdPage.querySelector('ion-button .next');
const nextButton = thirdPage.querySelector('ion-button.next');
nextButton.addEventListener('click', async () => {
await goToPageFour(nav);
});
Expand Down
4 changes: 2 additions & 2 deletions core/src/components/back-button/test/preview/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,7 @@ <h1>Page Two</h1>
// okay cool, we're in the DOM now
await nav.push(secondPage);

const nextButton = secondPage.querySelector('ion-button .next');
const nextButton = secondPage.querySelector('ion-button.next');
nextButton.addEventListener('click', async () => {
await goToPageThree(nav);
});
Expand Down Expand Up @@ -96,7 +96,7 @@ <h1>Page Three</h1>
// okay cool, we're in the DOM now
await nav.push(thirdPage);

const nextButton = thirdPage.querySelector('ion-button .next');
const nextButton = thirdPage.querySelector('ion-button.next');
nextButton.addEventListener('click', async () => {
await goToPageFour(nav);
});
Expand Down
18 changes: 9 additions & 9 deletions core/src/components/button/button.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -177,14 +177,15 @@ export class Button {
onFocus={this.onFocus.bind(this)}
onKeyUp={this.onKeyUp.bind(this)}
onBlur={this.onBlur.bind(this)}
onClick={this.onClick.bind(this)}>
<span class="button-inner">
<slot name="icon-only"></slot>
<slot name="start"></slot>
<slot></slot>
<slot name="end"></slot>
</span>
{ this.mode === 'md' && <ion-ripple-effect /> }
onClick={this.onClick.bind(this)}
>
<span class="button-inner">
<slot name="icon-only"></slot>
<slot name="start"></slot>
<slot></slot>
<slot name="end"></slot>
</span>
{this.mode === 'md' && <ion-ripple-effect />}
</TagType>
);
}
Expand Down Expand Up @@ -212,7 +213,6 @@ function getButtonTypeClassMap(buttonType: string, type: string | undefined, mod
if (type === undefined) {
return {};
}
type = type.toLocaleLowerCase();
return {
[`${buttonType}-${type}`]: true,
[`${buttonType}-${type}-${mode}`]: true
Expand Down
3 changes: 2 additions & 1 deletion core/src/components/checkbox/checkbox.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,8 @@ export class Checkbox {
checked={this.checked}
name={this.name}
value={this.value}
disabled={this.disabled} />
disabled={this.disabled}
/>
];
}
}
Expand Down
11 changes: 6 additions & 5 deletions core/src/components/chip-button/chip-button.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -58,11 +58,12 @@ export class ChipButton {
type="button"
class="chip-button-native"
disabled={this.disabled}
href={this.href}>
<span class="chip-button-inner">
<slot></slot>
</span>
{ this.mode === 'md' && <ion-ripple-effect /> }
href={this.href}
>
<span class="chip-button-inner">
<slot></slot>
</span>
{this.mode === 'md' && <ion-ripple-effect />}
</TagType>
);
}
Expand Down
3 changes: 2 additions & 1 deletion core/src/components/content/content.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -295,7 +295,8 @@ export class Content {
'overscroll': (scrollX || scrollY) && !!forceOverscroll
}}
ref={el => this.scrollEl = el!}
onScroll={ev => this.onScroll(ev)}>
onScroll={ev => this.onScroll(ev)}
>
<slot></slot>
</div>,
<slot name="fixed"></slot>
Expand Down
7 changes: 4 additions & 3 deletions core/src/components/datetime/datetime.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -528,16 +528,17 @@ export class Datetime {
};

return [
<div class={datetimeTextClasses}>{ datetimeText }</div>,
<div class={datetimeTextClasses}>{datetimeText}</div>,
<button
type="button"
aria-haspopup="true"
// id={this.datetimeId}
aria-labelledby={this.labelId}
aria-disabled={this.disabled ? 'true' : null}
onClick={this.open.bind(this)}
class="datetime-cover">
{ this.mode === 'md' && <ion-ripple-effect /> }
class="datetime-cover"
>
{this.mode === 'md' && <ion-ripple-effect />}
</button>
];
}
Expand Down
2 changes: 1 addition & 1 deletion core/src/components/datetime/readme.md
Original file line number Diff line number Diff line change
Expand Up @@ -216,7 +216,7 @@ dates in JavaScript.
| `hourValues` | -- | Values used to create the list of selectable hours. By default the hour values range from `0` to `23` for 24-hour, or `1` to `12` for 12-hour. However, to control exactly which hours to display, the `hourValues` input can take a number, an array of numbers, or a string of comma separated numbers. | `number[]`, `number`, `string` |
| `max` | `max` | The maximum datetime allowed. Value must be a date string following the [ISO 8601 datetime format standard](https://www.w3.org/TR/NOTE-datetime), `1996-12-19`. The format does not have to be specific to an exact datetime. For example, the maximum could just be the year, such as `1994`. Defaults to the end of this year. | `string` |
| `min` | `min` | The minimum datetime allowed. Value must be a date string following the [ISO 8601 datetime format standard](https://www.w3.org/TR/NOTE-datetime), such as `1996-12-19`. The format does not have to be specific to an exact datetime. For example, the minimum could just be the year, such as `1994`. Defaults to the beginning of the year, 100 years ago from today. | `string` |
| `minuteValues` | -- | Values used to create the list of selectable minutes. By default the mintues range from `0` to `59`. However, to control exactly which minutes to display, the `minuteValues` input can take a number, an array of numbers, or a string of comma separated numbers. For example, if the minute selections should only be every 15 minutes, then this input value would be `minuteValues="0,15,30,45"`. | `number[]`, `number`, `string` |
| `minuteValues` | -- | Values used to create the list of selectable minutes. By default the minutes range from `0` to `59`. However, to control exactly which minutes to display, the `minuteValues` input can take a number, an array of numbers, or a string of comma separated numbers. For example, if the minute selections should only be every 15 minutes, then this input value would be `minuteValues="0,15,30,45"`. | `number[]`, `number`, `string` |
| `mode` | `mode` | The mode determines which platform styles to use. Possible values are: `"ios"` or `"md"`. | `Mode` |
| `monthNames` | `month-names` | Full names for each month name. This can be used to provide locale month names. Defaults to English. | `string[]`, `string` |
| `monthShortNames` | `month-short-names` | Short abbreviated names for each month name. This can be used to provide locale month names. Defaults to English. | `string[]`, `string` |
Expand Down
5 changes: 3 additions & 2 deletions core/src/components/fab-button/fab-button.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -94,14 +94,15 @@ export class FabButton {
<TagType
class="fab-button-native"
disabled={this.disabled}
href={this.href}>
href={this.href}
>
<span class="fab-button-close-icon">
<ion-icon name="close" lazy={false}></ion-icon>
</span>
<span class="fab-button-inner">
<slot></slot>
</span>
{ this.mode === 'md' && <ion-ripple-effect /> }
{this.mode === 'md' && <ion-ripple-effect />}
</TagType>
);
}
Expand Down
3 changes: 2 additions & 1 deletion core/src/components/img/img.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,8 @@ export class Img {
<img
src={this.loadSrc}
alt={this.alt}
decoding="async"></img>
decoding="async"
/>
);
}
}
3 changes: 2 additions & 1 deletion core/src/components/input/input.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -369,7 +369,8 @@ export class Input {
type="button"
class="input-clear-icon"
onTouchStart={this.clearTextInput.bind(this)}
onMouseDown={this.clearTextInput.bind(this)}/>
onMouseDown={this.clearTextInput.bind(this)}
/>
];
}
}
Expand Down
6 changes: 3 additions & 3 deletions core/src/components/item/item.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -158,10 +158,10 @@ export class Item {
<slot></slot>
</div>
<slot name="end"></slot>
{ showDetail && <ion-icon icon={detailIcon} lazy={false} class="item-detail-icon"></ion-icon> }
{showDetail && <ion-icon icon={detailIcon} lazy={false} class="item-detail-icon"></ion-icon>}
</div>
{ state && <div class="item-state"></div> }
{ clickable && mode === 'md' && <ion-ripple-effect /> }
{state && <div class="item-state"></div>}
{clickable && mode === 'md' && <ion-ripple-effect />}
</TagType>
);
}
Expand Down
13 changes: 7 additions & 6 deletions core/src/components/list-header/list-header.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,19 +12,20 @@ import { createColorClasses } from '../../utils/theme';
shadow: true
})
export class ListHeader {
/**
* The color to use from your application's color palette.
* Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
* For more information on colors, see [theming](/docs/theming/basics).
*/
@Prop() color?: Color;

/**
* The mode determines which platform styles to use.
* Possible values are: `"ios"` or `"md"`.
*/
@Prop() mode!: Mode;

/**
* The color to use from your application's color palette.
* Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
* For more information on colors, see [theming](/docs/theming/basics).
*/
@Prop() color?: Color;

hostData() {
return {
class: createColorClasses(this.color)
Expand Down
Loading

0 comments on commit e741643

Please sign in to comment.