153 lines
4.3 KiB
JavaScript
153 lines
4.3 KiB
JavaScript
import { cn } from '@primeuix/utils';
|
|
import BaseEditableHolder from '@primevue/core/baseeditableholder';
|
|
import ToggleSwitchStyle from 'primevue/toggleswitch/style';
|
|
import { createElementBlock, openBlock, mergeProps, createElementVNode, renderSlot } from 'vue';
|
|
|
|
var script$1 = {
|
|
name: 'BaseToggleSwitch',
|
|
"extends": BaseEditableHolder,
|
|
props: {
|
|
trueValue: {
|
|
type: null,
|
|
"default": true
|
|
},
|
|
falseValue: {
|
|
type: null,
|
|
"default": false
|
|
},
|
|
readonly: {
|
|
type: Boolean,
|
|
"default": false
|
|
},
|
|
tabindex: {
|
|
type: Number,
|
|
"default": null
|
|
},
|
|
inputId: {
|
|
type: String,
|
|
"default": null
|
|
},
|
|
inputClass: {
|
|
type: [String, Object],
|
|
"default": null
|
|
},
|
|
inputStyle: {
|
|
type: Object,
|
|
"default": null
|
|
},
|
|
ariaLabelledby: {
|
|
type: String,
|
|
"default": null
|
|
},
|
|
ariaLabel: {
|
|
type: String,
|
|
"default": null
|
|
}
|
|
},
|
|
style: ToggleSwitchStyle,
|
|
provide: function provide() {
|
|
return {
|
|
$pcToggleSwitch: this,
|
|
$parentInstance: this
|
|
};
|
|
}
|
|
};
|
|
|
|
var script = {
|
|
name: 'ToggleSwitch',
|
|
"extends": script$1,
|
|
inheritAttrs: false,
|
|
emits: ['change', 'focus', 'blur'],
|
|
methods: {
|
|
getPTOptions: function getPTOptions(key) {
|
|
var _ptm = key === 'root' ? this.ptmi : this.ptm;
|
|
return _ptm(key, {
|
|
context: {
|
|
checked: this.checked,
|
|
disabled: this.disabled
|
|
}
|
|
});
|
|
},
|
|
onChange: function onChange(event) {
|
|
if (!this.disabled && !this.readonly) {
|
|
var newValue = this.checked ? this.falseValue : this.trueValue;
|
|
this.writeValue(newValue, event);
|
|
this.$emit('change', event);
|
|
}
|
|
},
|
|
onFocus: function onFocus(event) {
|
|
this.$emit('focus', event);
|
|
},
|
|
onBlur: function onBlur(event) {
|
|
var _this$formField$onBlu, _this$formField;
|
|
this.$emit('blur', event);
|
|
(_this$formField$onBlu = (_this$formField = this.formField).onBlur) === null || _this$formField$onBlu === void 0 || _this$formField$onBlu.call(_this$formField, event);
|
|
}
|
|
},
|
|
computed: {
|
|
checked: function checked() {
|
|
return this.d_value === this.trueValue;
|
|
},
|
|
dataP: function dataP() {
|
|
return cn({
|
|
checked: this.checked,
|
|
disabled: this.disabled,
|
|
invalid: this.$invalid
|
|
});
|
|
}
|
|
}
|
|
};
|
|
|
|
var _hoisted_1 = ["data-p-checked", "data-p-disabled", "data-p"];
|
|
var _hoisted_2 = ["id", "checked", "tabindex", "disabled", "readonly", "aria-checked", "aria-labelledby", "aria-label", "aria-invalid"];
|
|
var _hoisted_3 = ["data-p"];
|
|
var _hoisted_4 = ["data-p"];
|
|
function render(_ctx, _cache, $props, $setup, $data, $options) {
|
|
return openBlock(), createElementBlock("div", mergeProps({
|
|
"class": _ctx.cx('root'),
|
|
style: _ctx.sx('root')
|
|
}, $options.getPTOptions('root'), {
|
|
"data-p-checked": $options.checked,
|
|
"data-p-disabled": _ctx.disabled,
|
|
"data-p": $options.dataP
|
|
}), [createElementVNode("input", mergeProps({
|
|
id: _ctx.inputId,
|
|
type: "checkbox",
|
|
role: "switch",
|
|
"class": [_ctx.cx('input'), _ctx.inputClass],
|
|
style: _ctx.inputStyle,
|
|
checked: $options.checked,
|
|
tabindex: _ctx.tabindex,
|
|
disabled: _ctx.disabled,
|
|
readonly: _ctx.readonly,
|
|
"aria-checked": $options.checked,
|
|
"aria-labelledby": _ctx.ariaLabelledby,
|
|
"aria-label": _ctx.ariaLabel,
|
|
"aria-invalid": _ctx.invalid || undefined,
|
|
onFocus: _cache[0] || (_cache[0] = function () {
|
|
return $options.onFocus && $options.onFocus.apply($options, arguments);
|
|
}),
|
|
onBlur: _cache[1] || (_cache[1] = function () {
|
|
return $options.onBlur && $options.onBlur.apply($options, arguments);
|
|
}),
|
|
onChange: _cache[2] || (_cache[2] = function () {
|
|
return $options.onChange && $options.onChange.apply($options, arguments);
|
|
})
|
|
}, $options.getPTOptions('input')), null, 16, _hoisted_2), createElementVNode("div", mergeProps({
|
|
"class": _ctx.cx('slider')
|
|
}, $options.getPTOptions('slider'), {
|
|
"data-p": $options.dataP
|
|
}), [createElementVNode("div", mergeProps({
|
|
"class": _ctx.cx('handle')
|
|
}, $options.getPTOptions('handle'), {
|
|
"data-p": $options.dataP
|
|
}), [renderSlot(_ctx.$slots, "handle", {
|
|
checked: $options.checked
|
|
})], 16, _hoisted_4)], 16, _hoisted_3)], 16, _hoisted_1);
|
|
}
|
|
|
|
script.render = render;
|
|
|
|
export { script as default };
|
|
//# sourceMappingURL=index.mjs.map
|