@sesionario/blocks 1.39.0 → 1.40.0

package/dist/index.js

@@ -23,6 +23,7 @@ import flags from 'react-phone-number-input/flags';
 import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
 import { MessageScroller as MessageScroller$1 } from '@shadcn/react/message-scroller';
 export { useMessageScroller, useMessageScrollerScrollable, useMessageScrollerVisibility } from '@shadcn/react/message-scroller';
+import { Slot as Slot$1 } from 'radix-ui';
 
 var LanguageContext = createContext(null);
 function useLanguageContext() {
@@ -602,7 +603,7 @@ function useEditableSection({
     },
     resolvedLabels,
     contentStyle: stableHeight && minHeightPx != null ? { minHeight: minHeightPx } : void 0,
-    actionsClassName: "flex min-h-9 min-w-[11rem] flex-wrap items-center justify-end gap-2"
+    actionsClassName: "flex min-h-9 w-full flex-wrap items-center gap-2 *:flex-1 sm:w-auto sm:min-w-[11rem] sm:justify-end sm:*:flex-none"
   };
 }
 function EditableSection({
@@ -4700,6 +4701,7 @@ function useSearchHotkey(options = {}) {
 }
 
 // src/lib/scroll-restoration/store.ts
+var programmaticDepth = 0;
 var MAX_MARKS = 30;
 var MAX_SNAPSHOT_ROUTES = 3;
 var PENDING_TRAVERSAL_TTL_MS = 1e3;
@@ -4791,6 +4793,9 @@ function consumePendingTraversal(routeKey) {
   clearPendingTraversalTimer();
   return true;
 }
+function isProgrammaticScroll() {
+  return programmaticDepth > 0;
+}
 function getScrollTop(container) {
   if (!container) {
     return window.scrollY || document.documentElement.scrollTop || 0;
@@ -4798,11 +4803,37 @@ function getScrollTop(container) {
   return container.scrollTop;
 }
 function setScrollTop(container, top) {
-  if (!container) {
-    window.scrollTo(0, top);
-    return;
+  programmaticDepth += 1;
+  try {
+    if (!container) {
+      window.scrollTo({ top, left: 0, behavior: "instant" });
+      return;
+    }
+    container.scrollTop = top;
+  } finally {
+    queueMicrotask(() => {
+      programmaticDepth = Math.max(0, programmaticDepth - 1);
+    });
   }
-  container.scrollTop = top;
+}
+function isOverflowScrollport(element) {
+  const overflow = getComputedStyle(element).overflowY;
+  return overflow === "auto" || overflow === "scroll" || overflow === "overlay";
+}
+function resolveScrollPort(container) {
+  if (!container) return "window";
+  const windowTop = getScrollTop(null);
+  const nestedTop = container.scrollTop;
+  if (nestedTop > windowTop) return "container";
+  if (windowTop > nestedTop) return "window";
+  return isOverflowScrollport(container) ? "container" : "window";
+}
+function resetScrollports(container) {
+  setScrollTop(null, 0);
+  if (container) setScrollTop(container, 0);
+}
+function portNode(container, port) {
+  return port === "container" ? container : null;
 }
 function scrollportTop(container) {
   return container ? container.getBoundingClientRect().top : 0;
@@ -4844,11 +4875,14 @@ function resolveAnchor(container, attribute) {
   return { id: bestId, top: bestTop };
 }
 function captureMark(container, attribute) {
-  const anchor = resolveAnchor(container, attribute);
+  const port = resolveScrollPort(container);
+  const node = portNode(container, port);
+  const anchor = resolveAnchor(node, attribute);
   return {
-    top: getScrollTop(container),
+    top: getScrollTop(node),
     anchorId: anchor?.id ?? null,
-    anchorTop: anchor?.top ?? 0
+    anchorTop: anchor?.top ?? 0,
+    port
   };
 }
 function applyMark(container, mark, attribute) {
@@ -4868,6 +4902,22 @@ function applyMark(container, mark, attribute) {
   setScrollTop(container, mark.top);
   return false;
 }
+function restoreScrollports(container, mark, attribute) {
+  const port = mark.port ?? "window";
+  switch (port) {
+    case "container":
+      setScrollTop(null, 0);
+      if (!container) return false;
+      return applyMark(container, mark, attribute);
+    case "window":
+      if (container) setScrollTop(container, 0);
+      return applyMark(null, mark, attribute);
+    default: {
+      const exhaustive = port;
+      return exhaustive;
+    }
+  }
+}
 function getScrollHeight(container) {
   if (!container) {
     return Math.max(
@@ -4883,8 +4933,37 @@ var ScrollRestorationContext = createContext(null);
 function useScrollRestorationContext() {
   return useContext(ScrollRestorationContext);
 }
-function readContainer(containerRef) {
-  return containerRef?.current ?? null;
+function readContainer(containerRef, registered) {
+  return registered ?? containerRef?.current ?? null;
+}
+var USER_INTENT_EVENTS = [
+  "wheel",
+  "touchstart",
+  "keydown",
+  "pointerdown"
+];
+function listenForUserIntent(onIntent) {
+  for (const type of USER_INTENT_EVENTS) {
+    window.addEventListener(type, onIntent, { passive: true, once: true });
+  }
+  return () => {
+    for (const type of USER_INTENT_EVENTS) {
+      window.removeEventListener(type, onIntent);
+    }
+  };
+}
+function useRegisterScrollContainer(containerRef) {
+  const ctx = useScrollRestorationContext();
+  const setContainerRef = useRef(ctx?.setScrollContainer);
+  setContainerRef.current = ctx?.setScrollContainer;
+  useLayoutEffect(() => {
+    const setContainer = setContainerRef.current;
+    if (!setContainer) return;
+    setContainer(containerRef.current);
+    return () => {
+      setContainer(null);
+    };
+  }, [containerRef]);
 }
 function ScrollRestorationProvider({
   routeKey,
@@ -4901,13 +4980,23 @@ function ScrollRestorationProvider({
     };
   }
   const isTraversal = traversalForRouteRef.current.isTraversal;
+  const registeredContainerRef = useRef(null);
+  const [scrollContainerNode, setScrollContainerNode] = useState(null);
+  const setScrollContainer = useCallback((node) => {
+    registeredContainerRef.current = node;
+    setScrollContainerNode((current) => current === node ? current : node);
+  }, []);
+  const readActiveContainer = useCallback(() => {
+    return readContainer(containerRef, registeredContainerRef.current);
+  }, [containerRef]);
   const value = useMemo(
     () => ({
       routeKey,
       isTraversal,
-      anchorAttribute
+      anchorAttribute,
+      setScrollContainer
     }),
-    [routeKey, isTraversal, anchorAttribute]
+    [routeKey, isTraversal, anchorAttribute, setScrollContainer]
   );
   useEffect(() => {
     if (typeof window === "undefined" || !("scrollRestoration" in history)) {
@@ -4922,34 +5011,50 @@ function ScrollRestorationProvider({
   const prevRouteKeyRef = useRef(routeKey);
   const anchorAttributeRef = useRef(anchorAttribute);
   anchorAttributeRef.current = anchorAttribute;
+  useLayoutEffect(() => {
+    const nodes = [document.documentElement];
+    const container = readActiveContainer();
+    if (container) nodes.push(container);
+    const previous = nodes.map((node) => node.style.overflowAnchor);
+    for (const node of nodes) node.style.overflowAnchor = "none";
+    return () => {
+      nodes.forEach((node, index) => {
+        node.style.overflowAnchor = previous[index] ?? "";
+      });
+    };
+  }, [readActiveContainer, scrollContainerNode]);
   useEffect(() => {
-    const container = readContainer(containerRef);
-    const target = container ?? window;
+    const container = readActiveContainer();
     let rafId = 0;
     const onScroll = () => {
+      if (isProgrammaticScroll()) return;
       if (rafId) return;
       rafId = requestAnimationFrame(() => {
         rafId = 0;
         setScrollMark(
           routeKey,
-          captureMark(readContainer(containerRef), anchorAttribute)
+          captureMark(readActiveContainer(), anchorAttribute)
         );
       });
     };
-    target.addEventListener("scroll", onScroll, { passive: true });
+    window.addEventListener("scroll", onScroll, { passive: true });
+    container?.addEventListener("scroll", onScroll, { passive: true });
     return () => {
-      target.removeEventListener("scroll", onScroll);
+      window.removeEventListener("scroll", onScroll);
+      container?.removeEventListener("scroll", onScroll);
       if (rafId) cancelAnimationFrame(rafId);
     };
-  }, [routeKey, containerRef, anchorAttribute]);
+  }, [routeKey, anchorAttribute, readActiveContainer, scrollContainerNode]);
   useLayoutEffect(() => {
-    const container = readContainer(containerRef);
+    const container = readActiveContainer();
     const prevKey = prevRouteKeyRef.current;
     if (prevKey !== routeKey) {
-      setScrollMark(
-        prevKey,
-        captureMark(container, anchorAttributeRef.current)
-      );
+      const fresh = captureMark(container, anchorAttributeRef.current);
+      const existing = getScrollMark(prevKey);
+      const paneUnmounted = existing?.port === "container" && fresh.port === "window" && fresh.top === 0 && container === null;
+      if (!paneUnmounted) {
+        setScrollMark(prevKey, fresh);
+      }
       prevRouteKeyRef.current = routeKey;
     }
     const hasHash = typeof window !== "undefined" && window.location.hash.length > 1;
@@ -4957,51 +5062,58 @@ function ScrollRestorationProvider({
       consumePendingTraversal(routeKey);
       const mark = getScrollMark(routeKey);
       if (!mark) return void 0;
-      applyMark(container, mark, anchorAttribute);
-      return startStabilizationLoop(container, mark, anchorAttribute);
+      restoreScrollports(container, mark, anchorAttribute);
+      return startStabilizationLoop(
+        () => readActiveContainer(),
+        mark,
+        anchorAttribute
+      );
     }
     clearRoute(routeKey);
-    if (!hasHash) {
-      setScrollTop(container, 0);
-    }
-    return void 0;
-  }, [routeKey, isTraversal, containerRef, anchorAttribute]);
+    if (hasHash) return void 0;
+    return startFreshReset(readActiveContainer);
+  }, [routeKey, isTraversal, anchorAttribute, readActiveContainer]);
   return /* @__PURE__ */ jsx(ScrollRestorationContext.Provider, { value, children });
 }
-function startStabilizationLoop(container, mark, attribute) {
+function startFreshReset(readContainer2) {
+  let cancelled = false;
+  const apply = () => {
+    if (cancelled) return;
+    resetScrollports(readContainer2());
+  };
+  apply();
+  let rafId = requestAnimationFrame(() => {
+    rafId = 0;
+    apply();
+  });
+  const stopIntent = listenForUserIntent(() => {
+    cancelled = true;
+    if (rafId) cancelAnimationFrame(rafId);
+    rafId = 0;
+  });
+  return () => {
+    cancelled = true;
+    if (rafId) cancelAnimationFrame(rafId);
+    stopIntent();
+  };
+}
+function startStabilizationLoop(readContainer2, mark, attribute) {
+  const portNode2 = () => (mark.port ?? "window") === "container" ? readContainer2() : null;
   const startedAt = performance.now();
-  let lastHeight = getScrollHeight(container);
+  let lastHeight = getScrollHeight(portNode2());
   let rafId = 0;
   let aborted = false;
   const abort = () => {
     aborted = true;
   };
-  const onUserIntent = () => {
-    abort();
-  };
-  window.addEventListener("wheel", onUserIntent, {
-    passive: true,
-    once: true
-  });
-  window.addEventListener("touchstart", onUserIntent, {
-    passive: true,
-    once: true
-  });
-  window.addEventListener("keydown", onUserIntent, {
-    passive: true,
-    once: true
-  });
-  window.addEventListener("pointerdown", onUserIntent, {
-    passive: true,
-    once: true
-  });
+  const stopIntent = listenForUserIntent(abort);
   const tick = () => {
     if (aborted) return;
     if (performance.now() - startedAt > STABILIZE_MS) return;
-    const height = getScrollHeight(container);
+    const height = getScrollHeight(portNode2());
     if (height !== lastHeight) {
       lastHeight = height;
-      applyMark(container, mark, attribute);
+      restoreScrollports(readContainer2(), mark, attribute);
     }
     rafId = requestAnimationFrame(tick);
   };
@@ -5009,10 +5121,7 @@ function startStabilizationLoop(container, mark, attribute) {
   return () => {
     abort();
     if (rafId) cancelAnimationFrame(rafId);
-    window.removeEventListener("wheel", onUserIntent);
-    window.removeEventListener("touchstart", onUserIntent);
-    window.removeEventListener("keydown", onUserIntent);
-    window.removeEventListener("pointerdown", onUserIntent);
+    stopIntent();
   };
 }
 
@@ -8082,7 +8191,652 @@ function useRealtimeChannel({
     };
   }, [enabled, reconnectDelayMs]);
 }
+var badgeVariants = cva(
+  "inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3",
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
+        secondary: "bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
+        destructive: "bg-destructive text-white focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40 [a&]:hover:bg-destructive/90",
+        outline: "border-border text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
+        ghost: "[a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 [a&]:hover:underline"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function Badge({
+  className,
+  variant = "default",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot$1.Root : "span";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      "data-slot": "badge",
+      "data-variant": variant,
+      className: cn(badgeVariants({ variant }), className),
+      ...props
+    }
+  );
+}
+var INVITE_EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/i;
+var INVITE_STATUS_CLASS = {
+  pending: "border-amber-500/40 bg-amber-500/15 font-medium text-amber-800 dark:text-amber-300",
+  claimed: "border-emerald-500/40 bg-emerald-500/15 font-medium text-emerald-800 dark:text-emerald-300",
+  failed: "border-destructive/40 bg-destructive/15 font-medium text-destructive",
+  cancelled: "text-muted-foreground"
+};
+var INVITE_STATUS_LABELS = {
+  es: {
+    pending: "Pendiente",
+    claimed: "Registrado",
+    failed: "Con error",
+    cancelled: "Cancelada"
+  },
+  en: {
+    pending: "Pending",
+    claimed: "Registered",
+    failed: "Error",
+    cancelled: "Cancelled"
+  }
+};
+function inviteStatusLabel(status, language) {
+  const labels = language.startsWith("en") ? INVITE_STATUS_LABELS.en : INVITE_STATUS_LABELS.es;
+  switch (status) {
+    case "pending":
+    case "claimed":
+    case "failed":
+    case "cancelled":
+      return labels[status];
+    default:
+      return status;
+  }
+}
+function resendWaitMessage(waitSeconds) {
+  const total = Math.max(0, Math.ceil(waitSeconds));
+  if (total < 60) {
+    const secondLabel2 = total === 1 ? "segundo" : "segundos";
+    return `Espera ${total} ${secondLabel2} antes de reenviar`;
+  }
+  const minutes = Math.floor(total / 60);
+  const seconds = total % 60;
+  const minuteLabel = minutes === 1 ? "minuto" : "minutos";
+  if (seconds === 0)
+    return `Espera ${minutes} ${minuteLabel} antes de reenviar`;
+  const secondLabel = seconds === 1 ? "segundo" : "segundos";
+  return `Espera ${minutes} ${minuteLabel} y ${seconds} ${secondLabel} antes de reenviar`;
+}
+function isInviteEmail(value) {
+  const email = value.trim().toLowerCase();
+  return email.length > 0 && email.length <= 320 && INVITE_EMAIL_RE.test(email);
+}
+function mergeInviteEmails(current, raw) {
+  const pills = [...current];
+  const seen = new Set(pills);
+  const invalid = [];
+  for (const part of raw.split(/[\n,;]+/)) {
+    const token = part.trim();
+    if (!token) continue;
+    const email = token.toLowerCase();
+    if (!isInviteEmail(email)) {
+      invalid.push(token);
+      continue;
+    }
+    if (seen.has(email)) continue;
+    seen.add(email);
+    pills.push(email);
+  }
+  return { pills, invalid };
+}
+async function readJson(res) {
+  return await res.json();
+}
+function MembershipInvitePanel({
+  basePath,
+  query,
+  onQueryChange,
+  onNotify,
+  onConfigure
+}) {
+  const language = useLanguageContext()?.language ?? "es";
+  const [configured, setConfigured] = useState(null);
+  const [types, setTypes] = useState([]);
+  const [tab, setTab] = useState("emails");
+  const [emailPills, setEmailPills] = useState([]);
+  const [emailDraft, setEmailDraft] = useState("");
+  const [csvText, setCsvText] = useState("");
+  const [typeId, setTypeId] = useState("");
+  const [paidUp, setPaidUp] = useState(null);
+  const [unpaidPolicy, setUnpaidPolicy] = useState("lapsed_with_charge");
+  const [graceDays, setGraceDays] = useState("30");
+  const [sendInvites, setSendInvites] = useState(true);
+  const [preview, setPreview] = useState(null);
+  const [busy, setBusy] = useState(false);
+  const [items, setItems] = useState([]);
+  const [nextCursor, setNextCursor] = useState(null);
+  const [listLoading, setListLoading] = useState(true);
+  const [draftQ, setDraftQ] = useState(query.q);
+  const [cancelId, setCancelId] = useState(null);
+  const [refresh, setRefresh] = useState(0);
+  useEffect(() => {
+    let cancelled = false;
+    void (async () => {
+      const res = await fetch(`${basePath}/membership-invites/options`, {
+        credentials: "include"
+      });
+      const body = await readJson(res);
+      if (cancelled) return;
+      const result = body.result;
+      setConfigured(Boolean(result?.configured));
+      const nextTypes = result?.types ?? [];
+      setTypes(nextTypes);
+      setTypeId((current) => current || nextTypes[0]?.id || "");
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, [basePath]);
+  useEffect(() => {
+    const handle = setTimeout(() => {
+      if (draftQ !== query.q)
+        onQueryChange({ q: draftQ, status: query.status });
+    }, 300);
+    return () => clearTimeout(handle);
+  }, [draftQ, onQueryChange, query.q, query.status]);
+  useEffect(() => {
+    let cancelled = false;
+    setListLoading(true);
+    const params = new URLSearchParams();
+    if (query.q) params.set("q", query.q);
+    if (query.status) params.set("status", query.status);
+    params.set("limit", "20");
+    void (async () => {
+      const res = await fetch(
+        `${basePath}/membership-invites?${params.toString()}`,
+        { credentials: "include" }
+      );
+      const body = await readJson(res);
+      if (cancelled) return;
+      const result = body.result;
+      setItems(result?.items ?? []);
+      setNextCursor(result?.nextCursor ?? null);
+      setListLoading(false);
+    })();
+    return () => {
+      cancelled = true;
+    };
+  }, [basePath, query.q, query.status, refresh]);
+  if (configured === null)
+    return /* @__PURE__ */ jsx(LoadingState, { label: "Cargando invitaciones\u2026" });
+  if (!configured) {
+    return /* @__PURE__ */ jsx(
+      EmptyState,
+      {
+        title: "Configura la membres\xEDa primero",
+        description: "El colegio necesita un modo de suscripci\xF3n y al menos un tipo activo.",
+        action: onConfigure ? /* @__PURE__ */ jsx(Button, { type: "button", onClick: onConfigure, children: "Ir a configuraci\xF3n" }) : void 0
+      }
+    );
+  }
+  function applyEmailDraft() {
+    const next = mergeInviteEmails(emailPills, emailDraft);
+    setEmailPills(next.pills);
+    setEmailDraft(next.invalid.join("\n"));
+    if (next.invalid.length > 0) onNotify?.("Correo no v\xE1lido", "error");
+    return next;
+  }
+  function emailSourceText() {
+    if (tab !== "emails") return "";
+    const next = applyEmailDraft();
+    return next.invalid.length > 0 ? null : next.pills.join("\n");
+  }
+  const payload = (emailText) => ({
+    source: tab === "emails" ? { kind: "emails", text: emailText } : { kind: "csv", text: csvText },
+    defaults: { defaultTypeId: typeId, defaultPaidUp: paidUp === true },
+    options: {
+      unpaidPolicy,
+      unpaidGraceDays: unpaidPolicy === "active_with_charge" ? Number(graceDays) || 30 : void 0,
+      sendInvites
+    }
+  });
+  async function runPreview() {
+    if (paidUp === null) {
+      onNotify?.("Elige si est\xE1n al corriente", "error");
+      return;
+    }
+    const emailText = emailSourceText();
+    if (emailText === null) return;
+    setBusy(true);
+    try {
+      const res = await fetch(`${basePath}/membership-invites/preview`, {
+        method: "POST",
+        credentials: "include",
+        headers: { "content-type": "application/json" },
+        body: JSON.stringify(payload(emailText))
+      });
+      const body = await readJson(res);
+      if (!res.ok || !body.success) {
+        onNotify?.(body.error ?? "No se pudo revisar", "error");
+        return;
+      }
+      const result = body.result;
+      setPreview(result.rows ?? []);
+    } finally {
+      setBusy(false);
+    }
+  }
+  async function runCommit() {
+    const emailText = emailSourceText();
+    if (emailText === null) return;
+    setBusy(true);
+    try {
+      const res = await fetch(`${basePath}/membership-invites`, {
+        method: "POST",
+        credentials: "include",
+        headers: { "content-type": "application/json" },
+        body: JSON.stringify(payload(emailText))
+      });
+      const body = await readJson(res);
+      if (!res.ok || !body.success) {
+        onNotify?.(body.error ?? "No se pudo guardar", "error");
+        return;
+      }
+      onNotify?.("Invitaciones guardadas", "success");
+      setPreview(null);
+      setEmailPills([]);
+      setEmailDraft("");
+      setCsvText("");
+      setRefresh((value) => value + 1);
+    } finally {
+      setBusy(false);
+    }
+  }
+  async function downloadTemplate() {
+    const res = await fetch(`${basePath}/membership-invites/template`, {
+      credentials: "include"
+    });
+    const blob = await res.blob();
+    const url = URL.createObjectURL(blob);
+    const anchor = document.createElement("a");
+    anchor.href = url;
+    anchor.download = "membership-invites.csv";
+    anchor.click();
+    URL.revokeObjectURL(url);
+  }
+  async function loadMore() {
+    if (!nextCursor) return;
+    const params = new URLSearchParams();
+    if (query.q) params.set("q", query.q);
+    if (query.status) params.set("status", query.status);
+    params.set("limit", "20");
+    params.set("cursor", nextCursor);
+    const res = await fetch(
+      `${basePath}/membership-invites?${params.toString()}`,
+      { credentials: "include" }
+    );
+    const body = await readJson(res);
+    const result = body.result;
+    setItems((current) => [...current, ...result?.items ?? []]);
+    setNextCursor(result?.nextCursor ?? null);
+  }
+  async function sendOne(id) {
+    const res = await fetch(`${basePath}/membership-invites/${id}/send`, {
+      method: "POST",
+      credentials: "include"
+    });
+    const body = await readJson(res);
+    if (!res.ok) {
+      onNotify?.(
+        body.error === "throttled" ? typeof body.waitSeconds === "number" ? resendWaitMessage(body.waitSeconds) : "Espera unos minutos antes de reenviar" : body.error ?? "No se pudo enviar",
+        "error"
+      );
+      return;
+    }
+    onNotify?.("Invitaci\xF3n enviada", "success");
+  }
+  async function confirmCancel() {
+    if (!cancelId) return;
+    const id = cancelId;
+    setCancelId(null);
+    const res = await fetch(`${basePath}/membership-invites/${id}/cancel`, {
+      method: "POST",
+      credentials: "include"
+    });
+    if (!res.ok) {
+      onNotify?.("No se pudo cancelar", "error");
+      return;
+    }
+    setItems(
+      (current) => current.map(
+        (row) => row.id === id ? { ...row, status: "cancelled" } : row
+      )
+    );
+    onNotify?.("Invitaci\xF3n cancelada", "success");
+  }
+  const invalidPreview = preview?.some((row) => row.outcome === "invalid");
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-8", children: [
+    /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex gap-2", role: "tablist", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: tab === "emails" ? "default" : "outline",
+            onClick: () => setTab("emails"),
+            children: "Correos"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: tab === "csv" ? "default" : "outline",
+            onClick: () => setTab("csv"),
+            children: "CSV"
+          }
+        )
+      ] }),
+      tab === "emails" ? /* @__PURE__ */ jsxs("div", { className: "border-input bg-background focus-within:border-ring focus-within:ring-ring/50 flex min-h-28 w-full flex-wrap items-center gap-1.5 rounded-md border px-2 py-2 focus-within:ring-[3px]", children: [
+        emailPills.map((email) => /* @__PURE__ */ jsxs(Badge, { variant: "secondary", children: [
+          email,
+          /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "button",
+              variant: "ghost",
+              size: "icon-sm",
+              className: "size-4",
+              "aria-label": `Quitar ${email}`,
+              onClick: () => setEmailPills(
+                (current) => current.filter((item) => item !== email)
+              ),
+              children: /* @__PURE__ */ jsx(X, {})
+            }
+          )
+        ] }, email)),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            "aria-label": "Correos",
+            className: "h-8 min-w-40 flex-1 border-0 bg-transparent px-1 shadow-none focus-visible:border-transparent focus-visible:ring-0 dark:bg-transparent",
+            placeholder: emailPills.length === 0 ? "Escribe un correo y pulsa Enter" : "",
+            value: emailDraft,
+            onChange: (event) => setEmailDraft(event.target.value),
+            onKeyDown: (event) => {
+              if (event.key === "Enter" || event.key === ",") {
+                event.preventDefault();
+                applyEmailDraft();
+                return;
+              }
+              if (event.key === "Backspace" && emailDraft.length === 0 && emailPills.length > 0) {
+                event.preventDefault();
+                setEmailPills((current) => current.slice(0, -1));
+              }
+            },
+            onPaste: (event) => {
+              const text = event.clipboardData.getData("text");
+              if (!/[\n,;]/.test(text) && !isInviteEmail(text)) return;
+              event.preventDefault();
+              const next = mergeInviteEmails(
+                emailPills,
+                `${emailDraft}${text}`
+              );
+              setEmailPills(next.pills);
+              setEmailDraft(next.invalid.join("\n"));
+              if (next.invalid.length > 0)
+                onNotify?.("Correo no v\xE1lido", "error");
+            }
+          }
+        )
+      ] }) : /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: () => void downloadTemplate(),
+            children: "Descargar plantilla"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            "aria-label": "Archivo CSV",
+            type: "file",
+            accept: ".csv,text/csv",
+            onChange: (event) => {
+              const file = event.target.files?.[0];
+              if (!file) return;
+              void file.text().then(setCsvText);
+            }
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("label", { className: "block space-y-1 text-sm", children: [
+        /* @__PURE__ */ jsx("span", { children: "Tipo de membres\xEDa" }),
+        /* @__PURE__ */ jsx(
+          "select",
+          {
+            "aria-label": "Tipo de membres\xEDa",
+            className: "border-input bg-background h-9 w-full rounded-md border px-2",
+            value: typeId,
+            onChange: (event) => setTypeId(event.target.value),
+            children: types.map((type) => /* @__PURE__ */ jsx("option", { value: type.id, children: type.name }, type.id))
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("label", { className: "block space-y-1 text-sm", children: [
+        /* @__PURE__ */ jsx("span", { children: "\xBFAl corriente?" }),
+        /* @__PURE__ */ jsxs(
+          "select",
+          {
+            "aria-label": "Al corriente",
+            className: "border-input bg-background h-9 w-full rounded-md border px-2",
+            value: paidUp === null ? "" : paidUp ? "yes" : "no",
+            onChange: (event) => {
+              if (event.target.value === "yes") setPaidUp(true);
+              else if (event.target.value === "no") setPaidUp(false);
+              else setPaidUp(null);
+            },
+            children: [
+              /* @__PURE__ */ jsx("option", { value: "", children: "Elige una opci\xF3n" }),
+              /* @__PURE__ */ jsx("option", { value: "yes", children: "S\xED, al corriente" }),
+              /* @__PURE__ */ jsx("option", { value: "no", children: "No" })
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("label", { className: "block space-y-1 text-sm", children: [
+        /* @__PURE__ */ jsx("span", { children: "Si no est\xE1n al corriente" }),
+        /* @__PURE__ */ jsxs(
+          "select",
+          {
+            "aria-label": "Pol\xEDtica de adeudo",
+            className: "border-input bg-background h-9 w-full rounded-md border px-2",
+            value: unpaidPolicy,
+            onChange: (event) => setUnpaidPolicy(event.target.value),
+            children: [
+              /* @__PURE__ */ jsx("option", { value: "lapsed_with_charge", children: "Socio reconocido, sin acceso hasta que pague" }),
+              /* @__PURE__ */ jsx("option", { value: "active_with_charge", children: "Con acceso por unos d\xEDas y un cargo abierto" }),
+              /* @__PURE__ */ jsx("option", { value: "active_no_charge", children: "Activo sin cargo (no se registra el adeudo)" })
+            ]
+          }
+        )
+      ] }),
+      unpaidPolicy === "active_with_charge" ? /* @__PURE__ */ jsxs("label", { className: "block space-y-1 text-sm", children: [
+        /* @__PURE__ */ jsx("span", { children: "D\xEDas de acceso antes de vencer" }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            "aria-label": "D\xEDas de gracia",
+            inputMode: "numeric",
+            value: graceDays,
+            onChange: (event) => setGraceDays(event.target.value)
+          }
+        )
+      ] }) : null,
+      /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2 text-sm", children: [
+        /* @__PURE__ */ jsx(
+          "input",
+          {
+            type: "checkbox",
+            checked: sendInvites,
+            onChange: (event) => setSendInvites(event.target.checked)
+          }
+        ),
+        "Enviar invitaciones al guardar"
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            variant: "outline",
+            disabled: busy,
+            onClick: () => void runPreview(),
+            children: "Revisar"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            disabled: busy || !preview || invalidPreview,
+            onClick: () => void runCommit(),
+            children: "Guardar"
+          }
+        )
+      ] }),
+      preview ? /* @__PURE__ */ jsxs("table", { className: "w-full text-sm", children: [
+        /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
+          /* @__PURE__ */ jsx("th", { className: "text-left", children: "Correo" }),
+          /* @__PURE__ */ jsx("th", { className: "text-left", children: "Resultado" })
+        ] }) }),
+        /* @__PURE__ */ jsx("tbody", { children: preview.map((row) => /* @__PURE__ */ jsxs("tr", { children: [
+          /* @__PURE__ */ jsx("td", { children: row.email }),
+          /* @__PURE__ */ jsxs("td", { children: [
+            row.outcome,
+            row.errors.length > 0 ? ` (${row.errors.join(", ")})` : ""
+          ] })
+        ] }, `${row.line}-${row.email}`)) })
+      ] }) : null
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-lg font-medium", children: "Invitaciones" }),
+      /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            "aria-label": "Buscar invitaciones",
+            className: "min-w-0 flex-1",
+            value: draftQ,
+            onChange: (event) => setDraftQ(event.target.value),
+            placeholder: "Correo o nombre"
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "select",
+          {
+            "aria-label": "Estado",
+            className: "border-input bg-background h-9 shrink-0 rounded-md border px-2",
+            value: query.status,
+            onChange: (event) => onQueryChange({ q: query.q, status: event.target.value }),
+            children: [
+              /* @__PURE__ */ jsx("option", { value: "", children: "Todos" }),
+              /* @__PURE__ */ jsx("option", { value: "pending", children: "Pendientes" }),
+              /* @__PURE__ */ jsx("option", { value: "claimed", children: "Registrados" }),
+              /* @__PURE__ */ jsx("option", { value: "failed", children: "Con error" }),
+              /* @__PURE__ */ jsx("option", { value: "cancelled", children: "Canceladas" })
+            ]
+          }
+        )
+      ] }),
+      listLoading ? /* @__PURE__ */ jsx(LoadingState, { label: "Cargando lista\u2026" }) : null,
+      !listLoading && items.length === 0 ? /* @__PURE__ */ jsx(
+        EmptyState,
+        {
+          title: "No hay invitaciones",
+          description: "Agrega correos o un CSV."
+        }
+      ) : null,
+      /* @__PURE__ */ jsx("ul", { className: "divide-y", children: items.map((row) => /* @__PURE__ */ jsxs(
+        "li",
+        {
+          className: "flex flex-col gap-2 py-3 sm:flex-row sm:items-center sm:justify-between",
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
+              /* @__PURE__ */ jsx("p", { className: "break-all", children: row.email }),
+              /* @__PURE__ */ jsxs("p", { className: "text-muted-foreground mt-1 flex flex-wrap items-center gap-x-1.5 gap-y-1 text-xs", children: [
+                row.fullName ? /* @__PURE__ */ jsx("span", { children: row.fullName }) : null,
+                /* @__PURE__ */ jsx(
+                  Badge,
+                  {
+                    variant: "outline",
+                    className: INVITE_STATUS_CLASS[row.status],
+                    children: inviteStatusLabel(row.status, language)
+                  }
+                ),
+                row.failureReason ? /* @__PURE__ */ jsx("span", { children: row.failureReason }) : null
+              ] })
+            ] }),
+            row.status === "pending" ? /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-2", children: [
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  type: "button",
+                  variant: "outline",
+                  onClick: () => void sendOne(row.id),
+                  children: "Enviar invitaci\xF3n"
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                Button,
+                {
+                  type: "button",
+                  variant: "ghost",
+                  onClick: () => setCancelId(row.id),
+                  children: "Cancelar"
+                }
+              )
+            ] }) : null
+          ]
+        },
+        row.id
+      )) }),
+      nextCursor ? /* @__PURE__ */ jsx(
+        Button,
+        {
+          type: "button",
+          variant: "outline",
+          onClick: () => void loadMore(),
+          children: "Cargar m\xE1s"
+        }
+      ) : null
+    ] }),
+    /* @__PURE__ */ jsx(
+      ConfirmDestructiveDialog,
+      {
+        open: cancelId !== null,
+        onOpenChange: (open) => {
+          if (!open) setCancelId(null);
+        },
+        title: "Cancelar invitaci\xF3n",
+        description: "Esta persona ya no quedar\xE1 registrada como socia al crear su cuenta.",
+        confirmLabel: "Cancelar invitaci\xF3n",
+        cancelLabel: "Volver",
+        onConfirm: () => void confirmCancel()
+      }
+    )
+  ] });
+}
 
-export { AvatarEditor, AvatarEditorDialog, BrandX, Bubble, BubbleContent, BubbleGroup, BubbleReactions, ChatMessageList, ConfirmDestructiveDialog, DEFAULT_EDITABLE_SECTION_LABELS, DataList, DataListItem, DropdownMenuItem, DropdownMenuSeparator, EditableSection, EmojiInput, EmojiPicker, EmojiPickerPopover, EmojiTextarea, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, EmptyTitle, ErrorState, ExpandableText, FieldMessage, ImageLightbox, LanguageContext, LanguageSwitcher, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, Marker, MarkerContent, MarkerIcon, MediaCarousel, MediaViewerDialog, Message, MessageAvatar, MessageComposer, MessageContent, MessageFooter, MessageGroup, MessageHeader, MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, MexicoMap, OrgSwitcher, PLATFORM_ACCOUNT_ORG_COLLAPSE_AT, PaymentIcon, PhoneInput, PlatformAccountMenu, PlatformNavbar, SafeImage, ScrollRestorationProvider, SearchCommand, SearchablePicker, SupportMessengerProvider, ThemeSwitcher, VerifiedProfessionalBadge, ZOOM_PAN_MAX_SCALE, ZOOM_PAN_MIN_SCALE, ZOOM_PAN_SWIPE_COMMIT_PX, ZOOM_PAN_SWIPE_SNAP_MS, avatarFallbackStyle, bubbleVariants, cn, createSupportChatClient, defaultLanguages, formatPaymentCardBrand, fuzzyMatch, getAvatarColors, getInitials, insertAtCaret, markerVariants, mergePlatformAccountOrgs, normalizeEmojiQuery, normalizePaymentCardBrand, paymentIconBrandFromStripe, paymentTypeFromStripeBrand, prefersReducedMotion, useDebouncedValue, useDebouncedValueStrict, useEditableSection, useLanguageContext, useMediaQuery2 as useMediaQuery, useRealtimeChannel, useRestorableState, useScrollFadeXEdges, useScrollRestorationContext, useSearchHotkey, useSupportConversation, useSupportMessenger, useSupportMessengerOptional, useZoomPanGestures, zoomToward };
+export { AvatarEditor, AvatarEditorDialog, BrandX, Bubble, BubbleContent, BubbleGroup, BubbleReactions, ChatMessageList, ConfirmDestructiveDialog, DEFAULT_EDITABLE_SECTION_LABELS, DataList, DataListItem, DropdownMenuItem, DropdownMenuSeparator, EditableSection, EmojiInput, EmojiPicker, EmojiPickerPopover, EmojiTextarea, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyState, EmptyTitle, ErrorState, ExpandableText, FieldMessage, ImageLightbox, LanguageContext, LanguageSwitcher, LoadingState, MEXICO_STATES, MEXICO_STATE_PATHS, Marker, MarkerContent, MarkerIcon, MediaCarousel, MediaViewerDialog, MembershipInvitePanel, Message, MessageAvatar, MessageComposer, MessageContent, MessageFooter, MessageGroup, MessageHeader, MessageScroller, MessageScrollerButton, MessageScrollerContent, MessageScrollerItem, MessageScrollerProvider, MessageScrollerViewport, MexicoMap, OrgSwitcher, PLATFORM_ACCOUNT_ORG_COLLAPSE_AT, PaymentIcon, PhoneInput, PlatformAccountMenu, PlatformNavbar, SafeImage, ScrollRestorationProvider, SearchCommand, SearchablePicker, SupportMessengerProvider, ThemeSwitcher, VerifiedProfessionalBadge, ZOOM_PAN_MAX_SCALE, ZOOM_PAN_MIN_SCALE, ZOOM_PAN_SWIPE_COMMIT_PX, ZOOM_PAN_SWIPE_SNAP_MS, avatarFallbackStyle, bubbleVariants, cn, createSupportChatClient, defaultLanguages, formatPaymentCardBrand, fuzzyMatch, getAvatarColors, getInitials, insertAtCaret, markerVariants, mergePlatformAccountOrgs, normalizeEmojiQuery, normalizePaymentCardBrand, paymentIconBrandFromStripe, paymentTypeFromStripeBrand, prefersReducedMotion, useDebouncedValue, useDebouncedValueStrict, useEditableSection, useLanguageContext, useMediaQuery2 as useMediaQuery, useRealtimeChannel, useRegisterScrollContainer, useRestorableState, useScrollFadeXEdges, useScrollRestorationContext, useSearchHotkey, useSupportConversation, useSupportMessenger, useSupportMessengerOptional, useZoomPanGestures, zoomToward };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map