import { jsx as e, jsxs as r } from "react/jsx-runtime";
import { c as a } from "../../../index-UgeK3A8s.js";
import { Info as d } from "lucide-react";
import { cn as l } from "../../../lib/utils.js";
import { Badge as s } from "./badge.js";
import { MobileTooltipProvider as c, MobileTooltip as m, MobileTooltipTrigger as p, MobileTooltipContent as g } from "./mobile-tooltip.js";
const h = a(
  "cursor-pointer gap-1.5 rounded-md border-0 bg-gradient-to-br from-emerald-600 to-emerald-800 font-semibold text-white uppercase tracking-wide shadow-md transition-opacity hover:opacity-80",
  {
    variants: {
      size: {
        default: "px-2 py-0.5 text-[0.725rem] leading-4 [&>svg]:h-3 [&>svg]:w-3",
        md: "px-2.5 py-1 text-sm [&>svg]:h-3.5 [&>svg]:w-3.5"
      }
    },
    defaultVariants: {
      size: "default"
    }
  }
);
function w({
  className: o,
  size: i,
  showInfoIcon: t = !0,
  delay: n = 350
}) {
  return /* @__PURE__ */ e(c, { delay: n, children: /* @__PURE__ */ r(m, { children: [
    /* @__PURE__ */ r(
      p,
      {
        render: /* @__PURE__ */ e(s, { className: l(h({ size: i }), o) }),
        children: [
          /* @__PURE__ */ e("span", { children: "BYOC" }),
          t && /* @__PURE__ */ e(d, {})
        ]
      }
    ),
    /* @__PURE__ */ e(g, { children: /* @__PURE__ */ r("p", { children: [
      "Bring Your Own Credentials",
      " ",
      /* @__PURE__ */ e(
        "a",
        {
          className: "underline hover:no-underline",
          href: "https://docs.arcade.dev/home/glossary#bring-your-own-credentials-byoc",
          rel: "noopener noreferrer",
          target: "_blank",
          children: "Learn more"
        }
      )
    ] }) })
  ] }) });
}
export {
  w as ByocBadge
};
