import { jsxs as p, jsx as o, Fragment as I } from "react/jsx-runtime";
import { aJ as z, aK as O, aL as E, aM as G, aF as W, aC as Z, z as h, B as D, aN as K, o as P, aO as $, aP as b, aD as v, aQ as H } from "./index-C62tPk5p.js";
import { memo as J, useState as M } from "react";
var k, _;
function Y() {
  if (_) return k;
  _ = 1;
  var s = Math.floor, l = Math.random;
  function a(i, r) {
    return i + s(l() * (r - i + 1));
  }
  return k = a, k;
}
var x, R;
function V() {
  if (R) return x;
  R = 1;
  var s = Y();
  function l(a, i) {
    var r = -1, t = a.length, m = t - 1;
    for (i = i === void 0 ? t : i; ++r < i; ) {
      var d = s(r, m), e = a[d];
      a[d] = a[r], a[r] = e;
    }
    return a.length = i, a;
  }
  return x = l, x;
}
var y, j;
function X() {
  if (j) return y;
  j = 1;
  var s = z(), l = V();
  function a(i) {
    return l(s(i));
  }
  return y = a, y;
}
var w, q;
function B() {
  if (q) return w;
  q = 1;
  var s = O();
  function l(a, i) {
    return s(i, function(r) {
      return a[r];
    });
  }
  return w = l, w;
}
var C, U;
function ee() {
  if (U) return C;
  U = 1;
  var s = B(), l = E();
  function a(i) {
    return i == null ? [] : s(i, l(i));
  }
  return C = a, C;
}
var L, T;
function te() {
  if (T) return L;
  T = 1;
  var s = V(), l = ee();
  function a(i) {
    return s(l(i));
  }
  return L = a, L;
}
var N, A;
function ie() {
  if (A) return N;
  A = 1;
  var s = X(), l = te(), a = G();
  function i(r) {
    var t = a(r) ? s : l;
    return t(r);
  }
  return N = i, N;
}
var re = ie();
const ae = /* @__PURE__ */ W(re), g = K("", {
  // Variants won't have any style by default. Style will only be applied if the variants are combined.
  // So, style is defined in compoundVariants.
  variants: {
    variant: {
      basic: "",
      ProfileCard: "",
      SidebarCard: "",
      NewLaunchSidebarCard: ""
    },
    structure: {
      image: "",
      card: "",
      title: "",
      description: ""
    }
  },
  compoundVariants: [
    // Style for Basic Variants types
    {
      variant: "basic",
      structure: "image",
      className: "w-10 h-auto"
    },
    {
      variant: "basic",
      structure: "card",
      className: "p-5 bg-default"
    },
    {
      variant: "basic",
      structure: "title",
      className: "text-base mt-4"
    },
    {
      variant: "basic",
      structure: "description",
      className: "text-sm leading-[18px] text-subtle font-normal"
    },
    // Style for ProfileCard Variant Types
    {
      variant: "ProfileCard",
      structure: "image",
      className: "w-9 h-auto rounded-full mb-4s"
    },
    {
      variant: "ProfileCard",
      structure: "card",
      className: "w-80 p-4 hover:bg-subtle bg-default"
    },
    {
      variant: "ProfileCard",
      structure: "title",
      className: "text-base"
    },
    {
      variant: "ProfileCard",
      structure: "description",
      className: "text-sm leading-[18px] text-subtle font-normal"
    },
    // Style for SidebarCard Variant Types
    {
      variant: "SidebarCard",
      structure: "image",
      className: "w-9 h-auto rounded-full mb-4s"
    },
    {
      variant: "SidebarCard",
      structure: "card",
      className: "w-full p-3 border border-subtle bg-default"
    },
    {
      variant: "SidebarCard",
      structure: "title",
      className: "text-sm font-cal"
    },
    {
      variant: "SidebarCard",
      structure: "description",
      className: "text-xs text-default line-clamp-2"
    },
    // Style for NewLaunchSidebarCard Variant Types
    {
      variant: "NewLaunchSidebarCard",
      structure: "image",
      className: "w-9 h-auto rounded-full mb-4s"
    },
    {
      variant: "NewLaunchSidebarCard",
      structure: "card",
      className: "w-full p-3 border border-subtle bg-launch-dark text-white"
    },
    {
      variant: "NewLaunchSidebarCard",
      structure: "title",
      className: "text-sm font-cal text-white"
    },
    {
      variant: "NewLaunchSidebarCard",
      structure: "description",
      className: "text-xs text-white"
    }
  ]
});
function se({
  image: s,
  title: l,
  icon: a,
  description: i,
  variant: r,
  actionButton: t,
  containerProps: m,
  imageProps: d,
  mediaLink: e,
  thumbnailUrl: n,
  learnMore: c,
  coverPhoto: u,
  buttonClassName: f,
  mediaLinkOnClick: F
}) {
  var S;
  const Q = (S = c == null ? void 0 : c.href) != null && S.startsWith("https") ? "a" : Z;
  return /* @__PURE__ */ p(
    "div",
    {
      className: h(
        m == null ? void 0 : m.className,
        "border-subtle text-default bg-default flex flex-col justify-between rounded-md border",
        g({ variant: r, structure: "card" })
      ),
      "data-testid": "card-container",
      ...m,
      children: [
        /* @__PURE__ */ p("div", { children: [
          a && a,
          s && /* @__PURE__ */ o(
            "img",
            {
              src: s,
              alt: d == null ? void 0 : d.alt,
              className: h(
                d == null ? void 0 : d.className,
                g({ variant: r, structure: "image" })
              ),
              ...d
            }
          ),
          /* @__PURE__ */ o(
            "h5",
            {
              title: l,
              className: h(
                "text-emphasis line-clamp-1 font-bold leading-5",
                g({ variant: r, structure: "title" })
              ),
              children: l
            }
          ),
          i && /* @__PURE__ */ o(
            "p",
            {
              title: i.toString(),
              className: h(g({ variant: r, structure: "description" }), "pt-1"),
              children: i
            }
          )
        ] }),
        r === "SidebarCard" && e && /* @__PURE__ */ p(
          "a",
          {
            onClick: F,
            target: "_blank",
            rel: "noreferrer noopener",
            href: e,
            "data-testid": t == null ? void 0 : t["data-testid"],
            className: "group relative my-3 flex aspect-video items-center overflow-hidden rounded",
            children: [
              /* @__PURE__ */ o("div", { className: "absolute inset-0 bg-black/50 transition group-hover:bg-black/40" }),
              /* @__PURE__ */ p(
                "svg",
                {
                  className: "text-inverted absolute left-1/2 top-1/2 h-8 w-8 -translate-x-1/2 -translate-y-1/2 transform rounded-full shadow-lg transition-all hover:-mt-px",
                  viewBox: "0 0 32 32",
                  fill: "none",
                  xmlns: "http://www.w3.org/2000/svg",
                  children: [
                    /* @__PURE__ */ o(
                      "path",
                      {
                        d: "M16 32C24.8366 32 32 24.8366 32 16C32 7.16344 24.8366 0 16 0C7.16344 0 0 7.16344 0 16C0 24.8366 7.16344 32 16 32Z",
                        fill: "white"
                      }
                    ),
                    /* @__PURE__ */ o(
                      "path",
                      {
                        d: "M12.1667 8.5L23.8334 16L12.1667 23.5V8.5Z",
                        fill: "#111827",
                        stroke: "#111827",
                        strokeWidth: "1.5",
                        strokeLinecap: "round",
                        strokeLinejoin: "round"
                      }
                    )
                  ]
                }
              ),
              /* @__PURE__ */ o("img", { alt: "play feature video", src: n })
            ]
          }
        ),
        r === "NewLaunchSidebarCard" && u && /* @__PURE__ */ o("img", { alt: "cover", className: "mt-3 w-full", src: u }),
        r === "basic" && t && /* @__PURE__ */ o("div", { children: /* @__PURE__ */ o(
          D,
          {
            color: "secondary",
            href: t == null ? void 0 : t.href,
            className: "mt-10",
            EndIcon: "arrow-right",
            "data-testid": t["data-testid"],
            children: t == null ? void 0 : t.child
          }
        ) }),
        (r === "SidebarCard" || r === "NewLaunchSidebarCard") && /* @__PURE__ */ p("div", { className: "mt-2 flex items-center justify-between", children: [
          c && /* @__PURE__ */ o(I, { children: c.href ? /* @__PURE__ */ o(
            Q,
            {
              href: c.href,
              target: "_blank",
              rel: "noreferrer",
              onClick: c.onClick,
              className: h("text-default text-xs font-medium cursor-pointer", f),
              children: c.text
            }
          ) : c.onClick ? /* @__PURE__ */ o(
            "button",
            {
              type: "button",
              color: "minimal",
              onClick: c.onClick,
              className: h("cursor-pointer text-default text-xs font-medium", f),
              children: c.text
            }
          ) : void 0 }),
          (t == null ? void 0 : t.child) && /* @__PURE__ */ o(
            "button",
            {
              className: h(
                "text-default hover:text-emphasis p-0 text-xs font-normal cursor-pointer",
                f
              ),
              color: "minimal",
              "data-testid": t == null ? void 0 : t["data-testid"],
              onClick: t == null ? void 0 : t.onClick,
              children: t == null ? void 0 : t.child
            }
          )
        ] })
      ]
    }
  );
}
function oe() {
  const { t: s } = P(), l = $((e) => e.open), i = [...ae([
    {
      id: 18,
      thumbnailUrl: "https://img.youtube.com/vi/J8HsK-8W39U/0.jpg",
      mediaLink: "https://go.cal.com/rbac-video",
      title: "Roles & Permissions",
      description: "Manage team access with roles & permissions",
      onClick: () => l(H.RolesAndPermissions)
    },
    {
      id: 17,
      thumbnailUrl: "https://img.youtube.com/vi/fMHW6jYPIb8/0.jpg",
      mediaLink: "https://go.cal.com/embed-video",
      title: "Embed",
      description: "Embed your booking page on your website",
      href: "https://go.cal.com/embed-video"
    },
    {
      id: 16,
      thumbnailUrl: "https://img.youtube.com/vi/xopxmk2H4Ng/0.jpg",
      mediaLink: "https://go.cal.com/paid-booking",
      title: "Paid Bookings",
      description: "Charge for your time with Cal.com's paid bookings",
      href: "https://go.cal.com/paid-booking"
    },
    {
      id: 15,
      thumbnailUrl: "https://img.youtube.com/vi/ZjSD1yPgLLQ/0.jpg",
      mediaLink: "https://go.cal.com/instant-meetings-video",
      title: "Instant Meetings",
      description: "Book meetings instantly with a link",
      href: "https://go.cal.com/instant-meetings-video"
    },
    {
      id: 14,
      thumbnailUrl: "https://img.youtube.com/vi/IZ4-nUiIpvY/0.jpg",
      mediaLink: "https://go.cal.com/custom-attributes",
      title: "Custom Attributes",
      description: "Define roles and attributes for your teams",
      href: "https://go.cal.com/custom-attributes"
    },
    {
      id: 13,
      thumbnailUrl: "https://img.youtube.com/vi/TTAASLLPKk0/0.jpg",
      mediaLink: "https://go.cal.com/ooo-video",
      title: "ooo.new",
      description: "Easily go out-of-office",
      href: "https://go.cal.com/ooo-video"
    },
    {
      id: 12,
      thumbnailUrl: "https://cal.com/og-image-cal-ai.jpg",
      mediaLink: "https://go.cal.com/cal-ai",
      title: "Cal.ai",
      description: "Your personal AI scheduling assistant",
      href: "https://go.cal.com/cal-ai"
    },
    {
      id: 11,
      thumbnailUrl: "https://img.youtube.com/vi/KTg_qzA9NEc/0.jpg",
      mediaLink: "https://go.cal.com/insights",
      title: "Insights",
      description: "Get a better understanding of your business",
      href: "https://go.cal.com/insights"
    },
    {
      id: 10,
      thumbnailUrl: "https://img.youtube.com/vi/jvaBafzVUQc/0.jpg",
      mediaLink: "https://go.cal.com/video",
      title: "Cal Video",
      description: "Free video conferencing with recording",
      href: "https://go.cal.com/video"
    },
    {
      id: 9,
      thumbnailUrl: "https://img.youtube.com/vi/93iOmzHieCU/0.jpg",
      mediaLink: "https://go.cal.com/round-robin",
      title: "Round-Robin",
      description: "Create advanced group meetings with round-robin",
      href: "https://go.cal.com/round-robin"
    },
    {
      id: 8,
      thumbnailUrl: "https://img.youtube.com/vi/piKlAiibAFo/0.jpg",
      mediaLink: "https://go.cal.com/workflows",
      title: "Automate Workflows",
      description: "Make time work for you and automate tasks",
      href: "https://go.cal.com/workflows"
    },
    {
      id: 7,
      thumbnailUrl: "https://img.youtube.com/vi/UVXgo12cY4g/0.jpg",
      mediaLink: "https://go.cal.com/routing-forms",
      title: "Routing Forms",
      description: "Ask questions and route to the correct person",
      href: "https://go.cal.com/routing-forms"
    },
    {
      id: 6,
      thumbnailUrl: "https://img.youtube.com/vi/yGiZo1Ry5-8/0.jpg",
      mediaLink: "https://go.cal.com/recurring-video",
      title: "Recurring Bookings",
      description: "Learn how to create a recurring schedule",
      href: "https://go.cal.com/recurring-video"
    },
    {
      id: 5,
      thumbnailUrl: "https://img.youtube.com/vi/0v_nQtpxC_4/0.jpg",
      mediaLink: "https://go.cal.com/payments-video",
      title: "Accept Payments",
      description: "Charge for your time with Cal.com's Stripe App",
      href: "https://app.cal.com/apps/stripe"
    },
    {
      id: 4,
      thumbnailUrl: "https://img.youtube.com/vi/zGr_s-fG84k/0.jpg",
      mediaLink: "https://go.cal.com/confirmation-video",
      title: "Requires Confirmation",
      description: "Learn how to be in charge of your bookings",
      href: "https://cal.com/resources/feature/opt-in"
    },
    {
      id: 3,
      thumbnailUrl: "https://img.youtube.com/vi/-L8MCiT6uhQ/0.jpg",
      mediaLink: "https://youtu.be/-L8MCiT6uhQ?si=DRJzRNhN85hqAwBl",
      title: "Routing Forms, Workflows",
      description: "Ask screening questions of potential bookers to connect them with the right person",
      href: "https://youtu.be/-L8MCiT6uhQ?si=DRJzRNhN85hqAwBl"
    },
    {
      id: 2,
      thumbnailUrl: "https://img.youtube.com/vi/EAc46SPL6iA/0.jpg",
      mediaLink: "https://go.cal.com/teams-video",
      title: "How to set up Teams",
      description: "Learn how to use round-robin and collective events.",
      href: "https://cal.com/teams"
    },
    {
      id: 1,
      thumbnailUrl: "https://img.youtube.com/vi/VZ5PfQzzxBw/0.jpg",
      mediaLink: "https://youtu.be/VZ5PfQzzxBw?si=oB0LPSxG8dWIwg5a",
      title: "Dynamic booking links",
      description: "Booking link that allows people to quickly schedule meetings.",
      href: "https://youtu.be/VZ5PfQzzxBw?si=oB0LPSxG8dWIwg5a"
    }
  ]).slice(0).reverse()], [r, t] = M(() => {
    if (typeof window > "u")
      return i;
    try {
      const e = b.getItem("removedTipsIds");
      if (e !== null) {
        const n = e.split(",").map((u) => parseInt(u, 10));
        return i.filter((u) => n.indexOf(u.id) === -1);
      } else
        return i;
    } catch {
      return i;
    }
  }), m = (e) => {
    t((n) => {
      const c = b.getItem("removedTipsIds") || "", u = n.findIndex((f) => f.id === e);
      return u === -1 ? [...n] : (b.setItem(
        "removedTipsIds",
        `${n[u].id.toString()}${c.length > 0 ? `,${c}` : ""}`
      ), n.splice(u, 1), [...n]);
    });
  }, d = r.slice(0).reverse();
  return /* @__PURE__ */ o(I, { children: /* @__PURE__ */ o(
    "div",
    {
      className: "hidden pb-4 pt-8 lg:grid",
      style: {
        gridTemplateColumns: "1fr"
      },
      children: r.map((e) => {
        const n = d.indexOf(e) === 0;
        return /* @__PURE__ */ o(
          "div",
          {
            className: "relative",
            style: {
              gridRowStart: 1,
              gridColumnStart: 1
            },
            children: /* @__PURE__ */ o(
              "div",
              {
                className: "relative",
                style: {
                  transform: `scale(${1 - d.indexOf(e) / 20})`,
                  top: -d.indexOf(e) * 10,
                  opacity: `${1 - d.indexOf(e) / 7}`
                },
                children: /* @__PURE__ */ o(
                  se,
                  {
                    variant: e.variant ?? "SidebarCard",
                    thumbnailUrl: e.thumbnailUrl,
                    coverPhoto: e.coverPhoto,
                    mediaLink: n ? e.mediaLink : void 0,
                    mediaLinkOnClick: n ? () => {
                      v.capture("tip_video_clicked", e), e.onClick && e.onClick();
                    } : void 0,
                    title: s(e.title),
                    description: s(e.description),
                    learnMore: n ? {
                      href: e.href,
                      text: s("learn_more"),
                      onClick: () => {
                        v.capture("tip_learn_more_clicked", e), e.onClick && e.onClick();
                      }
                    } : void 0,
                    actionButton: n ? {
                      onClick: () => {
                        v.capture("tip_dismiss_clicked", e), m(e.id);
                      },
                      child: s("dismiss")
                    } : void 0,
                    containerProps: {
                      tabIndex: n ? void 0 : -1,
                      "aria-hidden": n ? void 0 : "true"
                    }
                  }
                )
              }
            )
          },
          e.id
        );
      })
    }
  ) });
}
const ce = J(oe);
export {
  ce as default
};
