@tarojs/components
Version:
86 lines (81 loc) • 2.47 kB
JavaScript
import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
const indexCss = "taro-switch-core{display:inline-block;width:52px;height:32px}taro-switch-core .weui-switch{display:block;width:100%;height:100%}";
const Switch = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
constructor() {
super();
this.__registerHost();
this.onChange = createEvent(this, "change", 7);
this.switchChange = e => {
e.stopPropagation();
const value = e.target.checked;
this.isChecked = value;
this.onChange.emit({
value
});
};
this.type = 'switch';
this.checked = false;
this.color = '#04BE02';
this.name = undefined;
this.disabled = false;
this.nativeProps = {};
this.isChecked = undefined;
this.isWillLoadCalled = false;
}
function(newVal, oldVal) {
if (!this.isWillLoadCalled)
return;
if (newVal !== oldVal)
this.isChecked = newVal;
}
componentWillLoad() {
this.isWillLoadCalled = true;
this.isChecked = this.checked;
}
componentDidLoad() {
Object.defineProperty(this.el, 'value', {
get: () => this.isChecked,
configurable: true
});
}
render() {
const { type, color, isChecked, name, disabled, nativeProps } = this;
const style = isChecked
? {
borderColor: color || '04BE02',
backgroundColor: color || '04BE02'
}
: {};
return (h("input", Object.assign({ type: 'checkbox', class: `weui-${type}`, style: style, checked: isChecked, name: name, disabled: disabled, onChange: this.switchChange }, nativeProps)));
}
get el() { return this; }
static get watchers() { return {
"checked": ["function"]
}; }
static get style() { return indexCss; }
}, [0, "taro-switch-core", {
"type": [1],
"checked": [4],
"color": [1],
"name": [1],
"disabled": [4],
"nativeProps": [16],
"isChecked": [32],
"isWillLoadCalled": [32]
}]);
function defineCustomElement$1() {
if (typeof customElements === "undefined") {
return;
}
const components = ["taro-switch-core"];
components.forEach(tagName => { switch (tagName) {
case "taro-switch-core":
if (!customElements.get(tagName)) {
customElements.define(tagName, Switch);
}
break;
} });
}
const TaroSwitchCore = Switch;
const defineCustomElement = defineCustomElement$1;
export { TaroSwitchCore, defineCustomElement };