<template>
  <div class="bml-switch-box">
    <switch class="bml-switch"
      @change="onchange"
      :checked="value"
      :disabled="disabled"></switch>
    <text class="bml-switch-label" v-if="title">{{title}}</text>
  </div>
</template>

<style lang="scss" src="../css/switch.scss"></style>

<script>
  module.exports = {
    props: {
      "title": {
        type: String
      },
      "value": {
        type: Boolean,
        default: false
      },
      "disabled": {
        type: Boolean,
        default: false
      }
    },
    methods: {
      onchange (event) {
        this.checked = event.value;
        this.$emit("input", this.checked);
        this.$emit("change", this.checked);
      }
    }
  }
</script>