quasar/ui/src/components/checkbox/QCheckbox.js at v1 · hipertracker/quasar · GitHub

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
import Vue from 'vue'

import QIcon from '../icon/QIcon.js'

import CheckboxMixin from '../../mixins/checkbox.js'

export default Vue.extend({
  name: 'QCheckbox',

  mixins: [ CheckboxMixin ],

  computed: {
    computedIcon () {
      return this.isTrue === true
        ? this.checkedIcon
        : (this.isIndeterminate === true
          ? this.indeterminateIcon
          : this.uncheckedIcon
        )
    }
  },

  methods: {
    __getInner (h) {
      return this.computedIcon !== void 0
        ? [
          h('div', {
            key: 'icon',
            staticClass: 'q-checkbox__icon-container absolute flex flex-center no-wrap'
          }, [
            h(QIcon, {
              staticClass: 'q-checkbox__icon',
              props: { name: this.computedIcon }
            })
          ])
        ]
        : [
          h('div', {
            key: 'svg',
            staticClass: 'q-checkbox__bg absolute'
          }, [
            h('svg', {
              staticClass: 'q-checkbox__svg fit absolute-full',
              attrs: { focusable: 'false' /* needed for IE11 */, viewBox: '0 0 24 24', 'aria-hidden': 'true' }
            }, [
              h('path', {
                staticClass: 'q-checkbox__truthy',
                attrs: {
                  fill: 'none',
                  d: 'M1.73,12.91 8.1,19.28 22.79,4.59'
                }
              }),

              h('path', {
                staticClass: 'q-checkbox__indet',
                attrs: {
                  d: 'M4,14H20V10H4'
                }
              })
            ])
          ])
        ]
    }
  },

  created () {
    this.type = 'checkbox'
  }
})