<template>
<button :class="buttonClass" @click.stop="$emit('click')">
    <slot></slot>
</button>
</template>

<script>
import { isString, isArray } from 'lodash'
export default {
	name: 'Button',
	props: {
		type: {
			type: String,
			default: 'default',
			validate: function (v) {
				return ['primary', 'secondary', 'tertiary', 'header', 'activity', 'warning', 'cancel', 'default'].includes(v.toLowerCase())
			}
		},
		raised: {
			type: Boolean,
			default: false
		},
		small: {
			type: Boolean,
			default: false
		}
	},
	computed: {
		buttonClass() {
			let t = ['buttonClass', this.type.toLowerCase()]
			if (this.raised) {
				t.push('raised')
			}
			if (this.small) {
				t.push('small')
			}
			return t.join(' ')
		}
	}
}
</script>
