import type { ButtonHTMLAttributes } from "react";
import { cx } from "./utils";
import { Icon, type IconName } from "./Icon";

export type FabProps = ButtonHTMLAttributes<HTMLButtonElement> & {
  icon: IconName;
  label: string;
};

export function Fab({ icon, label, className, ...rest }: FabProps) {
  return (
    <button
      type="button"
      className={cx("mmg-fab", className)}
      aria-label={label}
      title={label}
      {...rest}
    >
      <Icon name={icon} size="lg" />
    </button>
  );
}