// src/components/templates/recipes/RecipeCard.tsx
import { Heart } from "lucide-react";
import { jsx, jsxs } from "react/jsx-runtime";
function RecipeCard({
  recipe,
  onSelect,
  onToggleFavorite
}) {
  return /* @__PURE__ */ jsxs("button", {
    type: "button",
    onClick: () => onSelect?.(recipe),
    className: "border-border bg-card flex flex-col gap-3 rounded-2xl border text-left transition hover:border-violet-400",
    children: [
      recipe.heroImageUrl ? /* @__PURE__ */ jsx("img", {
        src: recipe.heroImageUrl,
        alt: recipe.name,
        className: "h-40 w-full rounded-t-2xl object-cover"
      }) : /* @__PURE__ */ jsx("div", {
        className: "bg-muted h-40 rounded-t-2xl"
      }),
      /* @__PURE__ */ jsxs("div", {
        className: "space-y-2 p-4",
        children: [
          /* @__PURE__ */ jsxs("div", {
            className: "flex items-center justify-between",
            children: [
              /* @__PURE__ */ jsx("p", {
                className: "text-base font-semibold",
                children: recipe.name
              }),
              /* @__PURE__ */ jsx("button", {
                type: "button",
                className: `inline-flex items-center justify-center rounded-full border border-transparent p-2 ${recipe.isFavorite ? "text-red-400" : "text-muted-foreground hover:text-red-400"}`,
                onClick: (event) => {
                  event.stopPropagation();
                  onToggleFavorite?.(recipe);
                },
                children: /* @__PURE__ */ jsx(Heart, {
                  className: `h-4 w-4 ${recipe.isFavorite ? "fill-red-400" : ""}`
                })
              })
            ]
          }),
          /* @__PURE__ */ jsx("p", {
            className: "text-muted-foreground line-clamp-2 text-sm",
            children: recipe.description
          }),
          /* @__PURE__ */ jsxs("div", {
            className: "text-muted-foreground flex flex-wrap gap-3 text-xs",
            children: [
              recipe.prepTimeMinutes ? /* @__PURE__ */ jsxs("span", {
                children: [
                  "Prep ",
                  recipe.prepTimeMinutes,
                  "m"
                ]
              }) : null,
              recipe.cookTimeMinutes ? /* @__PURE__ */ jsxs("span", {
                children: [
                  "Cook ",
                  recipe.cookTimeMinutes,
                  "m"
                ]
              }) : null,
              recipe.servings ? /* @__PURE__ */ jsxs("span", {
                children: [
                  recipe.servings,
                  " servings"
                ]
              }) : null
            ]
          })
        ]
      })
    ]
  });
}
export {
  RecipeCard
};
