import React from 'react';
import { T as Trophy } from './Trophy-fc7fdec4.js';

const SmallAchievementCard = ({
  title = "Title Lorem Ipsum",
  thumbImgSrc,
  date = "Apr 20, 2022",
  showStatus = false,
  onClick = () => {
  }
}) => {
  const thumbClass = thumbImgSrc ? "bg-grayscale-50" : "bg-indigo-200";
  return /* @__PURE__ */ React.createElement(
    "button",
    {
      onClick,
      className: `flex-col shadow-[0_0_8px_0px_rgba(0,0,0,0.2)] relative $ py-[8px] px-[8px] w-[160px] h-[209px] rounded-[20px] rounded-square-card-container`
    },
    /* @__PURE__ */ React.createElement(
      "section",
      {
        className: `flex h-[110px] ${thumbClass} flex-col justify-center items-center w-full rounded-[20px]`
      },
      thumbImgSrc && /* @__PURE__ */ React.createElement(
        "img",
        {
          className: "h-full w-full object-contain",
          src: thumbImgSrc != null ? thumbImgSrc : "",
          alt: "Credential Achievement Image"
        }
      ),
      (!thumbImgSrc || thumbImgSrc === "") && /* @__PURE__ */ React.createElement(
        Trophy,
        {
          className: "achievement-placeholder-trophy flex p-[15px]",
          color: "#ffffff"
        }
      )
    ),
    /* @__PURE__ */ React.createElement("section", { className: "achievement-title w-full flex justify-center line-clamp-2" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm text-grayscale-900 font-bold mt-[10px] text-center" }, title)),
    /* @__PURE__ */ React.createElement("p", { className: "achievement-card-date mt-[5px] text-grayscale-500 text-[12px] w-full text-center" }, date),
    /* @__PURE__ */ React.createElement("section", { className: "achievement-card-footer" })
  );
};

export { SmallAchievementCard as S };
//# sourceMappingURL=SmallAchievementCard-24dfa453.js.map
