import React from 'react';
import { Q as QRCodeSVG } from './index-2ef835bd.js';

const QRCodeCard = ({
  userHandle,
  qrCodeValue,
  className,
  text = null
}) => {
  let textEl = null;
  if (typeof text === "string") {
    textEl = /* @__PURE__ */ React.createElement("p", { className: "flex items-center justify-center w-full text-xl text-black font-bold tracking-[9px]" }, text);
  } else {
    textEl = text;
  }
  return /* @__PURE__ */ React.createElement(
    "div",
    {
      className: `flex flex-col justify-center items-start pt-9 rounded-[20px] shadow-3xl max-w-[400px] bg-white relative pb-8 overflow-hidden ${className}`
    },
    qrCodeValue && /* @__PURE__ */ React.createElement("div", { className: "flex justify-center items-center w-full relative px-8 mb-5" }, /* @__PURE__ */ React.createElement("div", { className: "max-w-[90%] w-full h-auto relative" }, /* @__PURE__ */ React.createElement(
      QRCodeSVG,
      {
        className: "h-full w-full",
        value: qrCodeValue,
        "data-testid": "qrcode-card",
        bgColor: "transparent"
      }
    ))),
    userHandle && /* @__PURE__ */ React.createElement(
      "p",
      {
        className: "flex items-center justify-center text-center w-full mb-3 font-semibold text-lg text-gray-500",
        "data-testid": "qrcode-card-user-handle"
      },
      userHandle
    ),
    textEl
  );
};

export { QRCodeCard as Q };
//# sourceMappingURL=QRCodeCard-8f29c3c7.js.map
