//! add object called __clubEmbed with all the variables inside
let e = null, S = !1, y = null;
const P = ["lovehoney", "twopagescurtains"];
let p = null, g = "drawer", h = null;
const U = () => {
const t = document.createElement("style");
t.textContent = `
.club-badge {
display: flex;
align-items: center;
gap: 4px;
padding: 12px;
border-radius: 8px;
cursor: pointer;
font-weight: 500;
transition: background-color 0.3s ease;
border:none;
width: 100%;
}
.club-badge-text {
flex: 1;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.club-badge.dark {
background-color: black;
color: white;
}
.club-badge.light {
background-color: white;
color: black;
border: 1px solid #ddd;
}
.club-badge.xSmall {
height: 28px;
font-size: 12px;
}
.club-badge.small {
height: 32px;
font-size: 14px;
}
.club-badge.medium {
height: 40px;
font-size: 14px;
}
.club-badge.large {
height: 48px;
font-size: 16px;
}
.club-drawer-backdrop {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(16, 24, 40, 0.50);
z-index: 2147483647;
transition: opacity 0.3s ease;
opacity: 0;
display: none;
}
.club-drawer-backdrop.open {
display: block;
}
.club-drawer-backdrop.open.slide-in {
opacity: 1;
}
.club-drawer {
position: fixed;
border-radius: 24px;
overflow: hidden;
top: 24px;
right: 24px;
width: 450px;
height: calc(100% - 48px);
background: white;
box-shadow: -4px 0 6px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease;
z-index: 1;
transform: translateX(100%);
display: flex;
flex-direction: column;
@media (max-width: 540px) {
top: 0;
right: 0;
width: 100%;
height: 100%;
border-radius: 0;
}
}
.club-drawer-backdrop.open.slide-in .club-drawer {
transform: translateX(0);
}
/* Modal view — centered overlay instead of right-side drawer */
.club-drawer-backdrop.modal .club-drawer {
top: 50%;
left: 50%;
right: auto;
transform: translate(-50%, -50%) scale(0.95);
opacity: 0;
transition: transform 0.25s ease, opacity 0.25s ease;
width: 750px;
height: min(550px, calc(100% - 48px));
border-radius: 24px;
@media (max-width: 750px) {
width: calc(100% - 20px);
max-height: calc(100% - 20px);
border-radius: 24px;
}
}
.club-drawer-backdrop.modal.open.slide-in .club-drawer {
transform: translate(-50%, -50%) scale(1);
opacity: 1;
@media (max-width: 750px) {
transform: translate(-50%, -50%) scale(1);
}
}
/* Modal view: hide native drawer header and close button */
.club-drawer-backdrop.modal .club-drawer-header {
display: none !important;
}
.club-drawer-backdrop.modal .club-close-drawer {
display: none !important;
}
/* Fullscreen modal — desktop only. Mobile keeps the standard modal styling. */
@media (min-width: 668px) {
.club-drawer-backdrop.modal.fullscreen .club-drawer {
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
max-height: 100%;
border-radius: 0;
transform: scale(0.98);
}
.club-drawer-backdrop.modal.fullscreen.open.slide-in .club-drawer {
transform: scale(1);
}
}
/* Instant switch from modal to drawer — no animation */
.club-drawer-backdrop.no-animate .club-drawer {
transition: none !important;
}
.club-drawer-backdrop.no-animate {
transition: none !important;
}
.club-close-drawer {
position: absolute;
top: 43px;
right: calc(24px + 19px + 450px);
width: 40px;
height: 40px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 24px;
background: rgba(255, 255, 255, 0.60);
border: none;
color: black;
cursor: pointer;
z-index: 2;
padding: 0 !important;
@media (max-width: 540px) {
display: none;
}
}
.club-drawer-header {
height: 44px;
display: none;
align-items: center;
justify-content: center;
background-color: white;
color: #060708;
position: relative;
@media (max-width: 540px) {
display: flex;
}
}
.club-close-drawer-header {
position: absolute;
width: 40px;
height: 40px;
top: 0px;
right: 5px;
font-size: 24px;
border: none;
color: #060708;
cursor: pointer;
background: transparent;
}
#club-iframe-container {
flex: 1;
}
.club-drawer .club-drawer-content{
height: 100%;
display: flex;
flex-direction: column;
}
.club-drawer .club-drawer-content .club-modal-container {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
align-items: center;
justify-content: center;
background: rgba(16, 24, 40, 0.50);
z-index: 2;
display: none;
}
.club-drawer .club-drawer-content .club-modal-container.open {
display: flex;
}
.club-modal-container .club-modal{
border-radius: 16px;
background: white;
box-shadow: 0px 0px 1px 0px rgba(16, 18, 20, 0.20), 0px 8px 12px 0px rgba(16, 18, 20, 0.15);
padding: 32px;
padding-top: 24px;
display: flex;
flex-direction: column;
align-items: center;
box-sizing: border-box;
}
.club-modal-container .club-modal h4 {
font-size: 24px;
font-weight: 600;
line-height: 28px;
letter-spacing: 0.25px;
font-family: 'Inter Tight', sans-serif;
margin:0px;
}
.club-button {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
font-family: 'Inter Tight', sans-serif;
font-size: 14px;
font-weight: 500;
line-height: 16px;
letter-spacing: 0.25px;
padding: 12px 16px;
border: none;
cursor: pointer;
flex:1;
text-decoration: none;
}
.club-button.primary {
background-color: #6131C4;
color: white;
border-radius: 12px;
}
.club-button.subtle {
background-color: transparent;
color: #69727A;
}
.club-tabs {
padding: 4px;
border-radius: 8px;
border: 1px solid #DDE4EC;
background-color: white;
display: flex;
gap: 4px;
}
.club-tabs .club-tab {
color:#475059;
padding: 8px;
background-color: transparent;
}
.club-tabs .club-tab.selected {
color: #6131C4;
background-color: #F7F8F9;
}
.club-links-container {
background-color: white ;
border-radius: 16px;
box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.04);
}
.club-links-container .club-links {
display: none;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 4px;
}
.club-links-container .club-links.visible {
display: flex;
}
.club-links-container .club-links .club-qr-code{
@media (max-width: 540px) {
display: none;
}
}
#club-download-app-box .club-modal{
@media (max-width: 540px) {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
}
`, document.head.appendChild(t);
const o = document.createElement("link");
o.rel = "stylesheet", o.href = "https://fonts.googleapis.com/css2?family=Inter+Tight:wght@100;200;300;400;500;600;700;800;900&display=swap", document.head.appendChild(o);
}, D = () => {
var t, o, i;
try {
const a = new URL("https://react-club-app.club.co/").origin, l = document.createElement("link");
l.rel = "preconnect", l.href = a, l.crossOrigin = "anonymous";
const n = document.createElement("link");
n.rel = "dns-prefetch", n.href = a;
const r = (t = document.head) == null ? void 0 : t.firstChild;
r ? (document.head.insertBefore(l, r), document.head.insertBefore(n, r)) : ((o = document.head) == null || o.appendChild(l), (i = document.head) == null || i.appendChild(n));
} catch {
}
}, z = (t) => {
switch (t) {
case "xSmall":
case "small":
return "16px";
case "medium":
return "18px";
case "large":
return "20px";
default:
return "18px";
}
}, H = (t) => {
const o = (t == null ? void 0 : t.getAttribute("data-brand-name")) || "", i = t == null ? void 0 : t.getAttribute("data-badge-size"), a = t == null ? void 0 : t.getAttribute("data-badge-color"), l = (t == null ? void 0 : t.getAttribute("data-badge-text")) || "Join our community", n = z(i), r = `
`;
return { brandName: o, badgeText: l, badgeSize: i, badgeColor: a, badgeIcon: r };
}, f = (t, o, i, a) => {
if (!S || y !== t) {
const l = e == null ? void 0 : e.querySelector("#club-iframe-container");
if (l) {
l.innerHTML = "", h = document.createElement("iframe");
let n = `https://react-club-app.club.co/?func=embed&alias=${encodeURIComponent(t)}`;
o && (n += `&intent_id=${encodeURIComponent(o)}`), a && (n += `&token=${encodeURIComponent(a)}`), i && (n += `&mode=${encodeURIComponent(i.mode)}`, i.discountCode && (n += `&discount_code=${encodeURIComponent(i.discountCode)}`), n += `&discount_pct=${i.discountPct}`, i.phoneRequired && (n += "&phone_required=1"), i.privacyPolicyUrl && (n += `&privacy_policy_url=${encodeURIComponent(i.privacyPolicyUrl)}`), i.scratchToReveal && (n += "&scratch_to_reveal=1"), i.coverOffset && (n += `&cover_offset=${encodeURIComponent(i.coverOffset)}`), i.fullscreen && (n += "&fullscreen=1"), i.designMode && (n += "&design_mode=1")), h.src = n, h.style.cssText = "width: 100%; height: 100%; border: none;", h.allow = "clipboard-read; clipboard-write", l.appendChild(h), S = !0, y = t;
}
}
}, F = () => {
var o;
p = document.querySelector('meta[name="viewport"]');
const t = document.createElement("meta");
t.name = "viewport", t.content = "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no", t.id = "club-viewport-meta-tag", document.head.appendChild(t), p && ((o = p.parentNode) == null || o.removeChild(p));
}, O = () => {
var o;
const t = document.querySelector('meta[name="viewport"]');
t && ((o = t.parentNode) == null || o.removeChild(t)), p && document.head.appendChild(p);
}, j = (t) => {
const o = t.getAttribute("data-custom") === "true", i = H(t);
let a;
if (o) {
if (a = t.querySelector(":first-child"), !a) {
console.error("Embed Script: Missing custom button element.");
return;
}
} else
a = document.createElement("button"), a.className = `club-badge ${i.badgeColor} ${i.badgeSize}`, a.innerHTML = `${i.badgeIcon} ${i.badgeText}`, a.setAttribute("title", i.badgeText), t.appendChild(a);
a.addEventListener("click", () => {
w(), k();
const l = t.getAttribute("data-intentid"), n = new URL(window.location.href);
n.searchParams.set("club", i.brandName), l && n.searchParams.set("intentid", l), window.history.pushState({}, "", n), f(i.brandName, l);
});
}, w = () => {
if (e) return e;
e = document.createElement("div"), e.className = "club-drawer-backdrop";
const t = `
Boost rewards &
enable payouts
`, o = `
Download the Club app!
`;
function i() {
const d = navigator.userAgent || navigator.vendor;
return /android/i.test(d) ? "android" : /iPad|iPhone|iPod/.test(d) ? "ios" : "other";
}
e.innerHTML = `
`, document.body.appendChild(e), e.querySelector("#club-close-drawer").addEventListener("click", _), e.querySelector("#club-close-drawer-header").addEventListener("click", _), e.querySelector(
"#club-close-confirmation-modal-button"
).addEventListener("click", () => {
const d = e == null ? void 0 : e.querySelector(
"#club-close-confirmation-box"
);
d == null || d.classList.remove("open");
});
const r = e.querySelector("#club-download-app"), s = e == null ? void 0 : e.querySelector("#club-download-app-box");
r.addEventListener("click", () => {
s.classList.add("open");
}), (e == null ? void 0 : e.querySelector(
"#club-download-app-close-box"
)).addEventListener("click", () => {
s.classList.remove("open");
}), e.querySelector("#club-back-to-website").addEventListener("click", M);
const b = e.querySelector("#club-ios-app-tab"), m = e.querySelector("#club-android-app-tab"), C = e == null ? void 0 : e.querySelector("#club-ios-links"), v = e == null ? void 0 : e.querySelector("#club-android-links");
return b.addEventListener("click", () => {
b.classList.add("selected"), m.classList.remove("selected"), C.classList.add("visible"), v.classList.remove("visible");
}), m.addEventListener("click", () => {
m.classList.add("selected"), b.classList.remove("selected"), C.classList.remove("visible"), v.classList.add("visible");
}), e;
}, _ = () => {
if (y && P.includes(y)) {
M();
return;
}
const t = e == null ? void 0 : e.querySelector(
"#club-close-confirmation-box"
);
t && t.classList.add("open");
}, I = (t) => {
var i, a, l;
const o = (i = t.data) == null ? void 0 : i.event;
if (o === "clubAppDiscountCode") {
const n = (a = t.data) == null ? void 0 : a.discountCode;
n && (document.cookie = `discount_code=${encodeURIComponent(n)}; path=/; max-age=${60 * 60 * 24 * 30}`);
} else if (o === "clubAppSwitchView") {
const n = (l = t.data) == null ? void 0 : l.view;
(n === "drawer" || n === "modal") && V(n);
} else if (o === "clubAppClose")
M();
else if (o === "clubRequestParentUrl") {
const n = t.source;
n == null || n.postMessage({ event: "clubParentUrl", url: window.location.href }, "*");
}
}, V = (t) => {
!e || g === t || (e.classList.add("no-animate"), e.classList.remove("slide-in"), g === "modal" && e.classList.remove("modal"), t === "modal" ? e.classList.add("modal") : e.classList.remove("fullscreen"), g = t, e.offsetHeight, e.classList.add("slide-in"), requestAnimationFrame(() => {
e == null || e.classList.remove("no-animate");
}));
}, M = () => {
window.removeEventListener("message", I);
const t = e == null ? void 0 : e.querySelector(
"#club-close-confirmation-box"
);
t == null || t.classList.remove("open"), e == null || e.classList.remove("slide-in");
const o = new URL(window.location.href);
o.searchParams.delete("club"), o.searchParams.delete("intentid"), window.history.pushState({}, "", o), window.innerWidth < 540 && O(), setTimeout(() => {
e && (e.classList.remove("open"), e.classList.remove("modal"), e.classList.remove("fullscreen"), g = "drawer"), S = !1;
}, 300);
}, k = (t = "drawer", o) => {
e && (g = t, t === "modal" ? (e.classList.add("modal"), e.classList.toggle("fullscreen", (o == null ? void 0 : o.fullscreen) === !0)) : (e.classList.remove("modal"), e.classList.remove("fullscreen")), window.innerWidth < 540 && F(), e.classList.add("open"), setTimeout(() => {
e == null || e.classList.add("slide-in");
}, 100), window.addEventListener("message", I));
}, R = () => {
U(), document.querySelectorAll('[data-club-embed="true"]').forEach((c) => {
if (!c.getAttribute("data-brand-name")) {
console.error('Embed Script: Missing "data-brand-name" attribute on container.');
return;
}
j(c);
});
const o = new URL(window.location.href), i = o.searchParams.get("club"), a = o.searchParams.get("intentid"), n = window.location.hash.match(/(?:^|[#&])token=([^&]+)/), r = n ? decodeURIComponent(n[1]) : null;
r && window.history.replaceState({}, "", o.pathname + o.search), i && (w(), k(), f(i, a, void 0, r));
const s = document.querySelector("#club-signup-config");
if (s) {
const c = s.getAttribute("data-brand-name") || "", x = s.getAttribute("data-intentid") || null, b = s.getAttribute("data-signup-discount-code") || null, m = parseInt(
s.getAttribute("data-signup-discount-pct") || "10",
10
), C = s.getAttribute("data-signup-phone-required") === "true", v = s.getAttribute("data-signup-privacy-policy-url"), d = s.getAttribute("data-signup-scratch-to-reveal") === "true", $ = s.getAttribute("data-signup-cover-offset") || null, B = s.getAttribute("data-signup-fullscreen") === "true", L = s.getAttribute("data-signup-design-mode") === "true", A = `club_signup_shown_${c}`;
if (c && (L || !localStorage.getItem(A))) {
const q = {
mode: "signup",
discountCode: b,
discountPct: m,
phoneRequired: C,
privacyPolicyUrl: v,
scratchToReveal: d,
coverOffset: $,
fullscreen: B,
designMode: L
}, T = () => {
e != null && e.classList.contains("open") || (w(), f(c, x, q));
}, u = navigator.connection;
if (!(u != null && u.saveData || (u == null ? void 0 : u.effectiveType) === "slow-2g")) {
const E = () => {
"requestIdleCallback" in window ? requestIdleCallback(T, { timeout: 2e3 }) : setTimeout(T, 200);
};
document.readyState === "complete" ? E() : window.addEventListener("load", E, { once: !0 });
}
setTimeout(() => {
e != null && e.classList.contains("open") || (L || localStorage.setItem(A, "1"), w(), f(c, x, q), k("modal", { fullscreen: B }));
}, 5e3);
}
}
}, N = (t, o) => {
if (!t) {
console.error("openClubDrawer: brand name is required.");
return;
}
w(), k();
const i = new URL(window.location.href);
i.searchParams.set("club", t), o ? i.searchParams.set("intentid", o) : i.searchParams.delete("intentid"), window.history.pushState({}, "", i), f(t, o);
};
D();
window.setupClubEmbed = R;
window.openClubDrawer = N;
document.addEventListener("DOMContentLoaded", R);
export {
R as setupClubEmbed
};
