VAvatar.ts at 6ac659b ⋅ vuetifyjs/vuetify

import './VAvatar.sass'

// Mixins
import Colorable from '../../mixins/colorable'
import Measurable from '../../mixins/measurable'
import Roundable from '../../mixins/roundable'

// Utilities
import { convertToUnit } from '../../util/helpers'

// Types
import { VNode } from 'vue'
import mixins from '../../util/mixins'

export default mixins(
  Colorable,
  Measurable,
  Roundable,
  /* @vue/component */
).extend({
  name: 'v-avatar',

  props: {
    left: Boolean,
    right: Boolean,
    size: {
      type: [Number, String],
      default: 48,
    },
  },

  computed: {
    classes (): object {
      return {
        'v-avatar--left': this.left,
        'v-avatar--right': this.right,
        ...this.roundedClasses,
      }
    },
    styles (): object {
      return {
        height: convertToUnit(this.size),
        minWidth: convertToUnit(this.size),
        width: convertToUnit(this.size),
        ...this.measurableStyles,
      }
    },
  },

  render (h): VNode {
    const data = {
      staticClass: 'v-avatar',
      class: this.classes,
      style: this.styles,
      on: this.$listeners,
    }

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

Read our documentation on viewing source code .

Navigation	Overlay
`t` Navigate files	`h` Toggle hits
`y` Change url to tip of branch	`m` Toggle misses
`b / v` Jump to prev/next hit line	`p` Toggle partial
`z / x` Jump to prev/next missed or partial line	`1..9` Toggle flags
`shift + o` Open current page in GitHub	`a` Toggle all on
`/ or ?` Show keyboard shortcuts dialog	`c` Toggle context lines or commits

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		})