<template>
  <div class="grid gap-y-8">
    <div class="flex items-end justify-between">
      <Example label="hover">
        <AisButton hover>Hover</AisButton>
      </Example>

      <Example label="hover fast">
        <AisButton variant="secondary" hover fast>Hover Fast</AisButton>
      </Example>

      <Example label="press">
        <AisButton press>Press</AisButton>
      </Example>

      <Example label="hover & press">
        <AisButton variant="secondary" hover fast press>Hover & Press</AisButton>
      </Example>
    </div>
  </div>
</template>

<script setup>
import AisButton from '@/components/button/AisButton.vue';
import Example from "@/components/docs/ComponentExample.vue";
</script>
