docthub-core-components 3.2.1 → 3.2.3

package/dist/components/overrides/ui/login-dialog/login-dialog.js

@@ -0,0 +1,344 @@
+"use client";
+import { jsx as l, jsxs as D, Fragment as ae } from "react/jsx-runtime";
+import { c as G } from "react-compiler-runtime";
+import { X as ue, ArrowRight as pe } from "lucide-react";
+import * as me from "react";
+import { DoctButton as E } from "../../../ui/button.js";
+import { DialogHeader as ge, DialogTitle as he, DialogContent as xe, Dialog as ve } from "../../../ui/dialog.js";
+import { DrawerHeader as be, DrawerTitle as Ne, DrawerContent as Le, Drawer as ye } from "../../../ui/drawer.js";
+import { DoctTypography as U } from "../../../ui/typography.js";
+import { useIsMobile as Ce } from "../../../../hooks/use-mobile.js";
+import { cn as de } from "../../../../lib/utils.js";
+import { LOGIN_DIALOG_DEFAULT_COPY as we, LOGIN_DIALOG_CONTINUE_PHONE_EMAIL_LABEL as Ie, LOGIN_DIALOG_RETURNING_HINT as _e, LOGIN_DIALOG_ASSETS as re, LOGIN_DIALOG_RETURNING_PRIMARY_LABEL as Ae, LOGIN_DIALOG_CONTINUE_ANOTHER_WAY_LABEL as De } from "./presets.js";
+import { LOGIN_DRAWER_BACKDROP_CLASS as se, LOGIN_DIALOG_IMAGE_HEIGHT as Ge, LOGIN_DIALOG_IMAGE_WIDTH as Oe } from "./types.js";
+const Se = "[&>div:first-child]:pointer-events-none [&>div:first-child]:sr-only [&>div:first-child]:m-0 [&>div:first-child]:h-0 [&>div:first-child]:w-0 [&>div:first-child]:overflow-hidden", Ee = "linear-gradient(180deg, #ffffff 0%, #ebf8fa 100%)";
+function ke(m, e) {
+  return e ?? _e[m];
+}
+function Pe(m) {
+  const e = G(3), {
+    onClose: i
+  } = m;
+  let o;
+  e[0] === Symbol.for("react.memo_cache_sentinel") ? (o = /* @__PURE__ */ l(ue, { className: "size-6", "aria-hidden": !0 }), e[0] = o) : o = e[0];
+  let t;
+  return e[1] !== i ? (t = /* @__PURE__ */ l(E, { type: "button", variant: "ghost", onClick: i, className: "flex size-[44px] shrink-0 items-center justify-center rounded-full p-0 text-black/70", "aria-label": "Close login", icon: o }), e[1] = i, e[2] = t) : t = e[2], t;
+}
+function Te(m) {
+  const e = G(7), {
+    title: i,
+    onClose: o
+  } = m;
+  let t;
+  e[0] !== i ? (t = /* @__PURE__ */ l(U, { as: "p", variant: "textLabel1", weight: "semiBold", className: "min-w-0 flex-1 !text-black/80", children: i }), e[0] = i, e[1] = t) : t = e[1];
+  let r;
+  e[2] !== o ? (r = /* @__PURE__ */ l(Pe, { onClose: o }), e[2] = o, e[3] = r) : r = e[3];
+  let n;
+  return e[4] !== t || e[5] !== r ? (n = /* @__PURE__ */ D("div", { className: "flex w-full shrink-0 items-center justify-between overflow-hidden pl-4", children: [
+    t,
+    r
+  ] }), e[4] = t, e[5] = r, e[6] = n) : n = e[6], n;
+}
+function We(m) {
+  const e = G(6), {
+    image: i,
+    imageSrc: o,
+    imageAlt: t
+  } = m, r = o ?? re.illustration;
+  let n;
+  e[0] !== i || e[1] !== t || e[2] !== r ? (n = i ?? /* @__PURE__ */ l("img", { src: r, alt: t ?? "Docthub", width: Oe, height: Ge, className: "h-auto w-full max-w-[288px] object-contain" }), e[0] = i, e[1] = t, e[2] = r, e[3] = n) : n = e[3];
+  let s;
+  return e[4] !== n ? (s = /* @__PURE__ */ l("div", { className: "flex w-full flex-col items-center px-4", children: n }), e[4] = n, e[5] = s) : s = e[5], s;
+}
+function fe(m) {
+  const e = G(3), {
+    termsNode: i,
+    privacyNode: o
+  } = m;
+  let t;
+  return e[0] !== o || e[1] !== i ? (t = /* @__PURE__ */ D(U, { as: "p", variant: "body5", weight: "regular", className: "w-full max-w-[288px] !text-center !text-[#6C6E6F]", children: [
+    "by continuing you agree to Docthub's ",
+    i,
+    " and ",
+    o,
+    "."
+  ] }), e[0] = o, e[1] = i, e[2] = t) : t = e[2], t;
+}
+function te(m) {
+  const e = G(2), {
+    provider: i,
+    googleIconSrc: o,
+    appleIconSrc: t
+  } = m, r = i === "google" ? o ?? re.googleIcon : t ?? re.appleIcon;
+  let n;
+  return e[0] !== r ? (n = /* @__PURE__ */ l("img", { src: r, alt: "", className: "size-[24px] shrink-0 object-contain", "aria-hidden": !0 }), e[0] = r, e[1] = n) : n = e[1], n;
+}
+function Be(m) {
+  const e = G(11), {
+    description: i,
+    continueButtonLabel: o,
+    onContinueWithPhoneEmail: t
+  } = m;
+  let r;
+  e[0] !== i ? (r = /* @__PURE__ */ l("div", { className: "flex shrink-0 flex-col items-center gap-5 px-4 py-5", children: /* @__PURE__ */ l(U, { as: "p", variant: "textLabel2", weight: "medium", className: "w-full !text-center !text-black/80", children: i }) }), e[0] = i, e[1] = r) : r = e[1];
+  let n;
+  e[2] === Symbol.for("react.memo_cache_sentinel") ? (n = /* @__PURE__ */ l(pe, { className: "size-6 shrink-0", "aria-hidden": !0 }), e[2] = n) : n = e[2];
+  let s;
+  e[3] !== t ? (s = () => t == null ? void 0 : t(), e[3] = t, e[4] = s) : s = e[4];
+  let c;
+  e[5] !== o || e[6] !== s ? (c = /* @__PURE__ */ l("div", { className: "flex shrink-0 flex-col items-stretch gap-3 border-t border-black/10 bg-[#fafafa] p-4", children: /* @__PURE__ */ l(E, { type: "button", className: "flex w-full flex-1 h-[44px] items-center justify-center gap-2 rounded-xl bg-[#002830] px-5 py-2.5 text-base font-semibold leading-[22px] text-white", icon: n, iconPosition: "right", onClick: s, children: o }) }), e[5] = o, e[6] = s, e[7] = c) : c = e[7];
+  let a;
+  return e[8] !== r || e[9] !== c ? (a = /* @__PURE__ */ D(ae, { children: [
+    r,
+    c
+  ] }), e[8] = r, e[9] = c, e[10] = a) : a = e[10], a;
+}
+function Re(m) {
+  const e = G(16), {
+    description: i,
+    googleIconSrc: o,
+    appleIconSrc: t,
+    onContinueWithMobile: r,
+    onContinueWithEmail: n,
+    onContinueWithGoogle: s,
+    onContinueWithApple: c,
+    termsNode: a,
+    privacyNode: u
+  } = m;
+  let g;
+  e[0] !== i ? (g = /* @__PURE__ */ l(U, { as: "p", variant: "textLabel4", weight: "medium", className: "w-full max-w-[288px] !text-center !text-[#6C6E6F]", children: i }), e[0] = i, e[1] = g) : g = e[1];
+  let d;
+  e[2] !== t || e[3] !== o || e[4] !== c || e[5] !== n || e[6] !== s || e[7] !== r ? (d = r || n || s || c ? /* @__PURE__ */ D("div", { className: "flex w-full flex-col gap-2", children: [
+    r ? /* @__PURE__ */ l(E, { type: "button", size: "large", variant: "outline", onClick: r, children: "Continue with Mobile" }) : null,
+    n ? /* @__PURE__ */ l(E, { type: "button", size: "large", variant: "outline", onClick: n, children: "Continue with Email" }) : null,
+    s ? /* @__PURE__ */ l(E, { type: "button", size: "large", variant: "outline", icon: /* @__PURE__ */ l(te, { provider: "google", googleIconSrc: o, appleIconSrc: t }), iconPosition: "left", onClick: s, children: "Continue with Google" }) : null,
+    c ? /* @__PURE__ */ l(E, { type: "button", size: "large", variant: "outline", icon: /* @__PURE__ */ l(te, { provider: "apple", googleIconSrc: o, appleIconSrc: t }), iconPosition: "left", onClick: c, children: "Continue with Apple" }) : null
+  ] }) : null, e[2] = t, e[3] = o, e[4] = c, e[5] = n, e[6] = s, e[7] = r, e[8] = d) : d = e[8];
+  let f;
+  e[9] !== u || e[10] !== a ? (f = /* @__PURE__ */ l(fe, { termsNode: a, privacyNode: u }), e[9] = u, e[10] = a, e[11] = f) : f = e[11];
+  let p;
+  return e[12] !== g || e[13] !== d || e[14] !== f ? (p = /* @__PURE__ */ D("div", { className: "flex flex-col items-center gap-4 px-4 pb-6 pt-4", children: [
+    g,
+    d,
+    f
+  ] }), e[12] = g, e[13] = d, e[14] = f, e[15] = p) : p = e[15], p;
+}
+function Me(m) {
+  const e = G(29), {
+    description: i,
+    lastLoginProvider: o,
+    googleIconSrc: t,
+    appleIconSrc: r,
+    onContinueWithGoogle: n,
+    onContinueWithApple: s,
+    onContinueWithMobile: c,
+    onContinueWithEmail: a,
+    onContinueAnotherWay: u,
+    termsNode: g,
+    privacyNode: d
+  } = m, f = Ae[o], p = o === "google", N = o === "apple";
+  let w;
+  e[0] !== o || e[1] !== s || e[2] !== a || e[3] !== n || e[4] !== c ? (w = () => {
+    o === "google" ? n == null || n() : o === "apple" ? s == null || s() : o === "mobile" ? c == null || c() : a == null || a();
+  }, e[0] = o, e[1] = s, e[2] = a, e[3] = n, e[4] = c, e[5] = w) : w = e[5];
+  const y = w;
+  let h;
+  e[6] !== i ? (h = /* @__PURE__ */ l(U, { as: "p", variant: "textLabel4", weight: "medium", className: "w-full max-w-[288px] !text-center !text-black/68", children: i }), e[6] = i, e[7] = h) : h = e[7];
+  let x;
+  e[8] !== r || e[9] !== t || e[10] !== N || e[11] !== p ? (x = p ? /* @__PURE__ */ l(te, { provider: "google", googleIconSrc: t, appleIconSrc: r }) : N ? /* @__PURE__ */ l(te, { provider: "apple", googleIconSrc: t, appleIconSrc: r }) : void 0, e[8] = r, e[9] = t, e[10] = N, e[11] = p, e[12] = x) : x = e[12];
+  let v;
+  e[13] !== y || e[14] !== f || e[15] !== x ? (v = /* @__PURE__ */ l(E, { type: "button", size: "large", variant: "primary", icon: x, iconPosition: "left", onClick: y, children: f }), e[13] = y, e[14] = f, e[15] = x, e[16] = v) : v = e[16];
+  let L;
+  e[17] !== u ? (L = /* @__PURE__ */ l(E, { type: "button", variant: "outline", size: "large", onClick: () => u == null ? void 0 : u(), children: De }), e[17] = u, e[18] = L) : L = e[18];
+  let b;
+  e[19] !== v || e[20] !== L ? (b = /* @__PURE__ */ D("div", { className: "flex w-full flex-col gap-2", children: [
+    v,
+    L
+  ] }), e[19] = v, e[20] = L, e[21] = b) : b = e[21];
+  let C;
+  e[22] !== d || e[23] !== g ? (C = /* @__PURE__ */ l(fe, { termsNode: g, privacyNode: d }), e[22] = d, e[23] = g, e[24] = C) : C = e[24];
+  let A;
+  return e[25] !== h || e[26] !== b || e[27] !== C ? (A = /* @__PURE__ */ D("div", { className: "flex flex-col items-center gap-4 px-4 pb-6 pt-4", children: [
+    h,
+    b,
+    C
+  ] }), e[25] = h, e[26] = b, e[27] = C, e[28] = A) : A = e[28], A;
+}
+function He(m) {
+  const e = G(38), {
+    variant: i,
+    lastLoginProvider: o,
+    description: t,
+    continueButtonLabel: r,
+    image: n,
+    imageSrc: s,
+    imageAlt: c,
+    googleIconSrc: a,
+    appleIconSrc: u,
+    onContinueWithPhoneEmail: g,
+    onContinueWithMobile: d,
+    onContinueWithEmail: f,
+    onContinueWithGoogle: p,
+    onContinueWithApple: N,
+    onContinueAnotherWay: w,
+    termsNode: y,
+    privacyNode: h
+  } = m;
+  let x;
+  e[0] !== n || e[1] !== c || e[2] !== s ? (x = /* @__PURE__ */ l(We, { image: n, imageSrc: s, imageAlt: c }), e[0] = n, e[1] = c, e[2] = s, e[3] = x) : x = e[3];
+  let v;
+  e[4] !== r || e[5] !== t || e[6] !== g || e[7] !== i ? (v = i === "guest" && /* @__PURE__ */ l(Be, { description: t, continueButtonLabel: r, onContinueWithPhoneEmail: g }), e[4] = r, e[5] = t, e[6] = g, e[7] = i, e[8] = v) : v = e[8];
+  let L;
+  e[9] !== u || e[10] !== t || e[11] !== a || e[12] !== N || e[13] !== f || e[14] !== p || e[15] !== d || e[16] !== h || e[17] !== y || e[18] !== i ? (L = i === "signup" && /* @__PURE__ */ l(Re, { description: t, googleIconSrc: a, appleIconSrc: u, onContinueWithMobile: d, onContinueWithEmail: f, onContinueWithGoogle: p, onContinueWithApple: N, termsNode: y, privacyNode: h }), e[9] = u, e[10] = t, e[11] = a, e[12] = N, e[13] = f, e[14] = p, e[15] = d, e[16] = h, e[17] = y, e[18] = i, e[19] = L) : L = e[19];
+  let b;
+  e[20] !== u || e[21] !== t || e[22] !== a || e[23] !== o || e[24] !== w || e[25] !== N || e[26] !== f || e[27] !== p || e[28] !== d || e[29] !== h || e[30] !== y || e[31] !== i ? (b = i === "returning" && /* @__PURE__ */ l(Me, { description: t, lastLoginProvider: o, googleIconSrc: a, appleIconSrc: u, onContinueWithGoogle: p, onContinueWithApple: N, onContinueWithMobile: d, onContinueWithEmail: f, onContinueAnotherWay: w, termsNode: y, privacyNode: h }), e[20] = u, e[21] = t, e[22] = a, e[23] = o, e[24] = w, e[25] = N, e[26] = f, e[27] = p, e[28] = d, e[29] = h, e[30] = y, e[31] = i, e[32] = b) : b = e[32];
+  let C;
+  return e[33] !== x || e[34] !== v || e[35] !== L || e[36] !== b ? (C = /* @__PURE__ */ D(ae, { children: [
+    x,
+    v,
+    L,
+    b
+  ] }), e[33] = x, e[34] = v, e[35] = L, e[36] = b, e[37] = C) : C = e[37], C;
+}
+function ce(m) {
+  const e = G(29), {
+    title: i,
+    variant: o,
+    lastLoginProvider: t,
+    description: r,
+    continueButtonLabel: n,
+    image: s,
+    imageSrc: c,
+    imageAlt: a,
+    googleIconSrc: u,
+    appleIconSrc: g,
+    onClose: d,
+    onContinueWithPhoneEmail: f,
+    onContinueWithMobile: p,
+    onContinueWithEmail: N,
+    onContinueWithGoogle: w,
+    onContinueWithApple: y,
+    onContinueAnotherWay: h,
+    termsNode: x,
+    privacyNode: v,
+    className: L,
+    surface: b
+  } = m, C = b === "drawer" ? "rounded-t-2xl" : "rounded-2xl shadow-sm";
+  let A;
+  e[0] !== L || e[1] !== C ? (A = de("flex w-full max-w-[320px] flex-col overflow-hidden border border-black/10 bg-white", C, L), e[0] = L, e[1] = C, e[2] = A) : A = e[2];
+  const k = A;
+  let _;
+  e[3] === Symbol.for("react.memo_cache_sentinel") ? (_ = {
+    background: Ee
+  }, e[3] = _) : _ = e[3];
+  let I;
+  e[4] !== d || e[5] !== i ? (I = /* @__PURE__ */ l(Te, { title: i, onClose: d }), e[4] = d, e[5] = i, e[6] = I) : I = e[6];
+  let O;
+  e[7] !== g || e[8] !== n || e[9] !== r || e[10] !== u || e[11] !== s || e[12] !== a || e[13] !== c || e[14] !== t || e[15] !== h || e[16] !== y || e[17] !== N || e[18] !== w || e[19] !== p || e[20] !== f || e[21] !== v || e[22] !== x || e[23] !== o ? (O = /* @__PURE__ */ l(He, { variant: o, lastLoginProvider: t, description: r, continueButtonLabel: n, image: s, imageSrc: c, imageAlt: a, googleIconSrc: u, appleIconSrc: g, onContinueWithPhoneEmail: f, onContinueWithMobile: p, onContinueWithEmail: N, onContinueWithGoogle: w, onContinueWithApple: y, onContinueAnotherWay: h, termsNode: x, privacyNode: v }), e[7] = g, e[8] = n, e[9] = r, e[10] = u, e[11] = s, e[12] = a, e[13] = c, e[14] = t, e[15] = h, e[16] = y, e[17] = N, e[18] = w, e[19] = p, e[20] = f, e[21] = v, e[22] = x, e[23] = o, e[24] = O) : O = e[24];
+  let P;
+  return e[25] !== k || e[26] !== I || e[27] !== O ? (P = /* @__PURE__ */ D("div", { className: k, style: _, children: [
+    I,
+    O
+  ] }), e[25] = k, e[26] = I, e[27] = O, e[28] = P) : P = e[28], P;
+}
+function Ze(m) {
+  const e = G(61), {
+    open: i,
+    onOpenChange: o,
+    variant: t,
+    lastLoginProvider: r,
+    onContinueWithPhoneEmail: n,
+    onContinueWithMobile: s,
+    onContinueWithEmail: c,
+    onContinueWithGoogle: a,
+    onContinueWithApple: u,
+    onContinueAnotherWay: g,
+    onTermsClick: d,
+    onPrivacyClick: f,
+    termsHref: p,
+    privacyHref: N,
+    imageSrc: w,
+    imageAlt: y,
+    googleIconSrc: h,
+    appleIconSrc: x,
+    image: v,
+    title: L,
+    description: b,
+    continueButtonLabel: C,
+    isMobileOverride: A,
+    className: k
+  } = m, _ = t === void 0 ? "guest" : t, I = r === void 0 ? "google" : r, O = C === void 0 ? Ie : C, P = Ce(), $ = A ?? P, j = we[_], S = L ?? j.title;
+  let F;
+  e[0] !== j || e[1] !== b || e[2] !== I || e[3] !== _ ? (F = _ === "returning" ? ke(I, b) : b ?? j.description, e[0] = j, e[1] = b, e[2] = I, e[3] = _, e[4] = F) : F = e[4];
+  const ie = F;
+  let Y;
+  e[5] !== o ? (Y = () => o(!1), e[5] = o, e[6] = Y) : Y = e[6];
+  const oe = Y;
+  let K;
+  e[7] !== d || e[8] !== p ? (K = p ? /* @__PURE__ */ l("a", { href: p, className: "underline decoration-solid decoration-[0.3px] underline-offset-[2px]", children: "Terms of Use" }) : d ? /* @__PURE__ */ l("button", { type: "button", className: "underline decoration-solid decoration-[0.3px] underline-offset-[2px]", onClick: d, children: "Terms of Use" }) : /* @__PURE__ */ l("span", { className: "underline decoration-solid decoration-[0.3px] underline-offset-[2px]", children: "Terms of Use" }), e[7] = d, e[8] = p, e[9] = K) : K = e[9];
+  const le = K;
+  let X;
+  e[10] !== f || e[11] !== N ? (X = N ? /* @__PURE__ */ l("a", { href: N, className: "underline decoration-solid decoration-[0.3px] underline-offset-[2px]", children: "Privacy Policy" }) : f ? /* @__PURE__ */ l("button", { type: "button", className: "underline decoration-solid decoration-[0.3px] underline-offset-[2px]", onClick: f, children: "Privacy Policy" }) : /* @__PURE__ */ l("span", { className: "underline decoration-solid decoration-[0.3px] underline-offset-[2px]", children: "Privacy Policy" }), e[10] = f, e[11] = N, e[12] = X) : X = e[12];
+  const ne = X;
+  let q, J;
+  e[13] !== $ || e[14] !== i ? (q = () => {
+    if ($)
+      return i ? document.body.classList.add(se) : document.body.classList.remove(se), ze;
+  }, J = [$, i], e[13] = $, e[14] = i, e[15] = q, e[16] = J) : (q = e[15], J = e[16]), me.useEffect(q, J);
+  let Q;
+  e[17] !== x || e[18] !== k || e[19] !== O || e[20] !== h || e[21] !== oe || e[22] !== v || e[23] !== y || e[24] !== w || e[25] !== I || e[26] !== g || e[27] !== u || e[28] !== c || e[29] !== a || e[30] !== s || e[31] !== n || e[32] !== ne || e[33] !== ie || e[34] !== S || e[35] !== le || e[36] !== _ ? (Q = {
+    title: S,
+    variant: _,
+    lastLoginProvider: I,
+    description: ie,
+    continueButtonLabel: O,
+    image: v,
+    imageSrc: w,
+    imageAlt: y,
+    googleIconSrc: h,
+    appleIconSrc: x,
+    onClose: oe,
+    onContinueWithPhoneEmail: n,
+    onContinueWithMobile: s,
+    onContinueWithEmail: c,
+    onContinueWithGoogle: a,
+    onContinueWithApple: u,
+    onContinueAnotherWay: g,
+    termsNode: le,
+    privacyNode: ne,
+    className: k
+  }, e[17] = x, e[18] = k, e[19] = O, e[20] = h, e[21] = oe, e[22] = v, e[23] = y, e[24] = w, e[25] = I, e[26] = g, e[27] = u, e[28] = c, e[29] = a, e[30] = s, e[31] = n, e[32] = ne, e[33] = ie, e[34] = S, e[35] = le, e[36] = _, e[37] = Q) : Q = e[37];
+  const T = Q;
+  if ($) {
+    let Z;
+    e[38] === Symbol.for("react.memo_cache_sentinel") ? (Z = de(Se, "flex max-h-[90vh] flex-col overflow-hidden rounded-t-[20px] border-0 p-0"), e[38] = Z) : Z = e[38];
+    let M;
+    e[39] !== S ? (M = /* @__PURE__ */ l(be, { className: "sr-only", children: /* @__PURE__ */ l(Ne, { children: S }) }), e[39] = S, e[40] = M) : M = e[40];
+    let H;
+    e[41] !== T ? (H = /* @__PURE__ */ l(ce, { ...T, surface: "drawer" }), e[41] = T, e[42] = H) : H = e[42];
+    let z;
+    e[43] !== M || e[44] !== H ? (z = /* @__PURE__ */ D(Le, { "aria-describedby": void 0, className: Z, "data-login-drawer-content": !0, children: [
+      M,
+      H
+    ] }), e[43] = M, e[44] = H, e[45] = z) : z = e[45];
+    let ee;
+    return e[46] !== o || e[47] !== i || e[48] !== z ? (ee = /* @__PURE__ */ l(ye, { open: i, onOpenChange: o, children: z }), e[46] = o, e[47] = i, e[48] = z, e[49] = ee) : ee = e[49], ee;
+  }
+  let W;
+  e[50] !== S ? (W = /* @__PURE__ */ l(ge, { className: "sr-only", children: /* @__PURE__ */ l(he, { children: S }) }), e[50] = S, e[51] = W) : W = e[51];
+  let B;
+  e[52] !== T ? (B = /* @__PURE__ */ l(ce, { ...T, surface: "dialog" }), e[52] = T, e[53] = B) : B = e[53];
+  let R;
+  e[54] !== W || e[55] !== B ? (R = /* @__PURE__ */ D(xe, { "aria-describedby": void 0, className: "max-w-[320px] overflow-visible rounded-2xl border-0 bg-transparent p-0 shadow-none", closeOnOutsideClick: !0, showCloseButton: !1, size: "sm", children: [
+    W,
+    B
+  ] }), e[54] = W, e[55] = B, e[56] = R) : R = e[56];
+  let V;
+  return e[57] !== o || e[58] !== i || e[59] !== R ? (V = /* @__PURE__ */ l(ve, { open: i, onOpenChange: o, modal: !0, children: R }), e[57] = o, e[58] = i, e[59] = R, e[60] = V) : V = e[60], V;
+}
+function ze() {
+  return document.body.classList.remove(se);
+}
+export {
+  Ze as DoctLoginDialog
+};

package/dist/components/overrides/ui/login-dialog/presets.js

@@ -0,0 +1,38 @@
+"use client";
+const o = {
+  illustration: "/login/login-image.png",
+  googleIcon: "/login/google-icon.svg",
+  appleIcon: "/login/apple-icon.svg"
+}, n = {
+  guest: {
+    title: "Login to Continue",
+    description: "You can log in using your phone, email or Google account."
+  },
+  signup: {
+    title: "Login to Continue",
+    description: "If you already have an account we'll log you in, or continue to signup."
+  },
+  returning: {
+    title: "Login to Continue",
+    /** Overridden by `LOGIN_DIALOG_RETURNING_HINT` when `description` is omitted. */
+    description: ""
+  }
+}, i = {
+  google: "Last time you used Google to log in.",
+  apple: "Last time you used Apple to log in.",
+  mobile: "Last time you used your mobile number to log in.",
+  email: "Last time you used your email to log in."
+}, e = {
+  google: "Continue with Google",
+  apple: "Continue with Apple",
+  mobile: "Continue with Mobile",
+  email: "Continue with Email"
+}, t = "Continue with Phone/Email", l = "Continue Another Way";
+export {
+  o as LOGIN_DIALOG_ASSETS,
+  l as LOGIN_DIALOG_CONTINUE_ANOTHER_WAY_LABEL,
+  t as LOGIN_DIALOG_CONTINUE_PHONE_EMAIL_LABEL,
+  n as LOGIN_DIALOG_DEFAULT_COPY,
+  i as LOGIN_DIALOG_RETURNING_HINT,
+  e as LOGIN_DIALOG_RETURNING_PRIMARY_LABEL
+};

package/dist/components/overrides/ui/login-dialog/types.js

@@ -0,0 +1,7 @@
+"use client";
+const I = "login-drawer-backdrop", _ = 288, G = 163;
+export {
+  G as LOGIN_DIALOG_IMAGE_HEIGHT,
+  _ as LOGIN_DIALOG_IMAGE_WIDTH,
+  I as LOGIN_DRAWER_BACKDROP_CLASS
+};

package/dist/components/overrides/ui/pickers/date-range-picker-field.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsx as d, jsxs as F } from "react/jsx-runtime";
+import { jsx as a, jsxs as F } from "react/jsx-runtime";
 import { c as Le } from "react-compiler-runtime";
 import K from "dayjs";
 import $e from "dayjs/plugin/customParseFormat";
@@ -23,29 +23,29 @@ const Qe = i.memo(function(B) {
   } = B, V = r === void 0 ? "en" : r, c = s === void 0 ? 2 : s;
   let u;
   e[0] !== m || e[1] !== l ? (u = () => {
-    const a = new Date(m);
-    a.setMonth(a.getMonth() - 1), l(a);
+    const d = new Date(m);
+    d.setMonth(d.getMonth() - 1), l(d);
   }, e[0] = m, e[1] = l, e[2] = u) : u = e[2];
   const h = u;
   let k;
   e[3] !== m || e[4] !== l ? (k = () => {
-    const a = new Date(m);
-    a.setMonth(a.getMonth() + 1), l(a);
+    const d = new Date(m);
+    d.setMonth(d.getMonth() + 1), l(d);
   }, e[3] = m, e[4] = l, e[5] = k) : k = e[5];
   const M = k;
   let O;
   if (e[6] !== V || e[7] !== m || e[8] !== c) {
-    let a;
-    e[10] !== V || e[11] !== m ? (a = (se, W) => K(m).add(W, "month").locale(V).format("MMMM YYYY"), e[10] = V, e[11] = m, e[12] = a) : a = e[12], O = Array.from({
+    let d;
+    e[10] !== V || e[11] !== m ? (d = (se, W) => K(m).add(W, "month").locale(V).format("MMMM YYYY"), e[10] = V, e[11] = m, e[12] = d) : d = e[12], O = Array.from({
       length: c
-    }, a), e[6] = V, e[7] = m, e[8] = c, e[9] = O;
+    }, d), e[6] = V, e[7] = m, e[8] = c, e[9] = O;
   } else
     O = e[9];
   const v = O;
   let L;
-  e[13] === Symbol.for("react.memo_cache_sentinel") ? (L = /* @__PURE__ */ d(ze, { className: "h-4 w-4" }), e[13] = L) : L = e[13];
+  e[13] === Symbol.for("react.memo_cache_sentinel") ? (L = /* @__PURE__ */ a(ze, { className: "h-4 w-4" }), e[13] = L) : L = e[13];
   let b;
-  e[14] !== h ? (b = /* @__PURE__ */ d("button", { type: "button", onClick: h, className: "flex h-7 w-7 items-center justify-center rounded-md border border-input bg-background p-0 text-foreground hover:bg-accent", "aria-label": "Previous month", children: L }), e[14] = h, e[15] = b) : b = e[15];
+  e[14] !== h ? (b = /* @__PURE__ */ a("button", { type: "button", onClick: h, className: "flex h-7 w-7 items-center justify-center rounded-md border border-input bg-background p-0 text-foreground hover:bg-accent", "aria-label": "Previous month", children: L }), e[14] = h, e[15] = b) : b = e[15];
   const T = `repeat(${c}, minmax(0, 1fr))`;
   let P;
   e[16] !== T ? (P = {
@@ -54,11 +54,11 @@ const Qe = i.memo(function(B) {
   let p;
   e[18] !== v ? (p = v.map(Ze), e[18] = v, e[19] = p) : p = e[19];
   let x;
-  e[20] !== p || e[21] !== P ? (x = /* @__PURE__ */ d("div", { className: "grid flex-1 gap-2 px-2 text-center text-sm font-semibold text-foreground", style: P, children: p }), e[20] = p, e[21] = P, e[22] = x) : x = e[22];
+  e[20] !== p || e[21] !== P ? (x = /* @__PURE__ */ a("div", { className: "grid flex-1 gap-2 px-2 text-center text-sm font-semibold text-foreground", style: P, children: p }), e[20] = p, e[21] = P, e[22] = x) : x = e[22];
   let D;
-  e[23] === Symbol.for("react.memo_cache_sentinel") ? (D = /* @__PURE__ */ d(Ae, { className: "h-4 w-4" }), e[23] = D) : D = e[23];
+  e[23] === Symbol.for("react.memo_cache_sentinel") ? (D = /* @__PURE__ */ a(Ae, { className: "h-4 w-4" }), e[23] = D) : D = e[23];
   let R;
-  e[24] !== M ? (R = /* @__PURE__ */ d("button", { type: "button", onClick: M, className: "flex h-7 w-7 items-center justify-center rounded-md border border-input bg-background p-0 text-foreground hover:bg-accent", "aria-label": "Next month", children: D }), e[24] = M, e[25] = R) : R = e[25];
+  e[24] !== M ? (R = /* @__PURE__ */ a("button", { type: "button", onClick: M, className: "flex h-7 w-7 items-center justify-center rounded-md border border-input bg-background p-0 text-foreground hover:bg-accent", "aria-label": "Next month", children: D }), e[24] = M, e[25] = R) : R = e[25];
   let $;
   return e[26] !== x || e[27] !== R || e[28] !== b ? ($ = /* @__PURE__ */ F("div", { className: "flex items-center border-b border-border bg-muted px-2 py-1.5", children: [
     b,
@@ -90,7 +90,7 @@ const Qe = i.memo(function(B) {
   open: D,
   onOpenChange: R,
   dayPickerProps: $,
-  manual: a = !1,
+  manual: d = !1,
   // Default to false: calendar-only selection unless enabled
   popoverAlign: se = "end",
   iconPosition: W = "right",
@@ -106,16 +106,16 @@ const Qe = i.memo(function(B) {
   ...ye
 }) => {
   const {
-    disabled: ae,
+    disabled: de,
     fromDate: Ce,
     toDate: Se,
     startMonth: he,
     endMonth: ve,
     showOutsideDays: xe,
     ...C
-  } = $ ?? {}, ge = T ?? xe, de = L ?? v, [we, ke] = i.useState(!1), q = D !== void 0 ? D : we, j = R || ke, [S, y] = i.useState(""), [E, g] = i.useState(l), [ne, le] = i.useState(p ?? (l == null ? void 0 : l.from) ?? /* @__PURE__ */ new Date()), ce = i.useMemo(() => p ?? ne, [p, ne]), G = i.useCallback((t) => {
+  } = $ ?? {}, ge = T ?? xe, ae = L ?? v, [we, ke] = i.useState(!1), q = D !== void 0 ? D : we, j = R || ke, [S, y] = i.useState(""), [E, g] = i.useState(l), [ne, le] = i.useState(p ?? (l == null ? void 0 : l.from) ?? /* @__PURE__ */ new Date()), ce = i.useMemo(() => p ?? ne, [p, ne]), G = i.useCallback((t) => {
     x ? x(t) : le(t);
-  }, [x]), Me = i.useMemo(() => B || (a ? `${v.toLowerCase()} - ${v.toLowerCase()}` : "Click to select date range"), [B, v, a]), H = i.useCallback((t) => K(t).locale(M).format(de), [de, M]), w = i.useCallback((t) => t != null && t.from ? t.from && t.to ? `${H(t.from)} - ${H(t.to)}` : H(t.from) : "", [H]), J = i.useCallback((t) => {
+  }, [x]), Me = i.useMemo(() => B || (d ? `${v.toLowerCase()} - ${v.toLowerCase()}` : "Click to select date range"), [B, v, d]), H = i.useCallback((t) => K(t).locale(M).format(ae), [ae, M]), w = i.useCallback((t) => t != null && t.from ? t.from && t.to ? `${H(t.from)} - ${H(t.to)}` : H(t.from) : "", [H]), J = i.useCallback((t) => {
     const o = t.trim();
     if (!o) return null;
     const f = K(o, v, !0).locale(M);
@@ -175,7 +175,8 @@ const Qe = i.memo(function(B) {
     // react-day-picker v9 selection state keys
     selected: "bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground",
     day_today: "bg-accent text-accent-foreground",
-    day_outside: "day-outside text-muted-foreground opacity-50 aria-selected:bg-accent/50 aria-selected:text-muted-foreground aria-selected:opacity-30",
+    // react-day-picker v9 uses modifier key `outside` (not `day_outside`); `.day-outside` kept for `[&:has(...day-outside)]` cell selectors.
+    outside: "day-outside text-muted-foreground/60 [&_button:not(:disabled)]:text-muted-foreground/60 hover:[&_button:not(:disabled)]:text-muted-foreground",
     disabled: "text-muted-foreground opacity-40 grayscale pointer-events-none cursor-not-allowed",
     day_disabled: "text-muted-foreground opacity-40 grayscale pointer-events-none cursor-not-allowed",
     day_range_middle: (
@@ -186,12 +187,12 @@ const Qe = i.memo(function(B) {
     // react-day-picker v9 selection state keys
     range_middle: "!bg-muted !text-foreground rounded-none [&>button]:!rounded-none",
     day_hidden: "invisible"
-  }), []), _e = i.useMemo(() => He(Je(c, u), ae), [c, u, ae]), Pe = c ? me(c) : he, Re = u ? me(u) : ve;
+  }), []), _e = i.useMemo(() => He(Je(c, u), de), [c, u, de]), Pe = c ? me(c) : he, Re = u ? me(u) : ve;
   i.useEffect(() => {
     y(w(l)), g(l), l != null && l.from && !p && le(l.from);
   }, [l, w, p]);
   const Ve = i.useCallback((t) => {
-    if (!a) return;
+    if (!d) return;
     let o = t.target.value;
     if (y(o), !o.trim()) {
       g(void 0), r == null || r(void 0), s == null || s(void 0);
@@ -201,7 +202,7 @@ const Qe = i.memo(function(B) {
     f !== o && (y(f), o = f);
     const n = Q(o);
     n && U(n, c, u) && (g(n), r == null || r(n), s == null || s(n));
-  }, [a, r, s, ue, Q, c, u]), ee = i.useCallback(() => {
+  }, [d, r, s, ue, Q, c, u]), ee = i.useCallback(() => {
     const t = S.trim();
     if (!t) {
       g(void 0), r == null || r(void 0), s == null || s(void 0);
@@ -217,12 +218,12 @@ const Qe = i.memo(function(B) {
     const o = t.getRange();
     U(o, c, u) && (y(w(o)), g(o), o.from && G(o.from), r == null || r(o), s == null || s(o));
   }, [w, G, c, u, s, r]), Ee = !!(P && E && !h && !k), N = !!(h || k), Ye = i.useCallback((t) => {
-    if (!a) {
+    if (!d) {
       !N && (t.key === "Enter" || t.key === " ") && (t.preventDefault(), j(!q));
       return;
     }
     t.key === "Enter" && (t.preventDefault(), ee());
-  }, [a, ee, j, q, N]), Oe = i.useMemo(() => {
+  }, [d, ee, j, q, N]), Oe = i.useMemo(() => {
     var t, o;
     if (z) {
       if (i.isValidElement(z)) {
@@ -237,51 +238,51 @@ const Qe = i.memo(function(B) {
           }
         });
       }
-      return /* @__PURE__ */ d("span", { className: _("h-5 w-5 inline-flex items-center justify-center", X), style: I ? {
+      return /* @__PURE__ */ a("span", { className: _("h-5 w-5 inline-flex items-center justify-center", X), style: I ? {
         color: I
       } : void 0, children: z });
     }
-    return /* @__PURE__ */ d(Be, { strokeWidth: 1, className: _("h-5 w-5", X, h && "opacity-50"), style: I ? {
+    return /* @__PURE__ */ a(Be, { strokeWidth: 1, className: _("h-5 w-5", X, h && "opacity-50"), style: I ? {
       color: I
     } : void 0 });
   }, [z, X, I, h]);
   return /* @__PURE__ */ F("div", { className: _("space-y-1", V), ...ye, children: [
     Y && /* @__PURE__ */ F(Xe, { className: "text-sm font-medium text-foreground", children: [
       Y,
-      m && /* @__PURE__ */ d("span", { className: "text-red-500 ml-1", children: "*" })
+      m && /* @__PURE__ */ a("span", { className: "text-red-500 ml-1", children: "*" })
     ] }),
     /* @__PURE__ */ F(qe, { open: q, onOpenChange: (t) => {
       N && t || j(t);
     }, children: [
-      ie ? /* @__PURE__ */ d(fe, { asChild: !0, children: ie }) : /* @__PURE__ */ F("div", { className: _("w-80 relative", O), onMouseDownCapture: () => {
-        a && be && !h && !k && j(!0);
+      ie ? /* @__PURE__ */ a(fe, { asChild: !0, children: ie }) : /* @__PURE__ */ F("div", { className: _("w-80 relative", O), onMouseDownCapture: () => {
+        d && be && !h && !k && j(!0);
       }, children: [
-        /* @__PURE__ */ d(We, { type: "text", value: S, onChange: Ve, onBlur: ee, onKeyDown: Ye, onClick: () => {
-          (!a && !N || a && pe && !N) && j(!0);
-        }, placeholder: Me, disabled: h, readOnly: k || !a, className: _("w-full pr-12", W === "left" && "pl-12", b && "border border-destructive focus-visible:ring-destructive", !a && !N && "cursor-pointer") }),
-        Ee && /* @__PURE__ */ d("button", { type: "button", onClick: Ie, className: "absolute right-10 top-1/2 -translate-y-1/2 p-1 rounded hover:bg-muted focus:outline-none focus:ring-2 focus:ring-ring", "aria-label": "Clear date range", children: /* @__PURE__ */ d(Te, { className: "h-4 w-4 text-muted-foreground" }) }),
-        /* @__PURE__ */ d(fe, { asChild: !0, children: /* @__PURE__ */ d("button", { type: "button", className: _("absolute top-1/2 -translate-y-1/2 border-0 bg-transparent outline-none", W === "left" ? "left-3" : "right-1", N ? "cursor-default text-muted-foreground" : "cursor-pointer text-black hover:text-black"), style: {
+        /* @__PURE__ */ a(We, { type: "text", value: S, onChange: Ve, onBlur: ee, onKeyDown: Ye, onClick: () => {
+          (!d && !N || d && pe && !N) && j(!0);
+        }, placeholder: Me, disabled: h, readOnly: k || !d, className: _("w-full pr-12", W === "left" && "pl-12", b && "border border-destructive focus-visible:ring-destructive", !d && !N && "cursor-pointer") }),
+        Ee && /* @__PURE__ */ a("button", { type: "button", onClick: Ie, className: "absolute right-10 top-1/2 -translate-y-1/2 p-1 rounded hover:bg-muted focus:outline-none focus:ring-2 focus:ring-ring", "aria-label": "Clear date range", children: /* @__PURE__ */ a(Te, { className: "h-4 w-4 text-muted-foreground" }) }),
+        /* @__PURE__ */ a(fe, { asChild: !0, children: /* @__PURE__ */ a("button", { type: "button", className: _("absolute top-1/2 -translate-y-1/2 border-0 bg-transparent outline-none", W === "left" ? "left-3" : "right-1", N ? "cursor-default text-muted-foreground" : "cursor-pointer text-black hover:text-black"), style: {
           height: "1.75rem",
           width: "1.75rem"
         }, onClick: N ? void 0 : () => {
           j(!q);
         }, disabled: N, "aria-label": "Open calendar", children: Oe }) })
       ] }),
-      /* @__PURE__ */ d(Ge, { className: "w-auto p-0 mt-2", align: se, children: /* @__PURE__ */ F("div", { className: "rounded-md border border-border bg-popover text-popover-foreground shadow-md", children: [
-        Z && Z.length > 0 && /* @__PURE__ */ d("div", { className: "flex flex-wrap gap-2 p-3 border-b bg-muted/40", children: Z.map((t) => /* @__PURE__ */ d("button", { type: "button", className: "rounded-md border bg-background px-2.5 py-1.5 text-xs font-medium hover:bg-accent hover:text-accent-foreground", onClick: () => je(t), children: t.label }, t.label)) }),
-        /* @__PURE__ */ d(Qe, { month: ce, onMonthChange: G, locale: M, numberOfMonths: oe }),
-        /* @__PURE__ */ d("div", { className: "p-3", children: /* @__PURE__ */ d(Ke, { ...C, mode: "range", selected: E, onSelect: De, month: ce, onMonthChange: G, startMonth: Pe, endMonth: Re, disabled: _e, numberOfMonths: oe, showOutsideDays: ge, className: _("p-0", C.className), classNames: {
+      /* @__PURE__ */ a(Ge, { className: "w-auto p-0 mt-2", align: se, children: /* @__PURE__ */ F("div", { className: "rounded-md border border-border bg-popover text-popover-foreground shadow-md", children: [
+        Z && Z.length > 0 && /* @__PURE__ */ a("div", { className: "flex flex-wrap gap-2 p-3 border-b bg-muted/40", children: Z.map((t) => /* @__PURE__ */ a("button", { type: "button", className: "rounded-md border bg-background px-2.5 py-1.5 text-xs font-medium hover:bg-accent hover:text-accent-foreground", onClick: () => je(t), children: t.label }, t.label)) }),
+        /* @__PURE__ */ a(Qe, { month: ce, onMonthChange: G, locale: M, numberOfMonths: oe }),
+        /* @__PURE__ */ a("div", { className: "p-3", children: /* @__PURE__ */ a(Ke, { ...C, mode: "range", selected: E, onSelect: De, month: ce, onMonthChange: G, startMonth: Pe, endMonth: Re, disabled: _e, numberOfMonths: oe, showOutsideDays: ge, className: _("p-0", C.className), classNames: {
           ...Ne,
           ...C.classNames
         } }) })
       ] }) })
     ] }),
-    (e || b) && /* @__PURE__ */ d("p", { className: _("text-xs", b ? "text-destructive" : "text-muted-foreground"), children: b || e })
+    (e || b) && /* @__PURE__ */ a("p", { className: _("text-xs", b ? "text-destructive" : "text-muted-foreground"), children: b || e })
   ] });
 });
 Ue.displayName = "DateRangePickerField";
 function Ze(Y) {
-  return /* @__PURE__ */ d("span", { className: "truncate", children: Y }, Y);
+  return /* @__PURE__ */ a("span", { className: "truncate", children: Y }, Y);
 }
 export {
   Ue as DateRangePickerField