1 1
import './VAvatar.sass'
2

3
// Mixins
4 1
import Colorable from '../../mixins/colorable'
5 1
import Measurable from '../../mixins/measurable'
6 1
import Roundable from '../../mixins/roundable'
7

8
// Utilities
9 1
import { convertToUnit } from '../../util/helpers'
10

11
// Types
12
import { VNode } from 'vue'
13 1
import mixins from '../../util/mixins'
14

15 1
export default mixins(
16
  Colorable,
17
  Measurable,
18
  Roundable,
19
  /* @vue/component */
20
).extend({
21
  name: 'v-avatar',
22

23
  props: {
24
    left: Boolean,
25
    right: Boolean,
26
    size: {
27
      type: [Number, String],
28
      default: 48,
29
    },
30
  },
31

32
  computed: {
33 1
    classes (): object {
34 1
      return {
35
        'v-avatar--left': this.left,
36
        'v-avatar--right': this.right,
37
        ...this.roundedClasses,
38
      }
39
    },
40 1
    styles (): object {
41 1
      return {
42
        height: convertToUnit(this.size),
43
        minWidth: convertToUnit(this.size),
44
        width: convertToUnit(this.size),
45
        ...this.measurableStyles,
46
      }
47
    },
48
  },
49

50 1
  render (h): VNode {
51 1
    const data = {
52
      staticClass: 'v-avatar',
53
      class: this.classes,
54
      style: this.styles,
55
      on: this.$listeners,
56
    }
57

58 1
    return h('div', this.setBackgroundColor(this.color, data), this.$slots.default)
59
  },
60
})

Read our documentation on viewing source code .

Loading