Internal refactor completed in order to improve tree shaking and dead
code removal. The public API, with an exception to ion-slides, has
stayed the same. However, internally many changes were required so
bundlers could better exclude modules which should not be bundled.
Ultimately most changes resorted to removing references to `window` or
`document`, or a module that referenced one of those.
BREAKING CHANGES
ion-slides was refactored to remove the external dependencies, and
rewritten in TypeScript/ES6 modules to again improve tree shaking
abilities.
* fix(sass): remove usage of colors other than primary, improve error
fixes#8266
* refactor(sass): add variables to override all modes for fab and input
* refactor(fab): rename Sass variable from in-list to list-button
BREAKING CHANGE:
- `$fab-<mode>-in-list-background-color` ->
`$fab-<mode>-list-button-background-color`
- `$fab-<mode>-in-list-text-color` ->
`$fab-<mode>-list-button-text-color`
- `$fab-<mode>-in-list-background-color-activated` ->
`$fab-<mode>-list-button-background-color-activated`
BREAKING CHANGES:
Colors should be passed in the `color` input on components, not added
individually as an attribute on the component.
For example:
```
<ion-tabs primary>
```
Becomes
```
<ion-tabs color=”primary”>
```
Or to bind an expression to color:
```
<ion-navbar [color]="barColor">
...
</ion-navbar>
```
```ts
@Component({
templateUrl: 'build/pages/about/about.html'
})
export class AboutPage {
barColor: string;
constructor(private nav: NavController, platform: Platform) {
this.barColor = platform.is('android') ? 'primary' : 'light';
}
}
```
Reason for this change:
It was difficult to dynamically add colors to components, especially if
the name of the color attribute was unknown in the template.
This change keeps the css flat since we aren’t chaining color
attributes on components and instead we assign a class to the component
which includes the color’s name.
This allows you to easily toggle a component between multiple colors.
Speeds up performance because we are no longer reading through all of
the attributes to grab the color ones.
references #7467closes#7087closes#7401closes#7523
* docs(input): fix typo
* docs(scroll): add note about required CSS for scrollY
* docs(config): add swipeBackEnabled to config properties list
* docs(component generator): fix broken link in template comment
* docs(directive generator): fix broken link in template comment
BREAKING CHANGES:
- `<button>` becomes `<button ion-button>`
- `<a button>` becomes `<a ion-button>`
- `<button ion-item>` does not get the `ion-button` attribute
- Buttons inside of `<ion-item-options>` do get the `ion-button`
attribute
- Removed the `category` attribute, this should be passed in
`ion-button` instead.
- Button attributes added for icons in buttons: `icon-only`,
`icon-left`, and `icon-right`
closes#7466
BREAKING CHANGES:
The Option component’s `checked` attribute has been renamed to
`selected` in order to select an option. This is to the follow the MDN
spec for a select option:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option
If a `ngModel` is added to the Select component the value of the
`ngModel` will take precedence over the `selected` attribute.
references #7334
Use NavController as the public API, and NavControllerBase as the
internal API. Refactored all app/nav/tabs unit tests and created
centralized mocking functions.
The input highlight can now be enabled for ios. Fixed wp’s
valid/invalid highlighting. The highlight bar now goes on top of the
item-inner border so it will resize if there is an icon to the left.
BREAKING CHANGES:
Fixed typos in the input highlight variables:
- `$text-input-md-hightlight-color-valid` ->
`$text-input-md-highlight-color-valid`
- `$text-input-wp-hightlight-color-valid` ->
`$text-input-wp-highlight-color-valid`
Modified variables to turn on/off the highlight:
ios (defaults to false for all):
```
$text-input-ios-show-focus-highlight: false !default;
$text-input-ios-show-valid-highlight:
$text-input-ios-show-focus-highlight !default;
$text-input-ios-show-invalid-highlight:
$text-input-ios-show-focus-highlight !default;
```
md (defaults to true for all):
```
$text-input-md-show-focus-highlight: true !default;
$text-input-md-show-valid-highlight:
$text-input-md-show-focus-highlight !default;
$text-input-md-show-invalid-highlight:
$text-input-md-show-focus-highlight !default;
```
wp (defaults to true for all):
```
$text-input-wp-show-focus-highlight: true !default;
$text-input-wp-show-valid-highlight:
$text-input-wp-show-focus-highlight !default;
$text-input-wp-show-invalid-highlight:
$text-input-wp-show-focus-highlight !default;
```
fixes#6449
references #5052
