<script setup lang="ts">
import { AlertDialogCancel, type AlertDialogCancelProps } from 'radix-vue'
import { cn } from '@/lib/utils'

const props = defineProps<AlertDialogCancelProps & { class?: string }>()
</script>

<template>
  <AlertDialogCancel
    v-bind="props"
    :class="cn(
      'inline-flex items-center justify-center rounded border border-input bg-background ring-offset-background transition-colors hover:bg-accent hover:text-accent-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 mt-2 sm:mt-0 uppercase',
      props.class,
    )"
    style="font-weight: 500; font-size: 13px; line-height: 18px; padding: 4px 8px;"
  >
    <slot />
  </AlertDialogCancel>
</template>
