primevue
Version:
PrimeVue is an open source UI library for Vue featuring a rich set of 80+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with PrimeBloc
153 lines (147 loc) • 4.44 kB
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