@antelopejs/dms 0.9.7 → 0.10.0

package/dist/validation/member-invite.schema.js

@@ -7,20 +7,7 @@ const zod_1 = require("zod");
 exports.INVITE_NAME_MAX_LENGTH = 100;
 exports.INVITE_FULL_NAME_MAX_LENGTH = exports.INVITE_NAME_MAX_LENGTH * 2;
 exports.INVITE_EMAILS_MAX = 50;
-const LEGACY_EMAIL_KEY = "email";
-const EMAILS_KEY = "emails";
 const NAME_SEPARATOR = /\s+/;
-function acceptLegacySingleEmail(payload) {
-    if (typeof payload !== "object" || payload === null)
-        return payload;
-    const record = payload;
-    if (record[EMAILS_KEY] !== undefined)
-        return payload;
-    const email = record[LEGACY_EMAIL_KEY];
-    if (typeof email !== "string")
-        return payload;
-    return { ...record, [EMAILS_KEY]: [email] };
-}
 const inviteNamePart = zod_1.z.string().trim().max(exports.INVITE_NAME_MAX_LENGTH);
 const memberInviteObjectSchema = zod_1.z.object({
     emails: zod_1.z
@@ -34,10 +21,10 @@ const memberInviteObjectSchema = zod_1.z.object({
     language: zod_1.z.string(),
     asTenantOwner: zod_1.z.boolean(),
 });
-exports.memberInviteSchema = zod_1.z.preprocess(acceptLegacySingleEmail, memberInviteObjectSchema.refine((data) => data.asTenantOwner || (data.roles && data.roles.length > 0), {
+exports.memberInviteSchema = memberInviteObjectSchema.refine((data) => data.asTenantOwner || (data.roles && data.roles.length > 0), {
     message: "$page.settings.members.invite.roles_required",
     path: ["roles"],
-}));
+});
 function resolveInviteeNameParts(payload) {
     if (payload.firstname || payload.lastname || !payload.name) {
         return { firstname: payload.firstname, lastname: payload.lastname };

package/dist/validation/member-invite.schema.js.map

@@ -1 +1 @@
-{"version":3,"file":"member-invite.schema.js","sourceRoot":"","sources":["../../src/validation/member-invite.schema.ts"],"names":[],"mappings":";;;AA+EA,0DAQC;AAMD,gDAEC;AA/FD,6BAAwB;AAOX,QAAA,sBAAsB,GAAG,GAAG,CAAC;AAG7B,QAAA,2BAA2B,GAAG,8BAAsB,GAAG,CAAC,CAAC;AAMzD,QAAA,iBAAiB,GAAG,EAAE,CAAC;AAEpC,MAAM,gBAAgB,GAAG,OAAO,CAAC;AACjC,MAAM,UAAU,GAAG,QAAQ,CAAC;AAC5B,MAAM,cAAc,GAAG,KAAK,CAAC;AAM7B,SAAS,uBAAuB,CAAC,OAAgB;IAC/C,IAAI,OAAO,OAAO,KAAK,QAAQ,IAAI,OAAO,KAAK,IAAI;QAAE,OAAO,OAAO,CAAC;IACpE,MAAM,MAAM,GAAG,OAAkC,CAAC;IAClD,IAAI,MAAM,CAAC,UAAU,CAAC,KAAK,SAAS;QAAE,OAAO,OAAO,CAAC;IACrD,MAAM,KAAK,GAAG,MAAM,CAAC,gBAAgB,CAAC,CAAC;IACvC,IAAI,OAAO,KAAK,KAAK,QAAQ;QAAE,OAAO,OAAO,CAAC;IAC9C,OAAO,EAAE,GAAG,MAAM,EAAE,CAAC,UAAU,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC;AAC9C,CAAC;AAOD,MAAM,cAAc,GAAG,OAAC,CAAC,MAAM,EAAE,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,8BAAsB,CAAC,CAAC;AAErE,MAAM,wBAAwB,GAAG,OAAC,CAAC,MAAM,CAAC;IACxC,MAAM,EAAE,OAAC;SACN,KAAK,CAAC,OAAC,CAAC,MAAM,EAAE,CAAC,IAAI,EAAE,CAAC,WAAW,EAAE,CAAC,KAAK,EAAE,CAAC;SAC9C,GAAG,CAAC,CAAC,EAAE,+CAA+C,CAAC;SACvD,GAAG,CAAC,yBAAiB,EAAE,+CAA+C,CAAC;IAC1E,IAAI,EAAE,OAAC,CAAC,MAAM,EAAE,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,mCAA2B,CAAC,CAAC,QAAQ,EAAE;IACnE,SAAS,EAAE,cAAc,CAAC,QAAQ,EAAE;IACpC,QAAQ,EAAE,cAAc,CAAC,QAAQ,EAAE;IACnC,KAAK,EAAE,OAAC,CAAC,KAAK,CAAC,OAAC,CAAC,MAAM,EAAE,CAAC,CAAC,QAAQ,EAAE;IACrC,QAAQ,EAAE,OAAC,CAAC,MAAM,EAAE;IACpB,aAAa,EAAE,OAAC,CAAC,OAAO,EAAE;CAC3B,CAAC,CAAC;AAEU,QAAA,kBAAkB,GAAG,OAAC,CAAC,UAAU,CAC5C,uBAAuB,EACvB,wBAAwB,CAAC,MAAM,CAC7B,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,EACrE;IACE,OAAO,EAAE,8CAA8C;IACvD,IAAI,EAAE,CAAC,OAAO,CAAC;CAChB,CACF,CACF,CAAC;AAeF,SAAgB,uBAAuB,CACrC,OAAqE;IAErE,IAAI,OAAO,CAAC,SAAS,IAAI,OAAO,CAAC,QAAQ,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;QAC3D,OAAO,EAAE,SAAS,EAAE,OAAO,CAAC,SAAS,EAAE,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAAE,CAAC;IACtE,CAAC;IACD,MAAM,CAAC,SAAS,EAAE,GAAG,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;IAChE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,SAAS,EAAE,CAAC;AAC9D,CAAC;AAMD,SAAgB,kBAAkB,CAAC,MAAyB;IAC1D,OAAO,CAAC,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC;AAC9B,CAAC"}
+{"version":3,"file":"member-invite.schema.js","sourceRoot":"","sources":["../../src/validation/member-invite.schema.ts"],"names":[],"mappings":";;;AA6DA,0DAQC;AAMD,gDAEC;AA7ED,6BAAwB;AAOX,QAAA,sBAAsB,GAAG,GAAG,CAAC;AAG7B,QAAA,2BAA2B,GAAG,8BAAsB,GAAG,CAAC,CAAC;AAMzD,QAAA,iBAAiB,GAAG,EAAE,CAAC;AAEpC,MAAM,cAAc,GAAG,KAAK,CAAC;AAO7B,MAAM,cAAc,GAAG,OAAC,CAAC,MAAM,EAAE,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,8BAAsB,CAAC,CAAC;AAErE,MAAM,wBAAwB,GAAG,OAAC,CAAC,MAAM,CAAC;IACxC,MAAM,EAAE,OAAC;SACN,KAAK,CAAC,OAAC,CAAC,MAAM,EAAE,CAAC,IAAI,EAAE,CAAC,WAAW,EAAE,CAAC,KAAK,EAAE,CAAC;SAC9C,GAAG,CAAC,CAAC,EAAE,+CAA+C,CAAC;SACvD,GAAG,CAAC,yBAAiB,EAAE,+CAA+C,CAAC;IAC1E,IAAI,EAAE,OAAC,CAAC,MAAM,EAAE,CAAC,IAAI,EAAE,CAAC,GAAG,CAAC,mCAA2B,CAAC,CAAC,QAAQ,EAAE;IACnE,SAAS,EAAE,cAAc,CAAC,QAAQ,EAAE;IACpC,QAAQ,EAAE,cAAc,CAAC,QAAQ,EAAE;IACnC,KAAK,EAAE,OAAC,CAAC,KAAK,CAAC,OAAC,CAAC,MAAM,EAAE,CAAC,CAAC,QAAQ,EAAE;IACrC,QAAQ,EAAE,OAAC,CAAC,MAAM,EAAE;IACpB,aAAa,EAAE,OAAC,CAAC,OAAO,EAAE;CAC3B,CAAC,CAAC;AAEU,QAAA,kBAAkB,GAAG,wBAAwB,CAAC,MAAM,CAC/D,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,EACrE;IACE,OAAO,EAAE,8CAA8C;IACvD,IAAI,EAAE,CAAC,OAAO,CAAC;CAChB,CACF,CAAC;AAeF,SAAgB,uBAAuB,CACrC,OAAqE;IAErE,IAAI,OAAO,CAAC,SAAS,IAAI,OAAO,CAAC,QAAQ,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC;QAC3D,OAAO,EAAE,SAAS,EAAE,OAAO,CAAC,SAAS,EAAE,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAAE,CAAC;IACtE,CAAC;IACD,MAAM,CAAC,SAAS,EAAE,GAAG,IAAI,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,CAAC;IAChE,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,SAAS,EAAE,CAAC;AAC9D,CAAC;AAMD,SAAgB,kBAAkB,CAAC,MAAyB;IAC1D,OAAO,CAAC,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC;AAC9B,CAAC"}

package/frontend-vue/dms.frontend.ts

@@ -18,8 +18,10 @@ import permissionPreviewPrepaintPlugin from "./layers/dms-layout/app/plugins/per
 import regionalPreferencesPlugin from "./layers/dms-layout/app/plugins/regional-preferences";
 import seoPlugin from "./layers/dms-layout/app/plugins/seo";
 import sidePanelHostPlugin from "./layers/dms-layout/app/plugins/side-panel-host";
+import livePauseSourcePlugin from "./layers/dms-ui/app/plugins/live-pause-source";
 import onboardingMiddleware from "./layers/dms-onboarding/app/middleware/onboarding.global";
 import onboardingPreloadPlugin from "./layers/dms-onboarding/app/plugins/onboarding-preload";
+import closingLayersPlugin from "./layers/dms-ui/app/plugins/closing-layers.client";
 import registerPlugin from "./layers/dms-ui/app/plugins/register";
 import shortcutsPlugin from "./layers/dms-ui/app/plugins/shortcuts";
 import tableViewDisplaysPlugin from "./layers/dms-ui/app/plugins/table-view-displays";
@@ -92,8 +94,11 @@ function lazyComponent(loader: VueLoader): Component {
   return defineAsyncComponent(async () => (await loader()).default);
 }
 
-// Components that render a backend block under a name of their own: the block
-// names (`dms-xxx-block`) resolve to the same component as the template name.
+// Not a compatibility path: two current contracts name these components.
+// Templates use the component's own name (`<DmsSection>`, `<DmsFieldRow>`,
+// `<DmsActivityFeed>`), while the backend blocks follow the `dms-xxx-block`
+// vocabulary that `block-vocabulary.test.ts` enforces. Each entry maps the
+// template name to the block name, so both resolve to one component.
 const COMPONENT_ALIASES: Record<string, string> = {
   ActivityFeed: "ActivityFeedBlock",
   Section: "SectionBlock",
@@ -159,11 +164,21 @@ function registerPlugins(sdk: Parameters<DmsFrontendModule["setup"]>[0]): void {
   const clientOnly = { clientOnly: true };
   if (import.meta.env.DEV) {
     sdk.registerPlugin(async (context) => {
-      const plugin = await import(
-        "./layers/dms-layout/app/plugins/dms-dev-reload.client"
-      );
+      const plugin =
+        await import("./layers/dms-layout/app/plugins/dms-dev-reload.client");
       await plugin.default(context);
     }, clientOnly);
+    // Browser only: the server already logs a render that fails, with its
+    // stack. First, so an error a later plugin's work raises is logged too.
+    sdk.registerPlugin(
+      async (context) => {
+        const plugin = await import(
+          "./layers/dms-core/app/plugins/dev-error-log"
+        );
+        await plugin.default(context);
+      },
+      { ...clientOnly, enforce: "pre" },
+    );
   }
   // Before any data is read, a higher-priority module's plugins included:
   // every key lives in the session's scope, and a new scope aborts the reads
@@ -183,6 +198,10 @@ function registerPlugins(sdk: Parameters<DmsFrontendModule["setup"]>[0]): void {
   sdk.registerPlugin(seoPlugin);
   sdk.registerPlugin(faviconPlugin);
   sdk.registerPlugin(sidePanelHostPlugin);
+  // Not deferred: a page's first poll reads it.
+  sdk.registerPlugin(livePauseSourcePlugin, clientOnly);
+  // Not deferred: the first dialog the user closes needs it.
+  sdk.registerPlugin(closingLayersPlugin, clientOnly);
   sdk.registerPlugin(registerPlugin);
   sdk.registerPlugin(shortcutsPlugin);
   sdk.registerPlugin(tableViewDisplaysPlugin);

package/frontend-vue/dms.server.ts

@@ -8,11 +8,28 @@ import { renderHtml } from "./layers/dms-layout/server/html-render";
 // provider sign-in routes, the session logic the server runs outside them,
 // the e-mail render the backend asks for, and the backend prefixes the
 // browser reaches through it. The renderer proxies no path on its own.
+
+// The largest upload the DMS stack signs: Media's limit, above the DMS's own
+// `uploads.maxSize` default (100 MiB).
+const STORAGE_UPLOAD_MAX_BYTES = 500 * 1024 * 1024;
+// Named rather than inline so the renderer this repository builds against,
+// which predates `maxBodyBytes`, type-checks it.
+const STORAGE_UPLOADS = {
+  auth: "none",
+  maxBodyBytes: STORAGE_UPLOAD_MAX_BYTES,
+} as const;
+
 export default defineDmsServer((server) => {
   // The backend's API and the DMS's own routes (menu, page, page layouts,
   // permissions, realtime), with the session's token added server-side.
   server.registerBackendProxy("/api/**");
   server.registerBackendProxy("/dms/**");
+  // The storage's signed URLs (file fields, exports, profile photos, media),
+  // authenticated by the token they carry, never by the member's session, so
+  // a backend reachable only through the frontend still takes uploads and
+  // serves files.
+  server.registerBackendProxy("/file-storage/upload/**", STORAGE_UPLOADS);
+  server.registerBackendProxy("/file-storage/files/**", { auth: "none" });
 
   server.registerRoute("GET", "/api/_auth/session", session.readSessionRoute);
   server.registerRoute(

package/frontend-vue/layers/dms-auth/server/accounts.ts

@@ -38,12 +38,11 @@ interface SessionUser {
 }
 
 /**
- * Whether a session, or a stored account, outlives the browser. Only a login
- * that left "keep me signed in" unchecked says no; a cookie written before
- * the flag existed carries none, and keeps the lifetime it was given then.
+ * Whether a session, or a stored account, outlives the browser: only one a
+ * login that ticked "keep me signed in" wrote (`persistent: true`).
  */
 export function isPersistent(session?: { persistent?: unknown }): boolean {
-  return session?.persistent !== false;
+  return session?.persistent === true;
 }
 
 function lifetime(persistent: boolean): number | undefined {

package/frontend-vue/layers/dms-core/app/build/composables/renderNow.ts

@@ -0,0 +1,34 @@
+import { getCurrentInstance } from "vue";
+import { isHydratingComponent } from "../../composables/hydration/isHydratingComponent";
+
+/**
+ * The instant a server render reads the clock at, handed to the browser with
+ * the page: the periods' bounds and the relative dates read it.
+ */
+const RENDER_NOW_STATE_KEY = "dms-render-now";
+
+/**
+ * The instant, in milliseconds, a component reads the clock at while its
+ * text must match the server's, or `null` for the clock's.
+ *
+ * A server render reads every such clock of the request at one instant, which
+ * it transfers; the browser hydrating that render reads the same one, so a
+ * text measured from now ("3 min ago", a relative period's bounds) hydrates
+ * as the server wrote it, even across a minute or midnight. Anywhere else (a
+ * client navigation, a later render, a call outside a component) it is
+ * `null`: the text follows the clock.
+ */
+export function serverRenderNow(): number | null {
+  if (!getCurrentInstance()) return null;
+  if (typeof window === "undefined") {
+    return useDmsState<number>(RENDER_NOW_STATE_KEY, () => Date.now(), {
+      transfer: true,
+    }).value;
+  }
+  if (!isHydratingComponent()) return null;
+  const transferred = useDmsState<number | null>(
+    RENDER_NOW_STATE_KEY,
+    () => null,
+  ).value;
+  return typeof transferred === "number" ? transferred : null;
+}

package/frontend-vue/layers/dms-core/app/build/composables/user/tablePreferences.ts

@@ -13,7 +13,9 @@ export type ServerTableField =
   | "paginationScope"
   | "activeTab"
   | "viewMode"
-  | "activeView";
+  | "activeView"
+  | "linkScope"
+  | "shownLink";
 
 /**
  * @internal
@@ -224,6 +226,8 @@ export const SERVER_TABLE_FIELDS: Record<ServerTableField, ServerFieldCodec> = {
   activeTab: plainField("t"),
   viewMode: plainField("d"),
   activeView: plainField("w"),
+  linkScope: plainField("l"),
+  shownLink: plainField("k"),
 };
 
 /** @internal Whether `field` is kept in the cookie. */

package/frontend-vue/layers/dms-core/app/build/utils/crossTab.ts

@@ -0,0 +1,199 @@
+/**
+ * Coordination between the tabs of one browser profile, for the long-lived
+ * streams a dashboard keeps open.
+ *
+ * Over HTTP/1.1 a browser opens at most six connections per host, and a
+ * streaming response holds one for as long as it lives: one stream per tab
+ * starves every other request once a few tabs are open. One tab is elected
+ * (a Web Lock, released by the browser when the tab goes, however it goes),
+ * opens the stream, and relays it to the others over a BroadcastChannel.
+ *
+ * Web Locks need a secure context (HTTPS, or localhost). Where either API is
+ * missing, every tab is its own leader on a bus of its own: the behaviour of a
+ * stream per tab, unchanged.
+ *
+ * @internal
+ */
+
+const TAB_LOCK_SEPARATOR = ":tab:";
+
+export type TabMessageHandler = (message: unknown) => void;
+
+/** The browser APIs the coordination rides on; injected by the tests. */
+export interface CrossTabEnvironment {
+  locks?: LockManager;
+  createChannel?: (name: string) => BroadcastChannel;
+}
+
+export interface TabBus {
+  /** Sends to every tab on the bus, this one included. */
+  post(message: unknown): void;
+  listen(handler: TabMessageHandler): () => void;
+  close(): void;
+}
+
+/** A lock this tab holds until it releases it or goes. */
+export interface HeldLock {
+  /** Resolves once the lock is held: until then, nobody can wait on it. */
+  held: Promise<void>;
+  release(): void;
+}
+
+/** What the running browser offers. */
+export function browserCrossTabEnvironment(): CrossTabEnvironment {
+  const locks = globalThis.navigator?.locks;
+  const canBroadcast = typeof globalThis.BroadcastChannel === "function";
+  if (!locks || !canBroadcast) return {};
+  return { locks, createChannel: (name) => new BroadcastChannel(name) };
+}
+
+/** Whether the tabs can share: without both APIs each tab stays on its own. */
+export function canShareAcrossTabs(environment: CrossTabEnvironment): boolean {
+  return !!environment.locks && !!environment.createChannel;
+}
+
+export function openTabBus(
+  name: string,
+  environment: CrossTabEnvironment,
+): TabBus {
+  const listeners = new Set<TabMessageHandler>();
+  const deliver = (message: unknown) => {
+    for (const listener of [...listeners]) listener(message);
+  };
+  const channel = canShareAcrossTabs(environment)
+    ? environment.createChannel!(name)
+    : undefined;
+  if (channel) channel.onmessage = (event) => deliver(event.data);
+  return {
+    // A BroadcastChannel never echoes to its sender: this tab's own
+    // listeners hear the message directly.
+    post: (message) => {
+      channel?.postMessage(message);
+      deliver(message);
+    },
+    listen: (handler) => {
+      listeners.add(handler);
+      return () => listeners.delete(handler);
+    },
+    close: () => {
+      listeners.clear();
+      channel?.close();
+    },
+  };
+}
+
+/**
+ * Runs `lead` in one tab at a time per `name`. When the leading tab resigns
+ * or goes, the next waiting tab takes over and runs its own `lead`.
+ *
+ * @param lead Starts the leader's work; returns what stops it
+ * @returns Resigns: stops the work when leading, or stops waiting
+ */
+export function electLeader(
+  name: string,
+  environment: CrossTabEnvironment,
+  lead: () => () => void,
+): () => void {
+  if (!canShareAcrossTabs(environment)) return lead();
+  const abort = new AbortController();
+  let isResigned = false;
+  let stepDown: (() => void) | undefined;
+  environment
+    .locks!.request(name, { signal: abort.signal }, () => {
+      // Granted while the resignation was on its way.
+      if (isResigned) return;
+      return new Promise<void>((resolve) => {
+        const stop = lead();
+        stepDown = () => {
+          stop();
+          resolve();
+        };
+      });
+    })
+    .catch(() => {});
+  return () => {
+    isResigned = true;
+    abort.abort();
+    stepDown?.();
+    stepDown = undefined;
+  };
+}
+
+export function tabLockName(name: string, tabId: string): string {
+  return `${name}${TAB_LOCK_SEPARATOR}${tabId}`;
+}
+
+/** Holds `name` until released; the browser releases it when the tab goes. */
+export function holdLock(
+  name: string,
+  environment: CrossTabEnvironment,
+): HeldLock {
+  if (!canShareAcrossTabs(environment)) {
+    return { held: Promise.resolve(), release: () => {} };
+  }
+  const abort = new AbortController();
+  let release: (() => void) | undefined;
+  let isReleased = false;
+  const held = new Promise<void>((resolveHeld) => {
+    environment
+      .locks!.request(name, { signal: abort.signal }, () => {
+        if (isReleased) return;
+        resolveHeld();
+        return new Promise<void>((resolve) => {
+          release = resolve;
+        });
+      })
+      .catch(() => {});
+  });
+  return {
+    held,
+    release: () => {
+      isReleased = true;
+      abort.abort();
+      release?.();
+      release = undefined;
+    },
+  };
+}
+
+/**
+ * Calls `onReleased` once nobody holds `name` any more: when the tab holding
+ * it releases it or goes. Never called once `signal` aborts.
+ */
+export function whenReleased(
+  name: string,
+  environment: CrossTabEnvironment,
+  onReleased: () => void,
+  signal: AbortSignal,
+): void {
+  if (!canShareAcrossTabs(environment)) return;
+  environment
+    .locks!.request(name, { signal }, () => {
+      if (!signal.aborted) onReleased();
+    })
+    .catch(() => {});
+}
+
+/**
+ * One source for every tab of the browser: the elected tab opens it, and what
+ * it emits reaches each tab's `onMessage`, the leader's included.
+ *
+ * @param open Opens the source, handing it what relays a message; returns
+ *   what closes it
+ * @returns Leaves: closes the source when leading, and stops listening
+ */
+export function shareAcrossTabs(
+  name: string,
+  open: (emit: (message: unknown) => void) => () => void,
+  onMessage: TabMessageHandler,
+  environment: CrossTabEnvironment = browserCrossTabEnvironment(),
+): () => void {
+  const bus = openTabBus(name, environment);
+  const unlisten = bus.listen(onMessage);
+  const resign = electLeader(name, environment, () => open(bus.post));
+  return () => {
+    resign();
+    unlisten();
+    bus.close();
+  };
+}