<template>
	<el-switch :disabled="!editable" :value="editValue" @input="onInput"
	           class="picker"></el-switch>
</template>

<script>
	import LinkableInputWrapper from "./LinkableInputWrapper";
	import CmdInputWrapper from "./CmdInputWrapper";

	export default {
		name: "BooleanInput",
		components: {LinkableInputWrapper, CmdInputWrapper},
		props: ['value', 'container', 'property', 'propertyName', 'editable'],
		data() {
			return {}
		},
		computed: {
			editValue() {
				return this.value === undefined ? this.property.default : this.value;
			},
		},
		methods: {
			onInput(v) {
				if (v !== this.value) {
					this.$emit('input', v, this.container, this.propertyName, this.value);
				}
			}
		},
	}
</script>

<style scoped>
	.picker {
		flex: 1;
		float: right;
		margin-top: 4px;
	}
</style>
