---
// Copyright © onWidget <https://github.com/onwidget>
// SPDX-License-Identifier: MIT
import { Icon } from "astro-icon/components";
import { twMerge } from "tailwind-merge";
import type { CallToAction as Props } from "~/types";

const {
    variant = "secondary",
    target,
    text = Astro.slots.render("default"),
    icon = "",
    class: className = "",
    type,
    ...rest
} = Astro.props;

const variants = {
    primary: "btn-primary",
    secondary: "btn-secondary",
    tertiary: "btn btn-tertiary",
    link: "cursor-pointer hover:text-primary",
};
---

{
  type === 'button' || type === 'submit' || type === 'reset' ? (
    <button type={type} class={twMerge(variants[variant] || '', className)} {...rest}>
      <Fragment set:html={text} />
      {icon && <Icon name={icon} class="w-5 h-5 ml-1 -mr-1.5 rtl:mr-1 rtl:-ml-1.5 inline-block" />}
    </button>
  ) : (
    <a
      class={twMerge(variants[variant] || '', className)}
      {...(target ? { target: target, rel: 'noopener noreferrer' } : {})}
      {...rest}
    >
      <Fragment set:html={text} />
      {icon && <Icon name={icon} class="w-5 h-5 ml-1 -mr-1.5 rtl:mr-1 rtl:-ml-1.5 inline-block" />}
    </a>
  )
}
