All files / src/BaseInput BaseToggle.vue.js

100% Statements 13/13
83.33% Branches 5/6
100% Functions 6/6
100% Lines 13/13

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73                      1x                                     6x             7x 6x   7x             5x 4x             14x       6x 6x   6x       2x 2x          
// @ts-check
 
import { has, isNil } from "lodash";
import Vue from "vue";
 
import { genId } from "../utils";
import InputError from "./InputError.vue";
import InputErrorMixin from "./InputErrorMixin";
import BaseKeepFocusMixin from "../mixins/BaseKeepFocusMixin";
import BaseFocusInOutMixin from "../mixins/BaseFocusInOutMixin";
 
const component = /** @type {V.Constructor<any, any>} */(Vue).extend({
  name: "BaseToggle",
  components: { InputError },
  mixins: [ BaseKeepFocusMixin, BaseFocusInOutMixin, InputErrorMixin ],
  model: { prop: "value", event: "edit" },
  props: {
    value: { type: Boolean, default: false },
    label: { type: String, default: "" },
    disabled: { type: Boolean, default: false },
    inEdit: { type: Boolean, default: false }
  },
  /**
   * @returns {{
   *   editValue: boolean | null,
   *   id: string,
   *   hasEditRequest: boolean
   * }}
   */
  data() {
    return { editValue: null, id: genId(), hasEditRequest: false };
  },
  watch: {
    /**
     * @param {boolean} v
     */
    inEdit(v /*: boolean */) {
      if (v) {
        this.editValue = Boolean(this.value); /* clear old editValue when entering edit */
      }
      this.keepFocusOnNextTick("input");
    },
    /**
     * @param {boolean} v
     */
    value(v /*: boolean */) {
      // We force editValue if in edit mode
      if (this.inEdit) {
        this.editValue = v;
      }
    },
    /**
     * @return {void}
    */
    editValue: function() {
      this.$emit("edit", this.editValue);
    }
  },
  mounted() {
    Eif (!isNil(this.value)) {
      this.editValue = Boolean(this.value);
    }
    this.hasEditRequest = has(this.$listeners, "edit-request");
  },
  methods: {
    toggle() {
      this.editValue = !this.editValue;
      this.$emit("userEdit", this.editValue);
    }
  }
});
export default component;