@odla-ai/chapter 0.7.0 → 0.9.0

package/dist/ui/index.js

@@ -1,798 +1,23 @@
-// src/ui/admin.tsx
-import { useEffect as useEffect2, useMemo, useState as useState2 } from "react";
-import { ClerkGate, SignedIn, SignedOut, SignIn, useClerkAuth, clerkAppearanceFromTokens } from "@odla-ai/auth-clerk";
-import { CrmClient } from "@odla-ai/crm";
-
-// src/ui/chrome.tsx
-import { useCallback, useEffect, useState } from "react";
-import { TopBar, TopBarLink } from "@odla-ai/ui/components";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-var badgeText = (brand) => brand.badge ?? brand.name.slice(0, 3).toUpperCase();
-var brandDisplay = (brand) => brand.wordmark ?? brand.name;
-var S = {
-  gate: {
-    minHeight: "100vh",
-    display: "grid",
-    placeItems: "center",
-    padding: 24,
-    background: "radial-gradient(900px 480px at 50% -8%, var(--ui-accent-soft), transparent 70%), radial-gradient(700px 500px at 110% 10%, var(--ui-good-soft), transparent 60%)"
-  },
-  gateInner: { width: "100%", maxWidth: 400, display: "flex", flexDirection: "column", alignItems: "center" },
-  brandBox: { textAlign: "center", marginBottom: 22 },
-  badge: {
-    width: 52,
-    height: 52,
-    margin: "0 auto 14px",
-    display: "grid",
-    placeItems: "center",
-    fontSize: 15,
-    fontWeight: 700,
-    color: "var(--ui-on-accent)",
-    background: "linear-gradient(135deg, var(--ui-accent), var(--ui-accent-strong))",
-    borderRadius: 14,
-    boxShadow: "0 10px 28px var(--ui-accent-soft)"
-  },
-  badgeSm: {
-    width: 26,
-    height: 26,
-    display: "grid",
-    placeItems: "center",
-    fontSize: 10,
-    fontWeight: 700,
-    color: "var(--ui-on-accent)",
-    background: "linear-gradient(135deg, var(--ui-accent), var(--ui-accent-strong))",
-    borderRadius: 7,
-    marginRight: 9
-  },
-  h1: { margin: 0, fontSize: 28, letterSpacing: "-0.02em", fontWeight: 700 },
-  muted: { color: "var(--ui-text-muted)" },
-  role: {
-    fontFamily: "var(--ui-font-mono)",
-    fontSize: 11,
-    textTransform: "uppercase",
-    letterSpacing: "0.04em",
-    padding: "2px 8px",
-    borderRadius: 999,
-    background: "var(--ui-accent-soft)",
-    border: "1px solid var(--ui-accent)",
-    color: "var(--ui-accent-strong)"
-  },
-  whoami: { display: "flex", alignItems: "center", gap: 8, fontSize: 12 },
-  // Sections own their own width/padding (e.g. a .wrap container).
-  main: { minHeight: "calc(100vh - 61px)" },
-  card: { width: "100%", textAlign: "center" }
-};
-function Gate(props) {
-  const { brand, tagline, children } = props;
-  return /* @__PURE__ */ jsx("div", { style: S.gate, children: /* @__PURE__ */ jsxs("div", { style: S.gateInner, children: [
-    /* @__PURE__ */ jsxs("div", { style: S.brandBox, children: [
-      /* @__PURE__ */ jsx("div", { style: S.badge, children: badgeText(brand) }),
-      /* @__PURE__ */ jsx("h1", { style: S.h1, children: brandDisplay(brand) }),
-      tagline ? /* @__PURE__ */ jsx("p", { style: { ...S.muted, margin: "8px 0 0", fontSize: 14 }, children: tagline }) : null
-    ] }),
-    children
-  ] }) });
-}
-function AdminShell(props) {
-  const { sections, basePath, brand, client, getToken, signOut, email } = props;
-  const sectionFromPath = useCallback(() => {
-    const fallback = sections[0]?.id ?? "";
-    if (typeof window === "undefined") return fallback;
-    const rest = window.location.pathname.slice(basePath.length).replace(/^\//, "");
-    const id = rest.split("/")[0] ?? "";
-    return sections.some((s) => s.id === id) ? id : fallback;
-  }, [sections, basePath]);
-  const [section, setSection] = useState(sectionFromPath);
-  const go = useCallback(
-    (id) => {
-      window.history.pushState(null, "", `${basePath}/${id}`);
-      setSection(id);
-    },
-    [basePath]
-  );
-  useEffect(() => {
-    const onPop = () => setSection(sectionFromPath());
-    window.addEventListener("popstate", onPop);
-    return () => window.removeEventListener("popstate", onPop);
-  }, [sectionFromPath]);
-  const active = sections.find((s) => s.id === section) ?? sections[0];
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(TopBar, { children: [
-      /* @__PURE__ */ jsxs("a", { className: "topbar-brand", href: "/", style: { display: "inline-flex", alignItems: "center" }, children: [
-        /* @__PURE__ */ jsx("span", { style: S.badgeSm, children: badgeText(brand) }),
-        brandDisplay(brand)
-      ] }),
-      /* @__PURE__ */ jsx("nav", { className: "topbar-nav", "aria-label": "Admin navigation", children: sections.map((s) => /* @__PURE__ */ jsx(TopBarLink, { active: section === s.id, onClick: () => go(s.id), children: s.label }, s.id)) }),
-      /* @__PURE__ */ jsx("div", { className: "topbar-spacer" }),
-      /* @__PURE__ */ jsxs("div", { className: "topbar-actions", children: [
-        /* @__PURE__ */ jsxs("span", { style: S.whoami, children: [
-          /* @__PURE__ */ jsx("span", { style: S.role, children: "admin" }),
-          email ? /* @__PURE__ */ jsx("span", { style: S.muted, children: email }) : null
-        ] }),
-        /* @__PURE__ */ jsx("button", { className: "btn secondary mini", onClick: () => signOut(), children: "Sign out" })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx("main", { className: "shell-main", style: S.main, children: active ? active.render({ client, getToken, navigate: go }) : null })
-  ] });
-}
-
-// src/ui/admin.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-function Authed(props) {
-  const { sections, basePath, brand, crmBasePath, apiBase } = props;
-  const { getToken, signOut } = useClerkAuth();
-  const client = useMemo(
-    () => new CrmClient({
-      basePath: crmBasePath,
-      headers: async () => {
-        const t = await getToken();
-        return t ? { authorization: `Bearer ${t}` } : {};
-      }
-    }),
-    [getToken, crmBasePath]
-  );
-  const [state, setState] = useState2({
-    status: "checking"
-  });
-  useEffect2(() => {
-    let live = true;
-    void (async () => {
-      try {
-        const t = await getToken();
-        const res = await fetch(`${apiBase}/api/me`, { headers: t ? { authorization: `Bearer ${t}` } : {} });
-        const body = await res.json().catch(() => ({}));
-        if (live) setState({ status: body.authorized ? "ok" : "denied", email: body.email ?? null });
-      } catch {
-        if (live) setState({ status: "denied" });
-      }
-    })();
-    return () => {
-      live = false;
-    };
-  }, [getToken, apiBase]);
-  if (state.status === "checking") {
-    return /* @__PURE__ */ jsx2(Gate, { brand, children: /* @__PURE__ */ jsx2("p", { style: S.muted, children: "Checking access\u2026" }) });
-  }
-  if (state.status === "denied") {
-    return /* @__PURE__ */ jsx2(Gate, { brand, children: /* @__PURE__ */ jsxs2("div", { className: "card", style: S.card, children: [
-      /* @__PURE__ */ jsx2("h2", { style: { marginTop: 0 }, children: "Not authorized" }),
-      /* @__PURE__ */ jsxs2("p", { style: S.muted, children: [
-        state.email ? `${state.email} isn't` : "This account isn't",
-        " on the admin list. Ask an existing admin to add you in odla Studio."
-      ] }),
-      /* @__PURE__ */ jsx2("button", { className: "btn secondary", onClick: () => signOut(), style: { marginTop: 12 }, children: "Sign out" })
-    ] }) });
-  }
-  return /* @__PURE__ */ jsx2(
-    AdminShell,
-    {
-      sections,
-      basePath,
-      brand,
-      client,
-      getToken,
-      signOut,
-      email: state.email ?? null
-    }
-  );
-}
-function ChapterAdmin(props) {
-  const sections = props.sections;
-  const basePath = props.basePath ?? "/admin";
-  const brand = props.brand ?? { name: "Admin" };
-  const crmBasePath = props.crmBasePath ?? "/api/crm";
-  const apiBase = props.apiBase ?? "";
-  const [pk, setPk] = useState2(void 0);
-  useEffect2(() => {
-    let live = true;
-    void (async () => {
-      try {
-        const res = await fetch(`${apiBase}/api/config`);
-        const body = await res.json();
-        if (live) setPk(body.clerkPublishableKey ?? null);
-      } catch {
-        if (live) setPk(null);
-      }
-    })();
-    return () => {
-      live = false;
-    };
-  }, [apiBase]);
-  if (pk === void 0) {
-    return /* @__PURE__ */ jsx2(Gate, { brand, children: /* @__PURE__ */ jsx2("p", { style: S.muted, children: "Loading\u2026" }) });
-  }
-  if (!pk) {
-    return /* @__PURE__ */ jsx2(Gate, { brand, children: /* @__PURE__ */ jsxs2("div", { className: "card", style: S.card, children: [
-      /* @__PURE__ */ jsx2("h2", { style: { marginTop: 0 }, children: "Sign-in not configured" }),
-      /* @__PURE__ */ jsx2("p", { style: S.muted, children: "No Clerk publishable key is set for this environment yet." })
-    ] }) });
-  }
-  return /* @__PURE__ */ jsxs2(ClerkGate, { publishableKey: pk, appearance: clerkAppearanceFromTokens(), afterSignOutUrl: "/", children: [
-    /* @__PURE__ */ jsx2(SignedOut, { children: /* @__PURE__ */ jsx2(Gate, { brand, tagline: "Admin sign-in \u2014 invite only", children: /* @__PURE__ */ jsx2(SignIn, { routing: "hash", forceRedirectUrl: basePath, signUpForceRedirectUrl: basePath }) }) }),
-    /* @__PURE__ */ jsx2(SignedIn, { children: /* @__PURE__ */ jsx2(Authed, { sections, basePath, brand, crmBasePath, apiBase }) })
-  ] });
-}
-
-// src/ui/admin-people.tsx
-import { useState as useState3 } from "react";
-import { CrmList, RecordPanel, useCrmQuery, useCrmRecord } from "@odla-ai/crm/ui";
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-function PeopleBody(props) {
-  const { crm, client, type } = props;
-  const hookClient = client;
-  const query = useCrmQuery(hookClient, type);
-  const [openId, setOpenId] = useState3(null);
-  const record = useCrmRecord(hookClient, openId);
-  const [saving, setSaving] = useState3(false);
-  const saveFields = async (input) => {
-    if (!openId) return;
-    setSaving(true);
-    try {
-      await client.updateRecord(openId, { input });
-      record.refresh();
-      query.refresh();
-    } finally {
-      setSaving(false);
-    }
-  };
-  const moveStage = async (to) => {
-    if (!openId) return;
-    await client.setStage(openId, to);
-    record.refresh();
-    query.refresh();
-  };
-  const addTag = async (tag) => {
-    if (openId) {
-      await client.addTag(openId, tag);
-      record.refresh();
-    }
-  };
-  const removeTag = async (tag) => {
-    if (openId) {
-      await client.removeTag(openId, tag);
-      record.refresh();
-    }
-  };
-  return /* @__PURE__ */ jsxs3("div", { className: "wrap", children: [
-    /* @__PURE__ */ jsx3(CrmList, { crm, type, query, onOpenRecord: (r) => setOpenId(r.id) }),
-    record.detail ? /* @__PURE__ */ jsx3(
-      RecordPanel,
-      {
-        crm,
-        detail: record.detail,
-        onSaveFields: saveFields,
-        onMoveStage: moveStage,
-        onAddTag: addTag,
-        onRemoveTag: removeTag,
-        saving
-      }
-    ) : null
-  ] });
-}
-function peopleSection(options) {
-  const { crm, id = "people", label = "People", type = "person" } = options;
-  return { id, label, render: (ctx) => /* @__PURE__ */ jsx3(PeopleBody, { crm, client: ctx.client, type }) };
-}
-
-// src/ui/slot-picker.tsx
-import { useMemo as useMemo2, useState as useState4 } from "react";
-
-// src/ui/datetime.ts
-function tzShort(tz) {
-  try {
-    const parts = new Intl.DateTimeFormat(void 0, { timeZone: tz, timeZoneName: "short" }).formatToParts(
-      /* @__PURE__ */ new Date()
-    );
-    return parts.find((p) => p.type === "timeZoneName")?.value ?? tz;
-  } catch {
-    return tz;
-  }
-}
-function dayKey(ms, tz) {
-  return new Date(ms).toLocaleDateString("en-CA", { timeZone: tz });
-}
-function dayLabel(ms, tz) {
-  return new Date(ms).toLocaleDateString(void 0, { timeZone: tz, weekday: "short", month: "short", day: "numeric" });
-}
-function timeLabel(ms, tz) {
-  return new Date(ms).toLocaleTimeString(void 0, { timeZone: tz, hour: "numeric", minute: "2-digit" });
-}
-function fullLabel(ms, tz) {
-  return new Date(ms).toLocaleString(void 0, {
-    timeZone: tz,
-    weekday: "long",
-    month: "long",
-    day: "numeric",
-    hour: "numeric",
-    minute: "2-digit",
-    timeZoneName: "short"
-  });
-}
-function fmtMoney(cents) {
-  return "$" + Math.round(cents / 100).toLocaleString();
-}
-function fmtDate(ms) {
-  return new Date(ms).toLocaleDateString(void 0, { month: "short", day: "numeric", year: "numeric" });
-}
-function groupSlotsByDay(slots, tz) {
-  const byDay = /* @__PURE__ */ new Map();
-  for (const s of slots) {
-    const k = dayKey(s.startAt, tz);
-    const bucket = byDay.get(k);
-    if (bucket) bucket.push(s);
-    else byDay.set(k, [s]);
-  }
-  return byDay;
-}
-
-// src/ui/slot-picker.tsx
-import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
-var DEFAULT_CLASSES = {
-  days: "slot-days",
-  day: "slot-day",
-  times: "slot-grid",
-  time: "slot-time"
-};
-function SlotPicker(props) {
-  const { slots, timezone, selectedStartAt, onPick, onDayChange, classes = DEFAULT_CLASSES } = props;
-  const byDay = useMemo2(() => groupSlotsByDay(slots, timezone), [slots, timezone]);
-  const dayKeys = [...byDay.keys()];
-  const [activeDay, setActiveDay] = useState4(dayKeys[0]);
-  const day = activeDay !== void 0 && byDay.has(activeDay) ? activeDay : dayKeys[0];
-  const times = (day !== void 0 ? byDay.get(day) : void 0) ?? [];
-  return /* @__PURE__ */ jsxs4(Fragment2, { children: [
-    /* @__PURE__ */ jsx4("div", { className: classes.days, children: dayKeys.map((key) => {
-      const first = byDay.get(key)?.[0];
-      return /* @__PURE__ */ jsx4(
-        "button",
-        {
-          type: "button",
-          className: classes.day,
-          "aria-pressed": key === day,
-          onClick: () => {
-            setActiveDay(key);
-            onDayChange?.();
-          },
-          children: first ? dayLabel(first.startAt, timezone) : key
-        },
-        key
-      );
-    }) }),
-    /* @__PURE__ */ jsx4("div", { className: classes.times, children: times.map((s) => /* @__PURE__ */ jsx4(
-      "button",
-      {
-        type: "button",
-        className: classes.time,
-        "aria-pressed": selectedStartAt === s.startAt,
-        onClick: () => onPick(s),
-        children: timeLabel(s.startAt, timezone)
-      },
-      s.startAt
-    )) })
-  ] });
-}
-
-// src/ui/members.tsx
-import { useEffect as useEffect3, useState as useState6 } from "react";
-
-// src/ui/reschedule.tsx
-import { useState as useState5 } from "react";
-import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
-function Rescheduler(props) {
-  const { api, applicationId, timezone, onRescheduled, label = "Change your time" } = props;
-  const [open, setOpen] = useState5(false);
-  const [slots, setSlots] = useState5(null);
-  const [tz, setTz] = useState5(timezone);
-  const [busy, setBusy] = useState5(false);
-  const [msg, setMsg] = useState5(null);
-  const start = async () => {
-    setOpen(true);
-    setSlots(null);
-    setMsg(null);
-    try {
-      const r = await api("/api/schedule/slots");
-      if (r.schedulingReady === false) {
-        setSlots([]);
-        setMsg("Scheduling is briefly unavailable. We'll reach out by email to arrange your call.");
-        return;
-      }
-      setSlots(r.slots ?? []);
-      if (r.timezone) setTz(r.timezone);
-    } catch {
-      setSlots([]);
-      setMsg("Times are briefly unavailable. Please try again.");
-    }
-  };
-  const pick = async (slot) => {
-    setBusy(true);
-    setMsg(null);
-    try {
-      await api("/api/schedule/book", { method: "POST", body: JSON.stringify({ applicationId, startAt: slot.startAt }) });
-      setOpen(false);
-      await onRescheduled();
-    } catch (e) {
-      setMsg(e instanceof Error ? e.message : "That time is no longer available. Please pick another.");
-    } finally {
-      setBusy(false);
-    }
-  };
-  if (!open) {
-    return /* @__PURE__ */ jsx5("p", { className: "meeting-note", children: /* @__PURE__ */ jsx5(
-      "a",
-      {
-        href: "#",
-        onClick: (e) => {
-          e.preventDefault();
-          void start();
-        },
-        children: label
-      }
-    ) });
-  }
-  return /* @__PURE__ */ jsxs5("div", { className: "msched", children: [
-    slots === null ? /* @__PURE__ */ jsx5("p", { className: "meeting-note", children: "Loading available times\u2026" }) : slots.length === 0 ? /* @__PURE__ */ jsx5("p", { className: "meeting-note", children: msg ?? "No open times right now. Please check back soon." }) : /* @__PURE__ */ jsx5(
-      SlotPicker,
-      {
-        slots,
-        timezone: tz,
-        classes: { days: "msched-days", day: "msched-day", times: "msched-times", time: "msched-time" },
-        onPick: (s) => void pick(s)
-      }
-    ),
-    busy ? /* @__PURE__ */ jsx5("p", { className: "meeting-note", children: "Rescheduling\u2026" }) : null,
-    msg && slots && slots.length > 0 ? /* @__PURE__ */ jsx5("p", { className: "meeting-note error", children: msg }) : null,
-    /* @__PURE__ */ jsx5("p", { className: "meeting-note", children: /* @__PURE__ */ jsx5(
-      "a",
-      {
-        href: "#",
-        onClick: (e) => {
-          e.preventDefault();
-          setOpen(false);
-        },
-        children: "Keep my current time"
-      }
-    ) })
-  ] });
-}
-
-// src/ui/members.tsx
-import { Fragment as Fragment3, jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
-function card(kicker, body) {
-  return /* @__PURE__ */ jsxs6("div", { className: "card", children: [
-    /* @__PURE__ */ jsx6("div", { className: "card-label", children: "Your Application" }),
-    /* @__PURE__ */ jsxs6("div", { className: "meeting-block", children: [
-      /* @__PURE__ */ jsx6("div", { className: "meeting-kicker", children: kicker }),
-      body
-    ] })
-  ] });
-}
-function ProvisionalCard(props) {
-  const { api, application, applyHref, onReschedule } = props;
-  if (!application) {
-    return card(
-      "One step remains",
-      /* @__PURE__ */ jsxs6(Fragment3, { children: [
-        /* @__PURE__ */ jsx6("div", { className: "meeting-note", children: "Your account is ready, and the application that completes it takes a few minutes." }),
-        /* @__PURE__ */ jsx6("a", { className: "apply-link", href: applyHref, children: "Apply for membership" })
-      ] })
-    );
-  }
-  if (application.status === "refunded") {
-    return card("Membership refunded", /* @__PURE__ */ jsx6("div", { className: "meeting-note", children: "Your fee has been refunded in full and your membership is canceled." }));
-  }
-  const membership = application.paid ? /* @__PURE__ */ jsxs6("div", { className: "meeting-note", children: [
-    "Your membership is active",
-    application.renewalAt ? ` and renews ${fmtDate(application.renewalAt)}` : "",
-    "."
-  ] }) : null;
-  if (application.meetingAt) {
-    return card(
-      "Your introduction call",
-      /* @__PURE__ */ jsxs6(Fragment3, { children: [
-        /* @__PURE__ */ jsx6("div", { className: "meeting-date", children: fullLabel(application.meetingAt, application.timezone) }),
-        /* @__PURE__ */ jsx6("div", { className: "meeting-note", children: "A calendar invitation with the video call link is in your email." }),
-        application.meetUrl ? /* @__PURE__ */ jsx6("div", { className: "meeting-note", children: /* @__PURE__ */ jsx6("a", { href: application.meetUrl, target: "_blank", rel: "noopener", children: "Join the video call" }) }) : null,
-        /* @__PURE__ */ jsx6(Rescheduler, { api, applicationId: application.id, timezone: application.timezone, onRescheduled: onReschedule }),
-        membership
-      ] })
-    );
-  }
-  return card(
-    "Book your introduction call",
-    /* @__PURE__ */ jsxs6(Fragment3, { children: [
-      /* @__PURE__ */ jsx6("div", { className: "meeting-note", children: "Your application is in. Choose a time below, and a calendar invitation will reach your email." }),
-      /* @__PURE__ */ jsx6(Rescheduler, { api, applicationId: application.id, timezone: application.timezone, onRescheduled: onReschedule, label: "Choose a time" }),
-      membership
-    ] })
-  );
-}
-function MembersArea(props) {
-  const { api, signOut, adminHref = "/admin/", applyHref = "/join.html", memberContent } = props;
-  const [me, setMe] = useState6(null);
-  const [error, setError] = useState6(false);
-  const reload = async () => {
-    try {
-      setMe(await api("/api/me"));
-    } catch {
-      setError(true);
-    }
-  };
-  useEffect3(() => {
-    void reload();
-  }, []);
-  if (error) return /* @__PURE__ */ jsx6("p", { className: "meeting-note", children: "Sign in is briefly unavailable. Please refresh." });
-  if (!me) return /* @__PURE__ */ jsx6("p", { className: "meeting-note", children: "Loading\u2026" });
-  const role = me.role || "provisional";
-  return /* @__PURE__ */ jsxs6(Fragment3, { children: [
-    /* @__PURE__ */ jsxs6("div", { className: "card", children: [
-      /* @__PURE__ */ jsxs6("div", { className: "member-row", children: [
-        /* @__PURE__ */ jsx6("span", { className: "member-email", children: me.email }),
-        /* @__PURE__ */ jsx6("span", { className: "role-badge " + role, children: role })
-      ] }),
-      /* @__PURE__ */ jsxs6("div", { className: "account-actions", children: [
-        /* @__PURE__ */ jsx6("button", { className: "btn secondary mini", onClick: signOut, children: "Sign out" }),
-        role === "admin" ? /* @__PURE__ */ jsx6("a", { className: "admin-console-link", href: adminHref, children: "Admin console" }) : null
-      ] })
-    ] }),
-    role === "provisional" ? /* @__PURE__ */ jsx6(ProvisionalCard, { api, application: me.application, applyHref, onReschedule: reload }) : memberContent ?? /* @__PURE__ */ jsx6("div", { className: "card", children: /* @__PURE__ */ jsx6("div", { className: "card-label", children: "Welcome back." }) })
-  ] });
-}
-
-// src/ui/join.tsx
-import { useEffect as useEffect4, useState as useState8 } from "react";
-
-// src/ui/payment-step.tsx
-import { useRef, useState as useState7 } from "react";
-import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
-var loader = null;
-function loadStripe() {
-  const existing = globalThis.Stripe;
-  if (existing) return Promise.resolve(existing);
-  if (!loader) {
-    loader = new Promise((resolve, reject) => {
-      const s = document.createElement("script");
-      s.src = "https://js.stripe.com/v3/";
-      s.onload = () => {
-        const fn = globalThis.Stripe;
-        if (fn) resolve(fn);
-        else reject(new Error("stripe.js unavailable"));
-      };
-      s.onerror = () => reject(new Error("stripe.js failed to load"));
-      document.head.appendChild(s);
-    });
-  }
-  return loader;
-}
-function PaymentStep(props) {
-  const { applicationId, refundPolicyText, onPaid } = props;
-  const [status, setStatus] = useState7("idle");
-  const [error, setError] = useState7(null);
-  const mountRef = useRef(null);
-  const stripeRef = useRef(null);
-  const elementsRef = useRef(null);
-  const begin = async () => {
-    setStatus("loading");
-    setError(null);
-    try {
-      const res = await fetch("/api/payments/subscription", {
-        method: "POST",
-        headers: { "content-type": "application/json" },
-        body: JSON.stringify({ applicationId, refundPolicyAck: true })
-      });
-      const data = await res.json();
-      if (!res.ok || !data.clientSecret || !data.publishableKey) throw new Error("Payment could not be set up. Please try again.");
-      const stripe = (await loadStripe())(data.publishableKey);
-      const elements = stripe.elements({ clientSecret: data.clientSecret });
-      const element = elements.create("payment");
-      if (mountRef.current) element.mount(mountRef.current);
-      stripeRef.current = stripe;
-      elementsRef.current = elements;
-      setStatus("ready");
-    } catch (e) {
-      setStatus("idle");
-      setError(e instanceof Error ? e.message : "Payment could not be set up. Please try again.");
-    }
-  };
-  const pay = async () => {
-    const stripe = stripeRef.current;
-    const elements = elementsRef.current;
-    if (!stripe || !elements) return;
-    setStatus("confirming");
-    setError(null);
-    const returnUrl = typeof window !== "undefined" ? `${window.location.origin}${window.location.pathname}?redirect_status=succeeded` : void 0;
-    const result = await stripe.confirmPayment({ elements, confirmParams: { return_url: returnUrl }, redirect: "if_required" });
-    if (result.error) {
-      setError(result.error.message ?? "The payment could not be completed.");
-      setStatus("ready");
-      return;
-    }
-    const paid = result.paymentIntent?.status;
-    if (paid === "succeeded" || paid === "processing") onPaid();
-    else {
-      setError("The payment did not complete. Please try again.");
-      setStatus("ready");
-    }
-  };
-  return /* @__PURE__ */ jsxs7("div", { className: "join-pay", children: [
-    /* @__PURE__ */ jsxs7("label", { className: "compliance-box", children: [
-      /* @__PURE__ */ jsx7(
-        "input",
-        {
-          type: "checkbox",
-          disabled: status !== "idle",
-          onChange: (e) => {
-            if (e.currentTarget.checked) void begin();
-          }
-        }
-      ),
-      /* @__PURE__ */ jsx7("span", { children: refundPolicyText })
-    ] }),
-    status === "loading" ? /* @__PURE__ */ jsx7("p", { className: "pay-status", children: "Preparing secure payment\u2026" }) : null,
-    /* @__PURE__ */ jsx7("div", { ref: mountRef, hidden: status === "idle" || status === "loading" }),
-    status === "ready" || status === "confirming" ? /* @__PURE__ */ jsx7("button", { className: "submit-btn", disabled: status === "confirming", onClick: () => void pay(), children: status === "confirming" ? "Processing\u2026" : "Pay and continue" }) : null,
-    error ? /* @__PURE__ */ jsx7("p", { className: "pay-error", children: error }) : null
-  ] });
-}
-
-// src/ui/join.tsx
-import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
-function JoinBooking(props) {
-  const { applicationId, onBooked } = props;
-  const [state, setState] = useState8(null);
-  const [msg, setMsg] = useState8(null);
-  const [busy, setBusy] = useState8(false);
-  const [selected, setSelected] = useState8(null);
-  const load = async () => {
-    setMsg(null);
-    try {
-      const res = await fetch("/api/schedule/slots");
-      const data = await res.json();
-      if (data.schedulingReady === false || !data.slots?.length) {
-        setState(null);
-        setMsg("Scheduling is briefly unavailable \u2014 we'll reach out by email to arrange your call.");
-        return;
-      }
-      setState({ slots: data.slots, timezone: data.timezone ?? "UTC" });
-    } catch {
-      setMsg("Times are briefly unavailable. Please try again.");
-    }
-  };
-  useEffect4(() => {
-    void load();
-  }, []);
-  const book = async () => {
-    if (!selected) return;
-    setBusy(true);
-    setMsg(null);
-    try {
-      const res = await fetch("/api/schedule/book", {
-        method: "POST",
-        headers: { "content-type": "application/json" },
-        body: JSON.stringify({ applicationId, startAt: selected.startAt })
-      });
-      const data = await res.json();
-      if (res.status === 409 && data.code === "calendar_slot_unavailable") {
-        setSelected(null);
-        setMsg("That time was just taken. Here are the current openings.");
-        await load();
-        return;
-      }
-      if (!res.ok) throw new Error(data.error ?? "The booking could not be completed.");
-      onBooked({ startAt: data.startAt ?? selected.startAt, timezone: state?.timezone ?? "UTC" });
-    } catch (e) {
-      setMsg(e instanceof Error ? e.message : "The booking could not be completed.");
-    } finally {
-      setBusy(false);
-    }
-  };
-  if (!state) return /* @__PURE__ */ jsx8("p", { className: "slots-status", children: msg ?? "Loading available times\u2026" });
-  return /* @__PURE__ */ jsxs8("div", { className: "join-book", children: [
-    /* @__PURE__ */ jsx8(
-      SlotPicker,
-      {
-        slots: state.slots,
-        timezone: state.timezone,
-        selectedStartAt: selected?.startAt,
-        onPick: setSelected,
-        onDayChange: () => setSelected(null)
-      }
-    ),
-    /* @__PURE__ */ jsxs8("div", { className: "slot-confirm", hidden: !selected, children: [
-      /* @__PURE__ */ jsx8("button", { className: "submit-btn", disabled: busy, onClick: () => void book(), children: busy ? "Booking\u2026" : "Book this time" }),
-      msg ? /* @__PURE__ */ jsx8("p", { className: "step2-note", children: msg }) : null
-    ] })
-  ] });
-}
-function JoinIsland(props) {
-  const { config, children, membersHref = "/members/" } = props;
-  const [step, setStep] = useState8("form");
-  const [applicationId, setApplicationId] = useState8(null);
-  const [error, setError] = useState8(null);
-  const [submitting, setSubmitting] = useState8(false);
-  const [booked, setBooked] = useState8(null);
-  const submit = async (e) => {
-    e.preventDefault();
-    setSubmitting(true);
-    setError(null);
-    try {
-      const fields = {};
-      for (const [k, v] of new FormData(e.currentTarget).entries()) fields[k] = v;
-      fields.submissionId = crypto.randomUUID();
-      const res = await fetch("/api/applications", {
-        method: "POST",
-        headers: { "content-type": "application/json" },
-        body: JSON.stringify(fields)
-      });
-      const data = await res.json();
-      if (!res.ok || !data.id) throw new Error(data.error ?? "Your application could not be submitted.");
-      setApplicationId(data.id);
-      setStep(config.paymentsReady ? "pay" : "book");
-    } catch (err) {
-      setError(err instanceof Error ? err.message : "Something went wrong. Please try again.");
-    } finally {
-      setSubmitting(false);
-    }
-  };
-  if (step === "done" && booked) {
-    return /* @__PURE__ */ jsxs8("div", { className: "join-done card", children: [
-      /* @__PURE__ */ jsx8("div", { className: "card-label", children: "You're booked" }),
-      /* @__PURE__ */ jsx8("p", { className: "meeting-date", children: fullLabel(booked.startAt, booked.timezone) }),
-      /* @__PURE__ */ jsx8("p", { className: "meeting-note", children: "A calendar invitation with the video call link is on its way to your email." }),
-      /* @__PURE__ */ jsx8("a", { className: "apply-link", href: membersHref, children: "Go to your member area" })
-    ] });
-  }
-  if (step === "book" && applicationId) {
-    return /* @__PURE__ */ jsx8(
-      JoinBooking,
-      {
-        applicationId,
-        onBooked: (b) => {
-          setBooked(b);
-          setStep("done");
-        }
-      }
-    );
-  }
-  if (step === "pay" && applicationId) {
-    return /* @__PURE__ */ jsx8(PaymentStep, { applicationId, refundPolicyText: config.refundPolicyText ?? "", onPaid: () => setStep("book") });
-  }
-  return /* @__PURE__ */ jsxs8("form", { className: "join-form", onSubmit: (e) => void submit(e), children: [
-    children,
-    error ? /* @__PURE__ */ jsx8("p", { className: "join-error", children: error }) : null,
-    /* @__PURE__ */ jsx8("button", { className: "submit-btn", type: "submit", disabled: submitting, children: submitting ? "Submitting\u2026" : "Submit application" })
-  ] });
-}
-
-// src/brand.ts
-function paletteVar(key) {
-  return key.startsWith("--") ? key : `--${key}`;
-}
-function cleanValue(value) {
-  return value.replace(/[<>{};]/g, "").trim();
-}
-function brandTokens(brand) {
-  if (!brand) return "";
-  const decls = [];
-  for (const [key, value] of Object.entries(brand.palette ?? {})) {
-    if (typeof value === "string" && value.trim()) decls.push(`${paletteVar(key)}: ${cleanValue(value)};`);
-  }
-  const fonts = brand.fonts;
-  if (fonts?.display) decls.push(`--ui-font-display: ${cleanValue(fonts.display)};`);
-  if (fonts?.body) decls.push(`--ui-font-sans: ${cleanValue(fonts.body)};`);
-  if (fonts?.numeral) decls.push(`--ui-font-numeral: ${cleanValue(fonts.numeral)};`);
-  return decls.length ? `:root {
-  ${decls.join("\n  ")}
-}
-` : "";
-}
-
-// src/ui/brand-style.tsx
-import { jsx as jsx9 } from "react/jsx-runtime";
-function BrandStyle(props) {
-  const css = brandTokens(props.brand);
-  if (!css) return null;
-  return /* @__PURE__ */ jsx9("style", { children: css });
-}
+import {
+  BrandStyle,
+  JoinIsland,
+  MembersArea,
+  PaymentStep,
+  Rescheduler,
+  SlotPicker,
+  dayKey,
+  dayLabel,
+  fmtDate,
+  fmtMoney,
+  fullLabel,
+  groupSlotsByDay,
+  timeLabel,
+  tzShort
+} from "../chunk-ZCZK6QLC.js";
+import {
+  ChapterAdmin,
+  peopleSection
+} from "../chunk-YO6DY5DL.js";
 export {
   BrandStyle,
   ChapterAdmin,