commerce/components/cart/delete-item-button.tsx
2025-03-15 11:15:46 +00:00

29 lines
668 B
TypeScript

"use client";
import { XMarkIcon } from "@heroicons/react/24/outline";
import clsx from "clsx";
import { CartItem } from "lib/store/types";
export function DeleteItemButton({
item,
onClick,
}: {
item: CartItem;
onClick: () => void;
}) {
return (
<button
aria-label="Remove cart item"
onClick={onClick}
className={clsx(
"ease flex h-[17px] w-[17px] items-center justify-center rounded-full bg-neutral-500 transition-all duration-200",
{
"hover:bg-neutral-800": true,
}
)}
>
<XMarkIcon className="hover:text-accent-3 mx-[1px] h-4 w-4 text-white dark:text-black" />
</button>
);
}