QIcon override for svg

QIcon.js

const prefix = process.env.THEME === 'mat' ? 'md' : 'ios'

export default {
	name: 'QIcon',
	props: {
		name: String,
		color: String,
		size: String
	},
	computed: {
		classes () {
			let cls
			const icon = this.name

			if (!icon) {
				return ''
			} else if (/^fa[s|r|l|b]{0,1} /.test(icon) || icon.startsWith('icon-')) {
				cls = icon
			} else if (icon.startsWith('bt-')) {
				cls = `bt ${icon}`
			} else if (/^ion-(md|ios|logo)/.test(icon)) {
				cls = `ionicons ${icon}`
			} else if (icon.startsWith('ion-')) {
				cls = `ionicons ion-${prefix}${icon.substr(3)}`
			} else if (icon.startsWith('mdi-')) {
				cls = `mdi ${icon}`
			} else if (icon.startsWith('svguse-')) {
				cls = `svguse ${icon}`
			} else {
				cls = 'material-icons'
			}

			return this.color
				? `${cls} text-${this.color}`
				: cls
		},
		content () {
			if (this.name.startsWith('svguse-')) {
				const use = this.name.replace(/^svguse-/, '')
				let style = ''
				style += `fill: currentColor;`
				return `<svg style="${style}">
								<use xlink:href="${use}"></use>
							</svg>`

			}
			return this.classes.startsWith('material-icons')
				? this.name.replace(/ /g, '_')
				: ' '
		},
		style () {
			const style = {}
			if (this.size) {
				style.fontSize = this.size
			}
			if (this.name.startsWith('svguse-')) {
				style.width = '1em'
				style.height = '1em'
				style.overflow = 'hidden'
			}
			return style
		}
	},
	render (h) {
		return h('i', {
			staticClass: 'q-icon',
			'class': this.classes,
			style: this.style,
			attrs: { 'aria-hidden': true },
			domProps: { innerHTML: this.content }
		}, [
			this.$slots.default,
		])
	}
}