---
import type { HTMLAttributes } from "astro/types";

type Props = { disabled?: boolean } & HTMLAttributes<"a">;

const { disabled, class: className, ...attrs } = Astro.props;

const Button = disabled ? "span" : "a";
---

<Button
  aria-disabled={disabled}
  class:list={[
    "group inline-flex items-center gap-1",
    { "hover:text-accent": !disabled },
    className,
  ]}
  {...attrs}
>
  <slot />
</Button>
