<commit_before><template>
  <div class="vux-x-switch weui-cell weui-cell_switch">
    <div class="weui-cell__bd">
      <label class="weui-label" :style="labelStyle" :class="labelClass" v-html="title"></label>
      <inline-desc v-if="inlineDesc">{{ inlineDesc }}</inline-desc>
    </div>
    <div class="weui-cell__ft">
      <input class="weui-switch" type="checkbox" :disabled="disabled" v-model="currentValue" />
      <div v-if="preventDefault" class="vux-x-switch-overlay" @click="onClick"></div>
    </div>
  </div>
</template>

<script>
import InlineDesc from '../inline-desc'
import cleanStyle from '../../libs/clean-style'

export default {
  name: 'x-switch',
  components: {
    InlineDesc
  },
  computed: {
    labelStyle () {
      let isHTML = /<\/?[^>]*>/.test(this.title)
      let width = Math.min(isHTML ? 5 : (this.title.length + 1), 14) + 'em'
      return cleanStyle({
        display: 'block',
        width: this.$parent.labelWidth || width,
        textAlign: this.$parent.labelAlign
      })
    },
    labelClass () {
      return {
        'vux-cell-justify': this.$parent && this.$parent.labelAlign === 'justify'
      }
    }
  },
  methods: {
    onClick () {
      this.$emit('on-click', !this.currentValue, this.currentValue)
    }
  },
  props: {
    title: {
      type: String,
      required: true
    },
    disabled: Boolean,
    value: {
      type: Boolean,
      default: false
    },
    inlineDesc: [String, Boolean, Number],
    preventDefault: Boolean
  },
  data () {
    return {
      currentValue: this.value
    }
  },
  watch: {
    currentValue (val) {
      this.$emit('input', val)
      this.$emit('on-change', val)
    },
    value (val) {
      this.currentValue = val
    }
  }
}
</script>

<style lang="less">
@import '../../styles/weui/widget/weui_cell/weui_form/weui_form_common';
@import '../../styles/weui/widget/weui_cell/weui_switch';

.weui-cell_switch .weui-cell__ft {
  font-size: 0;
  position: relative;
  overflow: hidden;
}

input.weui-switch[disabled] {
  opacity: @switch-disabled-opacity;
}

.vux-x-switch.weui-cell_switch {
  padding-top: 6px;
  padding-bottom: 6px;
}

.vux-x-switch-overlay {
  width: 60px;
  height: 50px;
  position: absolute;
  right: 0;
  top: 0;
  opacity: 0;
}
</style>

<commit_msg>x-switch: remove overflow:hidden style<commit_after><template>
  <div class="vux-x-switch weui-cell weui-cell_switch">
    <div class="weui-cell__bd">
      <label class="weui-label" :style="labelStyle" :class="labelClass" v-html="title"></label>
      <inline-desc v-if="inlineDesc">{{ inlineDesc }}</inline-desc>
    </div>
    <div class="weui-cell__ft">
      <input class="weui-switch" type="checkbox" :disabled="disabled" v-model="currentValue" />
      <div v-if="preventDefault" class="vux-x-switch-overlay" @click="onClick"></div>
    </div>
  </div>
</template>

<script>
import InlineDesc from '../inline-desc'
import cleanStyle from '../../libs/clean-style'

export default {
  name: 'x-switch',
  components: {
    InlineDesc
  },
  computed: {
    labelStyle () {
      let isHTML = /<\/?[^>]*>/.test(this.title)
      let width = Math.min(isHTML ? 5 : (this.title.length + 1), 14) + 'em'
      return cleanStyle({
        display: 'block',
        width: this.$parent.labelWidth || width,
        textAlign: this.$parent.labelAlign
      })
    },
    labelClass () {
      return {
        'vux-cell-justify': this.$parent && this.$parent.labelAlign === 'justify'
      }
    }
  },
  methods: {
    onClick () {
      this.$emit('on-click', !this.currentValue, this.currentValue)
    }
  },
  props: {
    title: {
      type: String,
      required: true
    },
    disabled: Boolean,
    value: {
      type: Boolean,
      default: false
    },
    inlineDesc: [String, Boolean, Number],
    preventDefault: Boolean
  },
  data () {
    return {
      currentValue: this.value
    }
  },
  watch: {
    currentValue (val) {
      this.$emit('input', val)
      this.$emit('on-change', val)
    },
    value (val) {
      this.currentValue = val
    }
  }
}
</script>

<style lang="less">
@import '../../styles/weui/widget/weui_cell/weui_form/weui_form_common';
@import '../../styles/weui/widget/weui_cell/weui_switch';

.weui-cell_switch .weui-cell__ft {
  font-size: 0;
  position: relative;
}

input.weui-switch[disabled] {
  opacity: @switch-disabled-opacity;
}

.vux-x-switch.weui-cell_switch {
  padding-top: 6px;
  padding-bottom: 6px;
}

.vux-x-switch-overlay {
  width: 60px;
  height: 50px;
  position: absolute;
  right: 0;
  top: 0;
  opacity: 0;
}
</style>


{'fraction_non_alphanumeric': 0.1763934426229508, 'fraction_numerical': 0.006120218579234973, 'mean_word_length': 2.6992724333063864, 'pattern_counts': {'":': 0, '<': 43, '<?xml version=': 0, '>': 45, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6324416', 'n_tokens_mistral': 1641, 'n_tokens_neox': 1617, 'n_words': 301}