@cross-deck/web 1.12.1 → 1.13.0

package/dist/react.d.mts

@@ -1,5 +1,6 @@
-import { ReactNode } from 'react';
+import { ReactNode, CSSProperties, RefObject } from 'react';
 import { C as CrossdeckOptions } from './types-iqtsOTGy.mjs';
+import { d as TrustToken, e as TrustTokenStatus } from './trust-C0RcpR5I.mjs';
 
 /**
  * @cross-deck/web/react — React hooks for the Crossdeck SDK.
@@ -87,5 +88,42 @@ declare function useEntitlement(key: string): boolean;
  * Same pre-init / SSR semantics as `useEntitlement`.
  */
 declare function useEntitlements(): readonly string[];
+interface CrossdeckTrustProps {
+    /** Called once when the panel mints a token. Pass `t.token` to your gate call. */
+    onToken?: (t: TrustToken) => void;
+    /**
+     * Called if the panel could not mint (adblocker, offline, our outage, timeout).
+     * INFORMATIONAL — not an error to handle. The signup should still proceed.
+     */
+    onUnavailable?: (reason: string) => void;
+    /** Class on the wrapper element the panel mounts into. */
+    className?: string;
+    /** Inline style on the wrapper element. */
+    style?: CSSProperties;
+    /** id on the wrapper element. */
+    id?: string;
+}
+/**
+ * `<CrossdeckTrust onToken={setToken} />` — drop it on your signup form. Renders
+ * the same cross-origin Trust panel every install gets, mints a single-use
+ * attestation, and calls `onToken` with it. SSR-safe (mounts on the client).
+ */
+declare function CrossdeckTrust(props: CrossdeckTrustProps): ReactNode;
+/**
+ * Headless Trust — mount the panel and read the token from React state.
+ *
+ * @example
+ * const { ref, token, status } = useTrustToken();
+ * return <><input name="email" /><div ref={ref} /></>;
+ * // then send `token` to your server; `status` is "pending" | "ready" | "unavailable".
+ */
+declare function useTrustToken(): {
+    /** Attach to the element the panel should mount into: `<div ref={ref} />`. */
+    ref: RefObject<HTMLDivElement | null>;
+    /** The minted token, or null until it mints (or if the panel failed open). */
+    token: string | null;
+    /** Lifecycle: pending → ready (minted) or unavailable (failed open). */
+    status: TrustTokenStatus;
+};
 
-export { CrossdeckProvider, useEntitlement, useEntitlements };
+export { CrossdeckProvider, CrossdeckTrust, type CrossdeckTrustProps, TrustTokenStatus, useEntitlement, useEntitlements, useTrustToken };

package/dist/react.d.ts

@@ -1,5 +1,6 @@
-import { ReactNode } from 'react';
+import { ReactNode, CSSProperties, RefObject } from 'react';
 import { C as CrossdeckOptions } from './types-iqtsOTGy.js';
+import { d as TrustToken, e as TrustTokenStatus } from './trust-C0RcpR5I.js';
 
 /**
  * @cross-deck/web/react — React hooks for the Crossdeck SDK.
@@ -87,5 +88,42 @@ declare function useEntitlement(key: string): boolean;
  * Same pre-init / SSR semantics as `useEntitlement`.
  */
 declare function useEntitlements(): readonly string[];
+interface CrossdeckTrustProps {
+    /** Called once when the panel mints a token. Pass `t.token` to your gate call. */
+    onToken?: (t: TrustToken) => void;
+    /**
+     * Called if the panel could not mint (adblocker, offline, our outage, timeout).
+     * INFORMATIONAL — not an error to handle. The signup should still proceed.
+     */
+    onUnavailable?: (reason: string) => void;
+    /** Class on the wrapper element the panel mounts into. */
+    className?: string;
+    /** Inline style on the wrapper element. */
+    style?: CSSProperties;
+    /** id on the wrapper element. */
+    id?: string;
+}
+/**
+ * `<CrossdeckTrust onToken={setToken} />` — drop it on your signup form. Renders
+ * the same cross-origin Trust panel every install gets, mints a single-use
+ * attestation, and calls `onToken` with it. SSR-safe (mounts on the client).
+ */
+declare function CrossdeckTrust(props: CrossdeckTrustProps): ReactNode;
+/**
+ * Headless Trust — mount the panel and read the token from React state.
+ *
+ * @example
+ * const { ref, token, status } = useTrustToken();
+ * return <><input name="email" /><div ref={ref} /></>;
+ * // then send `token` to your server; `status` is "pending" | "ready" | "unavailable".
+ */
+declare function useTrustToken(): {
+    /** Attach to the element the panel should mount into: `<div ref={ref} />`. */
+    ref: RefObject<HTMLDivElement | null>;
+    /** The minted token, or null until it mints (or if the panel failed open). */
+    token: string | null;
+    /** Lifecycle: pending → ready (minted) or unavailable (failed open). */
+    status: TrustTokenStatus;
+};
 
-export { CrossdeckProvider, useEntitlement, useEntitlements };
+export { CrossdeckProvider, CrossdeckTrust, type CrossdeckTrustProps, TrustTokenStatus, useEntitlement, useEntitlements, useTrustToken };

package/dist/react.mjs

@@ -1,5 +1,5 @@
 // src/react.ts
-import { useEffect, useRef, useState } from "react";
+import { createElement, useEffect, useRef, useState } from "react";
 
 // src/errors.ts
 var CrossdeckError = class _CrossdeckError extends Error {
@@ -72,7 +72,7 @@ function typeMapForStatus(status) {
 }
 
 // src/_version.ts
-var SDK_VERSION = "1.12.1";
+var SDK_VERSION = "1.13.0";
 var SDK_NAME = "@cross-deck/web";
 
 // src/http.ts
@@ -329,6 +329,125 @@ function randomChars(count) {
   return out.join("");
 }
 
+// src/trust.ts
+var TRUST_PANEL_ORIGIN = "https://trust.cross-deck.com";
+var MAX_WIDTH_PX = 360;
+var INITIAL_HEIGHT_PX = 132;
+var MIN_HEIGHT_PX = 96;
+var MAX_HEIGHT_PX = 220;
+var DEFAULT_TIMEOUT_MS2 = 15e3;
+function mountTrustPanel(opts) {
+  const origin = normalizeOrigin(opts.origin) || TRUST_PANEL_ORIGIN;
+  const timeoutMs = clampInt(opts.timeoutMs, DEFAULT_TIMEOUT_MS2, 1e3, 12e4);
+  let settled = false;
+  let onMessage = null;
+  let timer = null;
+  let frame = null;
+  let resolveReady;
+  const ready = new Promise((res) => {
+    resolveReady = res;
+  });
+  function settle(result, reason) {
+    if (settled) return;
+    settled = true;
+    if (timer) safe(() => clearTimeout(timer));
+    if (onMessage) safe(() => window.removeEventListener("message", onMessage));
+    if (result) {
+      safe(() => opts.onToken?.(result));
+      resolveReady(result);
+    } else {
+      const why = reason || "unavailable";
+      safe(() => opts.onUnavailable?.(why));
+      resolveReady({ token: null, expiresAt: null, reason: why });
+    }
+  }
+  try {
+    if (typeof window === "undefined" || typeof document === "undefined") {
+      queueMicrotask(() => settle(null, "no_dom"));
+      return makeHandle();
+    }
+    const host = resolveTarget(opts.target);
+    frame = createFrame(origin, opts.publicKey);
+    if (!host) {
+      queueMicrotask(() => settle(null, "no_mount_target"));
+      return makeHandle();
+    }
+    onMessage = (ev) => {
+      if (ev.origin !== origin) return;
+      if (!ev.data || !frame || ev.source !== frame.contentWindow) return;
+      const d = ev.data;
+      if (d.type === "cd-trust-size" && typeof d.height === "number") {
+        safe(() => {
+          if (frame) frame.style.height = clampInt(d.height, INITIAL_HEIGHT_PX, MIN_HEIGHT_PX, MAX_HEIGHT_PX) + "px";
+        });
+      } else if (d.type === "cd-trust-token" && typeof d.token === "string") {
+        settle({ token: d.token, expiresAt: typeof d.expMs === "number" ? d.expMs : null });
+      }
+    };
+    window.addEventListener("message", onMessage);
+    host.appendChild(frame);
+    timer = setTimeout(() => settle(null, "timeout"), timeoutMs);
+  } catch (err) {
+    queueMicrotask(() => settle(null, "mount_error:" + safeMessage(err)));
+  }
+  return makeHandle();
+  function makeHandle() {
+    return {
+      frame,
+      ready,
+      destroy() {
+        if (onMessage) safe(() => window.removeEventListener("message", onMessage));
+        if (timer) safe(() => clearTimeout(timer));
+        safe(() => frame?.parentNode?.removeChild(frame));
+        settle(null, "destroyed");
+      }
+    };
+  }
+}
+function createFrame(origin, publicKey) {
+  const frame = document.createElement("iframe");
+  frame.title = "Protected by Crossdeck Trust";
+  frame.setAttribute("aria-label", "Protected by Crossdeck Trust");
+  frame.setAttribute("scrolling", "no");
+  frame.setAttribute("allowtransparency", "true");
+  frame.style.cssText = "border:0;display:block;width:100%;max-width:" + MAX_WIDTH_PX + "px;height:" + INITIAL_HEIGHT_PX + "px;margin:0;background:transparent;color-scheme:light;";
+  frame.src = origin + "/panel?k=" + encodeURIComponent(publicKey || "");
+  return frame;
+}
+function resolveTarget(target) {
+  try {
+    if (typeof target === "string") return document.querySelector(target);
+    return target || null;
+  } catch {
+    return null;
+  }
+}
+function normalizeOrigin(o) {
+  if (!o || typeof o !== "string") return null;
+  try {
+    return new URL(o).origin;
+  } catch {
+    return null;
+  }
+}
+function clampInt(v, fallback, min, max) {
+  const n = typeof v === "number" && isFinite(v) ? v : fallback;
+  return Math.min(Math.max(n, min), max);
+}
+function safe(fn) {
+  try {
+    fn();
+  } catch {
+  }
+}
+function safeMessage(err) {
+  try {
+    return err instanceof Error ? err.message : String(err);
+  } catch {
+    return "unknown";
+  }
+}
+
 // src/hash.ts
 var K = new Uint32Array([
   1116352408,
@@ -5791,6 +5910,30 @@ var CrossdeckClient = class {
   getAnonymousId() {
     return this.state ? this.state.identity.anonymousId : null;
   }
+  /**
+   * **Crossdeck Trust** — human-proof at your signup, native to the SDK.
+   *
+   * `Crossdeck.trust.panel({ target, onToken })` renders the branded, un-restylable
+   * Trust panel (the same cross-origin iframe on every install) and mints a
+   * single-use attestation. Hand the token to your server and verify it at the gate
+   * (`crossdeck.trust.gate(...)` in @cross-deck/node). The publishable key is taken
+   * from your `init()` — you don't pass it again.
+   *
+   * Fail-open by contract: if the panel can't mint (adblocker, offline, our outage),
+   * `ready` resolves with `{ token: null }` and your signup proceeds — the server
+   * scores the missing token. It never throws and never blocks your form.
+   *
+   * @example
+   * const { ready } = Crossdeck.trust.panel({ target: "#cd-trust" });
+   * const result = await ready;                 // { token, expiresAt } | { token: null }
+   * await createUser({ email, cdTrustToken: result.token });
+   */
+  get trust() {
+    const publicKey = this.state ? this.state.options.publicKey : "";
+    return {
+      panel: (input) => mountTrustPanel({ ...input, publicKey })
+    };
+  }
   // ---------- private helpers ----------
   requireStarted() {
     if (!this.state) {
@@ -5997,9 +6140,47 @@ function safeListKeys() {
     return [];
   }
 }
+function CrossdeckTrust(props) {
+  const { onToken, onUnavailable, className, style, id } = props;
+  const hostRef = useRef(null);
+  const onTokenRef = useRef(onToken);
+  onTokenRef.current = onToken;
+  const onUnavailRef = useRef(onUnavailable);
+  onUnavailRef.current = onUnavailable;
+  useEffect(() => {
+    if (!hostRef.current) return;
+    const handle = Crossdeck.trust.panel({
+      target: hostRef.current,
+      onToken: (t) => onTokenRef.current?.(t),
+      onUnavailable: (r) => onUnavailRef.current?.(r)
+    });
+    return () => handle.destroy();
+  }, []);
+  return createElement("div", { ref: hostRef, className, style, id });
+}
+function useTrustToken() {
+  const ref = useRef(null);
+  const [token, setToken] = useState(null);
+  const [status, setStatus] = useState("pending");
+  useEffect(() => {
+    if (!ref.current) return;
+    const handle = Crossdeck.trust.panel({
+      target: ref.current,
+      onToken: (t) => {
+        setToken(t.token);
+        setStatus("ready");
+      },
+      onUnavailable: () => setStatus("unavailable")
+    });
+    return () => handle.destroy();
+  }, []);
+  return { ref, token, status };
+}
 export {
   CrossdeckProvider,
+  CrossdeckTrust,
   useEntitlement,
-  useEntitlements
+  useEntitlements,
+  useTrustToken
 };
 //# sourceMappingURL=react.mjs.map