javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-18 19:21:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(): update to Stencil One 🎉🎊

Browse Source
This commit is contained in:
Manu MA
2019-06-19 21:33:50 +02:00
committed by GitHub
parent 7f1829eb21
commit b40f7d36d5
572 changed files with 14426 additions and 9916 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
core/src/components/toggle/toggle.tsx
View File

@ -1,10 +1,14 @@
import { Component, ComponentInterface, Element, Event, EventEmitter, Listen, Prop, QueueApi, State, Watch } from '@stencil/core';
import { Component, ComponentInterface, Element, Event, EventEmitter, Listen, Prop, QueueApi, State, Watch, h } from '@stencil/core';
import { Color, Gesture, GestureDetail, Mode, StyleEventDetail, ToggleChangeEventDetail } from '../../interface';
import { getIonMode } from '../../global/ionic-global';
import { Color, Gesture, GestureDetail, StyleEventDetail, ToggleChangeEventDetail } from '../../interface';
import { hapticSelection } from '../../utils/haptic';
import { findItemLabel, renderHiddenInput } from '../../utils/helpers';
import { createColorClasses, hostContext } from '../../utils/theme';
/**
* @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
*/
@Component({
tag: 'ion-toggle',
styleUrls: {
@ -28,11 +32,6 @@ export class Toggle implements ComponentInterface {
@State() activated = false;
/**
* The mode determines which platform styles to use.
*/
@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"`.
@ -108,7 +107,6 @@ export class Toggle implements ComponentInterface {
async componentDidLoad() {
this.gesture = (await import('../../utils/gesture')).createGesture({
el: this.el,
queue: this.queue,
gestureName: 'toggle',
gesturePriority: 100,
threshold: 5,
@ -148,7 +146,7 @@ export class Toggle implements ComponentInterface {
}
private onMove(detail: GestureDetail) {
if (shouldToggle(this.doc, this.checked, detail.deltaX, -10)) {
if (shouldToggle(document, this.checked, detail.deltaX, -10)) {
this.checked = !this.checked;
hapticSelection();
}
@ -181,6 +179,7 @@ export class Toggle implements ComponentInterface {
hostData() {
const { inputId, disabled, checked, activated, color, el } = this;
const mode = getIonMode(this);
const labelId = inputId + '-lbl';
const label = findItemLabel(el);
if (label) {
@ -195,7 +194,7 @@ export class Toggle implements ComponentInterface {
class: {
...createColorClasses(color),
[`${this.mode}`]: true,
[`${mode}`]: true,
'in-item': hostContext('ion-item', el),
'toggle-activated': activated,
'toggle-checked': checked,