"use client";
import { jsx } from "react/jsx-runtime";
import * as React from "react";
import { Image as ImageIcon } from "lucide-react";
import { buildAttachmentImageUrl } from "@open-mercato/core/modules/attachments/lib/imageUrls";
const IMAGE_SIZE = 96;
function ProductImageCell({ mediaId, mediaUrl, title, cropType = "cover" }) {
  const previewUrl = React.useMemo(() => {
    if (typeof mediaUrl === "string" && mediaUrl.trim().length > 0) return mediaUrl;
    if (typeof mediaId === "string" && mediaId.trim().length > 0) {
      return buildAttachmentImageUrl(mediaId, { width: IMAGE_SIZE, height: IMAGE_SIZE, cropType });
    }
    return null;
  }, [cropType, mediaId, mediaUrl]);
  if (!previewUrl) {
    return /* @__PURE__ */ jsx("div", { className: "flex h-16 w-16 items-center justify-center rounded-md border border-dashed text-muted-foreground", children: /* @__PURE__ */ jsx(ImageIcon, { className: "h-4 w-4", "aria-hidden": "true" }) });
  }
  return /* @__PURE__ */ jsx("div", { className: "flex h-16 w-16 items-center justify-center overflow-hidden rounded-md border bg-muted/30", children: /* @__PURE__ */ jsx(
    "img",
    {
      src: previewUrl,
      alt: title ?? "",
      className: `h-full w-full ${cropType === "contain" ? "object-contain" : "object-cover"}`
    }
  ) });
}
export {
  ProductImageCell
};
//# sourceMappingURL=ProductImageCell.js.map
