@empathyco/x-components
Version:
Empathy X Components
53 lines (50 loc) • 1.32 kB
JavaScript
import { defineComponent, computed } from 'vue';
/**
* Basic switch component to handle boolean values. This component receives
* its selected state using a prop, and emits a Vue event whenever the user
* clicks it.
*
* @public
*/
var _sfc_main = defineComponent({
name: 'BaseSwitch',
/**
* The selected value of the switch.
*
* @public
*/
props: {
modelValue: {
type: Boolean,
default: false,
},
},
emits: ['update:modelValue'],
setup(props, { emit }) {
/**
* Dynamic CSS classes to add to the switch component
* depending on its internal state.
*
* @returns A boolean dictionary with dynamic CSS classes.
* @internal
*/
const cssClasses = computed(() => ({
'x-switch--is-selected x-selected': props.modelValue,
}));
/**
* Emits an event with the new value of the switch.
*
* @internal
*/
const toggle = () => {
const newValue = !props.modelValue;
emit('update:modelValue', newValue);
};
return {
cssClasses,
toggle,
};
},
});
export { _sfc_main as default };
//# sourceMappingURL=base-switch.vue2.js.map