bootstrap-vue-wrapper
Version:
Bootstrap 5 components in Vue3 wrapper.
112 lines (111 loc) • 2.15 kB
JavaScript
import { useValidator as l } from "@zemkogabor/vue-form-validator";
import { defineComponent as o, ref as d } from "vue";
const s = o({
name: "BsCheckbox",
props: {
/**
* Value for checkbox if v-model is array.
*/
value: {
type: String,
default: null
},
/**
* Value for v-model
*/
modelValue: {
type: [Array, Boolean],
default: null
},
/**
* Html id
*/
id: {
type: String,
required: !0
},
/**
* Label for input
*/
label: {
type: String,
default: void 0
},
/**
* Attribute hint
*/
hint: {
type: String,
default: void 0
},
/**
* Input container div class.
*/
classContainer: {
type: String,
default: void 0
},
/**
* Enable or disable validator
*/
validatorEnabled: {
type: Boolean,
default: !0
},
/**
* Custom validator messages, e.g. minlength validation with custom message
*/
customValidatorMessages: {
type: Object,
default: void 0
}
},
emits: ["update:modelValue"],
setup(e) {
const a = d(null);
return {
inputRef: a,
validator: l(a, e.customValidatorMessages)
};
},
computed: {
/**
* Checkbox is checked or not.
*/
isChecked() {
return this.modelValue instanceof Array ? this.modelValue.includes(this.value) : this.modelValue === !0;
}
},
methods: {
/**
* Hint id is generated
*/
getHintId() {
return this.id + "Hint";
},
/**
* On input event
*
* @param event
*/
onInput(e) {
const i = e.target.checked;
if (this.modelValue instanceof Array) {
const t = [...this.modelValue];
i ? t.push(this.value) : t.splice(t.indexOf(this.value), 1), this.$emit("update:modelValue", t);
} else
this.$emit("update:modelValue", i);
},
/**
* On invalid event
*
* @param event
*/
onInvalid(e) {
this.validatorEnabled && this.validator.onInvalid(e);
}
}
});
export {
s as default
};