<template>
  <q-btn
    v-on="$listeners"
    v-bind="$attrs"
    no-caps
    unelevated
    :color="color"
    :class="{
      'ui-btn_size_sm': size === 'sm',
      'ui-btn_size_lg': size === 'lg',
    }"
  >
    <template v-for="(_, slot) of $scopedSlots" v-slot:[slot]="scope">
      <slot :name="slot" v-bind="scope" />
    </template>
  </q-btn>
</template>

<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator'
import { QBtn } from 'quasar'

@Component({ inheritAttrs: false, components: { QBtn } })
export default class UiBtn extends Vue {
  @Prop({ type: String, default: () => 'primary' }) color?: string
  @Prop(String) size?: string
}
</script>
