<script setup lang="ts">
import Button from 'primevue/button'

const props = withDefaults(defineProps<{
  label: string
  shortcut?: string
  variant?: 'primary' | 'secondary' | 'danger' | 'ghost'
  disabled?: boolean
  loading?: boolean
  title?: string
}>(), { variant: 'secondary' })

const emit = defineEmits<{ click: [MouseEvent] }>()
</script>

<template>
  <Button
    :label="shortcut ? `${label} ${shortcut}` : label"
    :disabled="disabled"
    :loading="loading"
    :title="title"
    :severity="variant === 'danger' ? 'danger' : undefined"
    :outlined="variant === 'secondary'"
    :text="variant === 'ghost'"
    @click="emit('click', $event)"
  />
</template>
