@smooai/chat-widget 0.6.0 → 0.9.0

package/dist/index.js

@@ -1,4 +1,7 @@
+import { AsYouType, isValidPhoneNumber, parsePhoneNumber } from "libphonenumber-js/min";
 import { ProtocolError, SmoothAgentClient } from "@smooai/smooth-operator";
+import { createStore } from "zustand/vanilla";
+import { persist } from "zustand/middleware";
 //#region src/config.ts
 /** Resolve a partial config against the built-in defaults. */
 function resolveConfig(config) {
@@ -17,6 +20,7 @@ function resolveConfig(config) {
 		userName: config.userName,
 		userEmail: config.userEmail,
 		userPhone: config.userPhone,
+		authContext: config.authContext,
 		placeholder: config.placeholder ?? "Type a message…",
 		greeting: config.greeting ?? "Hi! How can I help you today?",
 		connectionErrorMessage: config.connectionErrorMessage ?? "We couldn't reach the chat. Please try again in a moment.",
@@ -25,6 +29,9 @@ function resolveConfig(config) {
 		requireName: config.requireName ?? false,
 		requireEmail: config.requireEmail ?? false,
 		requirePhone: config.requirePhone ?? false,
+		collectPhone: config.collectPhone ?? true,
+		collectConsent: config.collectConsent ?? true,
+		allowChatRestore: config.allowChatRestore ?? true,
 		allowAnonymous: config.allowAnonymous ?? false,
 		theme: {
 			text: theme.text ?? "#f8fafc",
@@ -48,6 +55,293 @@ function needsUserInfo(resolved) {
 	return !resolved.allowAnonymous && (resolved.requireName || resolved.requireEmail || resolved.requirePhone);
 }
 //#endregion
+//#region src/fingerprint.ts
+/**
+* Browser fingerprint — a stable, privacy-light identifier used by the
+* smooth-operator server to correlate an anonymous visitor's sessions across
+* page loads (and, server-side, to match an anonymous fingerprint to a known
+* CRM contact). It rides every `create_conversation_session` as
+* `browserFingerprint` (see ADR-048).
+*
+* ## Why not ThumbmarkJS
+*
+* The ADR floats ThumbmarkJS as the reference implementation. For an *embed*
+* that is injected onto arbitrary host pages, ThumbmarkJS is too heavy: its
+* full build pulls in extensive device-detection tables and async
+* component collection, adding tens of kilobytes (and async surface) to a
+* bundle whose whole selling point is staying out of the host page's
+* LCP/TBT budget. The fingerprint here is a few hundred bytes.
+*
+* ## What this is (and the tradeoff)
+*
+* The correlation that actually matters — "is this the same browser as last
+* time?" — is carried by a **persisted random UUID** (the `browserFingerprint`
+* field in the persisted store). That UUID is generated once and reused for
+* the life of the localStorage entry, so same-browser resume is exact and
+* deterministic. The signal hash below is a best-effort entropy *supplement*
+* mixed into that UUID's derivation seed on first generation — it gives the
+* server-side resolver a soft signal for the (rare) cross-storage case where
+* the UUID was cleared but the device is unchanged. It is intentionally NOT a
+* high-entropy device fingerprint: no canvas/WebGL/audio probes, no font
+* enumeration, nothing that reads as invasive tracking. The tradeoff is weaker
+* cross-storage matching in exchange for a tiny, transparent, no-network,
+* XSS-safe implementation. The server's resolver (SMOODEV-2129d) is the source
+* of truth for any fuzzy matching; the client just supplies a stable token.
+*/
+/** Collect a small set of stable, non-invasive browser signals. */
+function collectSignals() {
+	const parts = [];
+	try {
+		const nav = typeof navigator !== "undefined" ? navigator : void 0;
+		if (nav) {
+			parts.push(`ua:${nav.userAgent ?? ""}`);
+			parts.push(`lang:${nav.language ?? ""}`);
+			parts.push(`langs:${Array.isArray(nav.languages) ? nav.languages.join(",") : ""}`);
+			parts.push(`plat:${nav.platform ?? ""}`);
+			parts.push(`hc:${nav.hardwareConcurrency ?? ""}`);
+			parts.push(`dm:${nav.deviceMemory ?? ""}`);
+		}
+		if (typeof screen !== "undefined") parts.push(`scr:${screen.width}x${screen.height}x${screen.colorDepth}`);
+		if (typeof Intl !== "undefined") try {
+			parts.push(`tz:${Intl.DateTimeFormat().resolvedOptions().timeZone ?? ""}`);
+		} catch {}
+		parts.push(`tzo:${(/* @__PURE__ */ new Date()).getTimezoneOffset()}`);
+	} catch {}
+	return parts.join("|");
+}
+/**
+* A small, fast, non-cryptographic string hash (FNV-1a, 32-bit) rendered as
+* an unsigned hex string. Stable across runs for the same input. Not used for
+* any security decision — only to derive a deterministic seed from the signal
+* string above.
+*/
+function fnv1a(input) {
+	let h = 2166136261;
+	for (let i = 0; i < input.length; i++) {
+		h ^= input.charCodeAt(i);
+		h = Math.imul(h, 16777619);
+	}
+	return (h >>> 0).toString(16).padStart(8, "0");
+}
+/** Generate a UUID, preferring `crypto.randomUUID`, falling back to a v4-shaped string. */
+function generateUuid() {
+	try {
+		if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") return crypto.randomUUID();
+	} catch {}
+	return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
+		const r = Math.random() * 16 | 0;
+		return (c === "x" ? r : r & 3 | 8).toString(16);
+	});
+}
+/**
+* Compute a fresh fingerprint token: a stable random UUID, suffixed with the
+* FNV hash of the device signals so the server can recover a soft device
+* signal even if it only has the token. Called ONCE per browser (the result is
+* persisted and reused) — see {@link getOrCreateFingerprint}.
+*/
+function computeFingerprint() {
+	const signalHash = fnv1a(collectSignals());
+	return `${generateUuid()}.${signalHash}`;
+}
+/**
+* Return the cached fingerprint if one was already computed for this browser,
+* otherwise compute + persist a new one via the provided accessors. The
+* persistence layer owns storage; this function owns the "compute once" policy.
+*/
+function getOrCreateFingerprint(get, set) {
+	const existing = get();
+	if (existing) return existing;
+	const fp = computeFingerprint();
+	set(fp);
+	return fp;
+}
+//#endregion
+//#region src/persistence.ts
+/**
+* Persisted widget state — the identity / consent / session-pointer client layer
+* (ADR-048, SMOODEV-2129e).
+*
+* Built on Zustand's framework-agnostic `vanilla` store + the `persist`
+* middleware (the user explicitly chose Zustand; it's ~1KB and has no React
+* dependency, so it works inside the web component). The store is keyed per
+* agent — localStorage key `smoo-chat-widget:<agentId>` — so two agents embedded
+* on the same origin don't clobber each other.
+*
+* ## What persists (and, deliberately, what does NOT)
+*
+* Only a **pointer** to the conversation plus the visitor's identity + marketing
+* consent + verified email + browser fingerprint. The transcript is **never**
+* persisted: the smooth-operator server is the source of truth and the widget
+* re-hydrates history via `getMessages` on resume. This keeps localStorage small
+* and avoids stale/divergent transcripts.
+*
+* `version` drives `persist.migrate` so future shape changes can upgrade old
+* blobs in place instead of silently dropping them.
+*/
+/** Current persisted-shape version. Bump when the shape below changes incompatibly. */
+const PERSIST_VERSION = 1;
+const EMPTY_CONSENT = {
+	emailOptIn: false,
+	smsOptIn: false
+};
+function initialPersisted() {
+	return {
+		version: 1,
+		sessionId: null,
+		identity: {},
+		consent: { ...EMPTY_CONSENT },
+		verifiedEmail: null,
+		verifiedEmailSessionId: null,
+		browserFingerprint: null
+	};
+}
+/** localStorage key for an agent's persisted widget state. */
+function storageKey(agentId) {
+	return `smoo-chat-widget:${agentId}`;
+}
+/**
+* An explicit in-memory (Map-backed) `PersistStorage`. Used as the fallback when
+* real localStorage is unavailable.
+*
+* IMPORTANT: we must NOT return `undefined` from {@link safeStorage} in that case.
+* zustand v5's `persist` treats a missing `storage` option by falling back to its
+* OWN `createJSONStorage(() => localStorage)` — i.e. it re-engages the very
+* localStorage the guard was trying to avoid (throwing again in privacy mode).
+* Handing it this no-op storage keeps the store working purely in memory and
+* guarantees the fallback can't touch real localStorage.
+*/
+function memoryStorage() {
+	const mem = /* @__PURE__ */ new Map();
+	return {
+		getItem: (name) => {
+			const raw = mem.get(name);
+			if (!raw) return null;
+			try {
+				return JSON.parse(raw);
+			} catch {
+				return null;
+			}
+		},
+		setItem: (name, value) => {
+			mem.set(name, JSON.stringify(value));
+		},
+		removeItem: (name) => {
+			mem.delete(name);
+		}
+	};
+}
+/**
+* A `persist` storage adapter that tolerates the *absence* of localStorage
+* (SSR, privacy-mode throwing on access, sandboxed iframes). When storage is
+* unavailable the store still works in-memory; nothing is persisted, but the
+* widget never throws on boot.
+*/
+function safeStorage() {
+	let ls = null;
+	try {
+		ls = typeof localStorage !== "undefined" ? localStorage : null;
+		if (ls) {
+			const probe = "__smoo_probe__";
+			ls.setItem(probe, "1");
+			ls.removeItem(probe);
+		}
+	} catch {
+		ls = null;
+	}
+	if (!ls) return memoryStorage();
+	const storage = ls;
+	return {
+		getItem: (name) => {
+			try {
+				const raw = storage.getItem(name);
+				return raw ? JSON.parse(raw) : null;
+			} catch {
+				return null;
+			}
+		},
+		setItem: (name, value) => {
+			try {
+				storage.setItem(name, JSON.stringify(value));
+			} catch {}
+		},
+		removeItem: (name) => {
+			try {
+				storage.removeItem(name);
+			} catch {}
+		}
+	};
+}
+/**
+* Migrate a persisted blob from an older `version` to the current shape. Today
+* v1 is the only version, so this just backfills any missing fields onto an
+* unknown old blob; future versions add `case` branches here.
+*/
+function migrate(persisted) {
+	const base = initialPersisted();
+	if (!persisted || typeof persisted !== "object") return base;
+	const p = persisted;
+	return {
+		version: 1,
+		sessionId: typeof p.sessionId === "string" ? p.sessionId : null,
+		identity: {
+			name: typeof p.identity?.name === "string" ? p.identity.name : void 0,
+			email: typeof p.identity?.email === "string" ? p.identity.email : void 0,
+			phone: typeof p.identity?.phone === "string" ? p.identity.phone : void 0
+		},
+		consent: {
+			emailOptIn: p.consent?.emailOptIn === true,
+			smsOptIn: p.consent?.smsOptIn === true,
+			consentSource: typeof p.consent?.consentSource === "string" ? p.consent.consentSource : void 0,
+			consentAt: typeof p.consent?.consentAt === "string" ? p.consent.consentAt : void 0
+		},
+		verifiedEmail: typeof p.verifiedEmail === "string" ? p.verifiedEmail : null,
+		verifiedEmailSessionId: typeof p.verifiedEmailSessionId === "string" ? p.verifiedEmailSessionId : null,
+		browserFingerprint: typeof p.browserFingerprint === "string" ? p.browserFingerprint : null
+	};
+}
+/**
+* Create the per-agent persisted Zustand store. The `partialize` step ensures
+* only the persisted shape (never any future transient action/UI state) is
+* written to localStorage.
+*/
+function createWidgetStore(agentId) {
+	return createStore()(persist((set) => ({
+		...initialPersisted(),
+		setSessionId: (sessionId) => set({ sessionId }),
+		mergeIdentity: (identity) => set((state) => ({ identity: {
+			...state.identity,
+			...identity.name !== void 0 ? { name: identity.name } : {},
+			...identity.email !== void 0 ? { email: identity.email } : {},
+			...identity.phone !== void 0 ? { phone: identity.phone } : {}
+		} })),
+		setConsent: (consent) => set({ consent: { ...consent } }),
+		setVerifiedEmail: (verifiedEmail, sessionId) => set((state) => ({
+			verifiedEmail,
+			verifiedEmailSessionId: verifiedEmail === null ? null : sessionId ?? state.sessionId
+		})),
+		setBrowserFingerprint: (browserFingerprint) => set({ browserFingerprint }),
+		clearSession: () => set({
+			sessionId: null,
+			verifiedEmail: null,
+			verifiedEmailSessionId: null
+		})
+	}), {
+		name: storageKey(agentId),
+		version: 1,
+		storage: safeStorage(),
+		migrate,
+		partialize: (state) => ({
+			version: 1,
+			sessionId: state.sessionId,
+			identity: state.identity,
+			consent: state.consent,
+			verifiedEmail: state.verifiedEmail,
+			verifiedEmailSessionId: state.verifiedEmailSessionId,
+			browserFingerprint: state.browserFingerprint
+		})
+	}));
+}
+//#endregion
 //#region \0@oxc-project+runtime@0.134.0/helpers/esm/typeof.js
 function _typeof(o) {
 	"@babel/helpers - typeof";
@@ -97,13 +391,41 @@ function _defineProperty(e, r, t) {
 * so the swap is purely at the client-library boundary.
 *
 * Flow:
-*   1. `connect()`        → opens the WebSocket transport and `create_conversation_session`.
+*   1. `connect()`        → opens the WebSocket transport and `create_conversation_session`
+*                           (or RESUMES a persisted session via `get_session`/`get_messages`).
 *   2. `send(text)`       → `send_message`, streaming `stream_token` deltas into the
 *                           in-progress assistant message, then the terminal
 *                           `eventual_response`.
 *
+* 0.7.0 (SMOODEV-2129e) adds the identity / persistence / consent client layer:
+*   - `browserFingerprint` computed once + sent on every `create_conversation_session`.
+*   - identity + marketing consent threaded into the session `metadata`.
+*   - same-session RESUME on load (no engine change — `get_session` + `get_messages`).
+*   - returning-visitor RESUME via `POST /internal/resume-by-fingerprint`, and
+*     cross-device "restore my chats" via the `POST /internal/identity/{request-otp,
+*     verify-otp,resolve}` routes on the chat-ws wrapper. The engine (smooth-operator
+*     1.8.0) owns the `/ws` dispatch and REJECTS unknown verbs, so these are HTTP
+*     `fetch()` calls (origin-allowlisted + optional authContext, per ADR-046/048) —
+*     NOT WS frames.
+*
 * The controller is UI-agnostic: it emits typed events and the view renders them.
 */
+/**
+* Derive the HTTP base for the chat-ws wrapper's `/internal/*` REST routes from
+* the WS endpoint:  `wss://ai.smoo.ai/ws` → `https://ai.smoo.ai`. The engine
+* (smooth-operator 1.8.0) owns the `/ws` dispatch and REJECTS unknown verbs, so
+* the cross-device identity flow + fingerprint resume are HTTP POST routes on the
+* wrapper (origin-allowlisted + authContext, per ADR-046/ADR-048) — NOT WS frames.
+*/
+function httpBaseFromWsEndpoint(endpoint) {
+	try {
+		const u = new URL(endpoint);
+		u.protocol = u.protocol === "ws:" ? "http:" : u.protocol === "wss:" ? "https:" : u.protocol;
+		return `${u.protocol}//${u.host}`;
+	} catch {
+		return null;
+	}
+}
 /** Pull the final assistant text out of an `eventual_response` data payload. */
 function extractFinalText(response) {
 	if (!response || typeof response !== "object") return null;
@@ -144,40 +466,89 @@ function extractCitations(inner) {
 	}
 	return out;
 }
+/** Convert a server message row into a finalized {@link ChatMessage}. */
+function wireMessageToChat(m, idx) {
+	const text = typeof m.content?.text === "string" ? m.content.text : "";
+	if (!text) return null;
+	const role = m.direction === "outbound" ? "assistant" : "user";
+	return {
+		id: typeof m.id === "string" ? m.id : `hist-${idx}`,
+		role,
+		text,
+		streaming: false
+	};
+}
 var ConversationController = class {
-	constructor(config, events) {
+	constructor(config, events, store) {
 		_defineProperty(this, "config", void 0);
 		_defineProperty(this, "events", void 0);
+		_defineProperty(this, "store", void 0);
 		_defineProperty(this, "client", null);
 		_defineProperty(this, "sessionId", null);
 		_defineProperty(this, "messages", []);
 		_defineProperty(this, "status", "idle");
 		_defineProperty(this, "seq", 0);
-		_defineProperty(this, "identity", void 0);
 		_defineProperty(this, "activeRequestId", null);
 		_defineProperty(this, "interrupt", null);
+		_defineProperty(this, "identityRestore", { phase: "idle" });
+		_defineProperty(this, "resumeAttempted", false);
+		_defineProperty(this, "httpBase", void 0);
 		this.config = config;
 		this.events = events;
-		this.identity = {
-			name: config.userName,
-			email: config.userEmail,
-			phone: config.userPhone
-		};
+		this.httpBase = httpBaseFromWsEndpoint(config.endpoint);
+		if (this.httpBase === null) queueMicrotask(() => this.setStatus("error", `Invalid chat endpoint: ${config.endpoint}`));
+		this.store = store ?? createWidgetStore(config.agentId);
+		const seed = {};
+		if (config.userName) seed.name = config.userName;
+		if (config.userEmail) seed.email = config.userEmail;
+		if (config.userPhone) seed.phone = config.userPhone;
+		if (Object.keys(seed).length > 0) this.store.getState().mergeIdentity(seed);
 	}
 	get connectionStatus() {
 		return this.status;
 	}
-	/** Merge in visitor identity (from the pre-chat form). Applied on next connect. */
+	/** The persisted store, exposed so the view can read identity for the pre-chat gate. */
+	getStore() {
+		return this.store;
+	}
+	/** True when a persisted session pointer exists (drives the resume path). */
+	hasPersistedSession() {
+		return !!this.store.getState().sessionId;
+	}
+	/** True when persisted identity exists (lets the view skip the pre-chat form). */
+	hasPersistedIdentity() {
+		const id = this.store.getState().identity;
+		return !!(id.name || id.email || id.phone);
+	}
+	/** Merge in visitor identity + consent (from the pre-chat form). Applied on next connect. */
 	setUserInfo(info) {
-		this.identity = {
-			...this.identity,
-			...info
-		};
+		const { name, email, phone, consent } = info;
+		this.store.getState().mergeIdentity({
+			name,
+			email,
+			phone
+		});
+		if (consent) {
+			const consentAt = consent.emailOptIn || consent.smsOptIn ? (/* @__PURE__ */ new Date()).toISOString() : void 0;
+			this.store.getState().setConsent({
+				emailOptIn: consent.emailOptIn,
+				smsOptIn: consent.smsOptIn,
+				consentSource: "chat-widget-prechat",
+				consentAt
+			});
+		}
 	}
 	setInterrupt(interrupt) {
 		this.interrupt = interrupt;
 		this.events.onInterrupt?.(interrupt);
 	}
+	setIdentityRestore(state) {
+		this.identityRestore = state;
+		this.events.onIdentityRestore?.(state);
+	}
+	get currentIdentityRestore() {
+		return this.identityRestore;
+	}
 	/** Submit an OTP code to resume the paused turn. No-op if not awaiting OTP. */
 	verifyOtp(code) {
 		if (!this.client || !this.sessionId || !this.activeRequestId || this.interrupt?.kind !== "otp") return;
@@ -208,20 +579,95 @@ var ConversationController = class {
 	emitMessages() {
 		this.events.onMessages(this.messages.map((m) => ({ ...m })));
 	}
-	/** Open the transport and create a conversation session. Idempotent. */
+	/** Compute (once) + return the persisted browser fingerprint. */
+	fingerprint() {
+		const state = this.store.getState();
+		return getOrCreateFingerprint(() => state.browserFingerprint, (fp) => this.store.getState().setBrowserFingerprint(fp));
+	}
+	/**
+	* Build the `metadata` payload threaded into `create_conversation_session`:
+	* phone (no first-class engine field) and consent.
+	*
+	* NOTE: `verifiedEmail` is deliberately NOT stamped here. It is a per-session
+	* OTP proof bound to the session it was verified against
+	* (`verifiedEmailSessionId`), and the server only treats an actual OTP `verify`
+	* as proof — metadata `verifiedEmail` is just a hint. Auto-stamping it onto
+	* every brand-new `create_conversation_session` would mislabel a fresh
+	* visitor's session with a prior (possibly different) visitor's email on a
+	* shared browser. The verified email is only used when RESUMING the exact
+	* session it was proven for — see {@link verifiedEmailForSession}.
+	*/
+	sessionMetadata() {
+		const state = this.store.getState();
+		const meta = {};
+		if (state.identity.phone) meta.userPhone = state.identity.phone;
+		const consent = state.consent;
+		if (consent.emailOptIn || consent.smsOptIn || consent.consentAt) {
+			const c = {
+				emailOptIn: consent.emailOptIn,
+				smsOptIn: consent.smsOptIn,
+				consentSource: consent.consentSource ?? "chat-widget-prechat"
+			};
+			if (consent.consentAt) c.consentAt = consent.consentAt;
+			meta.consent = c;
+		}
+		return Object.keys(meta).length > 0 ? meta : void 0;
+	}
+	/**
+	* The verified-email hint, but ONLY when the OTP proof is bound to the session
+	* being resumed (`verifiedEmailSessionId === sessionId`). Returns null
+	* otherwise so a stale/cross-visitor proof is never threaded onto a session it
+	* wasn't proven for.
+	*/
+	verifiedEmailForSession(sessionId) {
+		const state = this.store.getState();
+		if (state.verifiedEmail && state.verifiedEmailSessionId === sessionId) return state.verifiedEmail;
+		return null;
+	}
+	/** Lazily open the WS client (default transport). Idempotent within a connect. */
+	async ensureClient() {
+		if (this.client) return;
+		this.client = new SmoothAgentClient({ url: this.config.endpoint });
+		await this.client.connect();
+	}
+	/**
+	* Open the connection and either RESUME or create a session.
+	*
+	* 1. Persisted pointer (ADR-048 §b): `get_session` → if not `ended`, reuse +
+	*    hydrate from `get_messages` (newest-first, reversed). On ended/404 clear
+	*    ONLY the pointer (identity/consent survive).
+	* 2. No persisted pointer: POST `/internal/resume-by-fingerprint` FIRST; if
+	*    `resumable`, adopt the returned session (the wrapper has primed the
+	*    operator registry), reuse the sessionId, and hydrate via get_session/
+	*    get_messages — rather than relying on createConversationSession to resume.
+	* 3. Otherwise create a fresh session.
+	*/
 	async connect() {
 		if (this.status === "connecting" || this.status === "ready") return;
 		this.setStatus("connecting");
 		try {
-			this.client = new SmoothAgentClient({ url: this.config.endpoint });
-			await this.client.connect();
-			const session = await this.client.createConversationSession({
-				agentId: this.config.agentId,
-				userName: this.identity.name,
-				userEmail: this.identity.email,
-				...this.identity.phone ? { metadata: { userPhone: this.identity.phone } } : {}
-			});
-			this.sessionId = session.sessionId;
+			await this.ensureClient();
+			if (!this.resumeAttempted) {
+				this.resumeAttempted = true;
+				const persistedSessionId = this.store.getState().sessionId;
+				if (persistedSessionId) {
+					if (await this.tryResume(persistedSessionId)) {
+						this.setStatus("ready");
+						return;
+					}
+					this.store.getState().clearSession();
+				} else {
+					const fpSessionId = await this.resumeByFingerprint();
+					if (fpSessionId) {
+						if (await this.tryResume(fpSessionId)) {
+							this.store.getState().setSessionId(fpSessionId);
+							this.setStatus("ready");
+							return;
+						}
+					}
+				}
+			}
+			await this.createSession();
 			this.setStatus("ready");
 		} catch (err) {
 			this.setStatus("error", err instanceof Error ? err.message : String(err));
@@ -229,6 +675,105 @@ var ConversationController = class {
 		}
 	}
 	/**
+	* Build the auth fields every `/internal/*` route shares: `agentId` (required
+	* for the agent-policy lookup), `agentName` (used as the OTP email sender), and
+	* the optional pre-auth `authContext` the host page may have configured. The
+	* `Origin` header is sent automatically by the browser and checked server-side.
+	*/
+	authBody() {
+		const body = { agentId: this.config.agentId };
+		if (this.config.agentName) body.agentName = this.config.agentName;
+		if (this.config.authContext) body.authContext = this.config.authContext;
+		return body;
+	}
+	/** POST JSON to a `/internal/*` route; returns the parsed body (or throws). */
+	async postInternal(path, payload) {
+		if (this.httpBase === null) throw new Error(`Cannot reach ${path}: the chat endpoint is not an absolute URL.`);
+		const res = await fetch(`${this.httpBase}${path}`, {
+			method: "POST",
+			headers: { "content-type": "application/json" },
+			credentials: "omit",
+			body: JSON.stringify({
+				...this.authBody(),
+				...payload
+			})
+		});
+		let json = {};
+		try {
+			json = await res.json();
+		} catch {
+			json = {};
+		}
+		if (!res.ok) {
+			const err = json.error;
+			throw new Error(err?.message ?? `${path} failed (${res.status})`);
+		}
+		return json;
+	}
+	/**
+	* POST `/internal/resume-by-fingerprint`. Returns the resumable sessionId when
+	* the wrapper found (and primed) a recent session for this fingerprint, else
+	* null. Network/route failures are swallowed → null (fall through to create).
+	*/
+	async resumeByFingerprint() {
+		try {
+			const json = await this.postInternal("/internal/resume-by-fingerprint", { browserFingerprint: this.fingerprint() });
+			if (json.resumable === true && typeof json.sessionId === "string") return json.sessionId;
+		} catch {}
+		return null;
+	}
+	/** `create_conversation_session` with fingerprint + identity + consent metadata. */
+	async createSession() {
+		if (!this.client) throw new Error("Conversation is not connected");
+		const state = this.store.getState();
+		const metadata = this.sessionMetadata();
+		const session = await this.client.createConversationSession({
+			agentId: this.config.agentId,
+			userName: state.identity.name,
+			userEmail: state.identity.email,
+			browserFingerprint: this.fingerprint(),
+			...metadata ? { metadata } : {}
+		});
+		this.sessionId = session.sessionId;
+		this.store.getState().setSessionId(session.sessionId);
+	}
+	/**
+	* Attempt to resume `sessionId`: returns true and hydrates the transcript when
+	* the session is live, false when it has ended / can't be fetched.
+	*/
+	async tryResume(sessionId) {
+		if (!this.client) return false;
+		let snap;
+		try {
+			snap = await this.client.getSession({ sessionId });
+		} catch {
+			return false;
+		}
+		if (snap.status === "ended") return false;
+		this.sessionId = sessionId;
+		await this.hydrateHistory(sessionId);
+		return true;
+	}
+	/** Page recent history (newest-first), reverse to chronological, and render. */
+	async hydrateHistory(sessionId) {
+		if (!this.client) return;
+		try {
+			const page = await this.client.getMessages({
+				sessionId,
+				limit: 50
+			});
+			const chronological = [...Array.isArray(page.messages) ? page.messages : []].reverse();
+			const hydrated = [];
+			chronological.forEach((m, i) => {
+				const chat = wireMessageToChat(m, i);
+				if (chat) hydrated.push(chat);
+			});
+			this.messages.length = 0;
+			this.messages.push(...hydrated);
+			this.emitMessages();
+		} catch {}
+	}
+	/**
 	* Submit a user message. Appends the user bubble immediately, then streams the
 	* assistant reply token-by-token, finalizing on `eventual_response`.
 	*/
@@ -330,12 +875,170 @@ var ConversationController = class {
 			default: break;
 		}
 	}
+	/**
+	* Begin the cross-device restore: POST `/internal/identity/request-otp` for
+	* `email` over `channel`. The view collects the email via an explicit affordance.
+	*/
+	async requestIdentityOtp(email, channel = "email") {
+		const trimmed = email.trim();
+		if (!trimmed) return;
+		this.setIdentityRestore({
+			phase: "requesting",
+			email: trimmed,
+			channel
+		});
+		if (!this.sessionId) try {
+			await this.connect();
+		} catch {}
+		if (!this.sessionId) {
+			this.setIdentityRestore({
+				phase: "error",
+				message: "No active session to verify against."
+			});
+			return;
+		}
+		try {
+			const json = await this.postInternal("/internal/identity/request-otp", {
+				sessionId: this.sessionId,
+				email: trimmed,
+				channel
+			});
+			const masked = typeof json.maskedDestination === "string" ? json.maskedDestination : void 0;
+			this.setIdentityRestore({
+				phase: "awaiting_code",
+				email: trimmed,
+				channel,
+				maskedDestination: masked
+			});
+		} catch (err) {
+			this.setIdentityRestore({
+				phase: "error",
+				message: err instanceof Error ? err.message : "Could not send a verification code."
+			});
+		}
+	}
+	/** Submit the code: POST `/internal/identity/verify-otp`, then resolve on success. */
+	async verifyIdentityOtp(code) {
+		const state = this.identityRestore;
+		const trimmed = code.trim();
+		if (!trimmed || state.phase !== "awaiting_code") return;
+		const { email, channel } = state;
+		if (!this.sessionId) {
+			this.setIdentityRestore({
+				phase: "error",
+				message: "No active session to verify against."
+			});
+			return;
+		}
+		this.setIdentityRestore({
+			phase: "verifying",
+			email,
+			channel
+		});
+		try {
+			const json = await this.postInternal("/internal/identity/verify-otp", {
+				sessionId: this.sessionId,
+				email,
+				code: trimmed
+			});
+			if (json.event === "otp_verified") {
+				this.store.getState().setVerifiedEmail(email, this.sessionId);
+				await this.resolveIdentity(email);
+			} else if (json.event === "otp_invalid") {
+				const remaining = typeof json.attemptsRemaining === "number" ? json.attemptsRemaining : void 0;
+				this.setIdentityRestore({
+					phase: "awaiting_code",
+					email,
+					channel,
+					error: "That code was incorrect.",
+					attemptsRemaining: remaining
+				});
+			} else this.setIdentityRestore({
+				phase: "error",
+				message: "Verification failed."
+			});
+		} catch (err) {
+			this.setIdentityRestore({
+				phase: "error",
+				message: err instanceof Error ? err.message : "Verification failed."
+			});
+		}
+	}
+	/** Resolve the verified identity → restorable conversations via POST `/internal/identity/resolve`. */
+	async resolveIdentity(email) {
+		if (!this.sessionId) return;
+		this.setIdentityRestore({
+			phase: "resolving",
+			email
+		});
+		try {
+			const json = await this.postInternal("/internal/identity/resolve", {
+				sessionId: this.sessionId,
+				email
+			});
+			if (json.resolved !== true) {
+				this.setIdentityRestore({
+					phase: "resolved",
+					email,
+					conversations: []
+				});
+				return;
+			}
+			const raw = json.conversations;
+			const conversations = Array.isArray(raw) ? raw.map((c) => {
+				if (!c || typeof c !== "object") return null;
+				const o = c;
+				const conversationId = typeof o.conversationId === "string" ? o.conversationId : "";
+				const sessionId = typeof o.sessionId === "string" ? o.sessionId : "";
+				if (!sessionId) return null;
+				return {
+					conversationId,
+					sessionId,
+					lastActivityAt: typeof o.lastActivityAt === "string" ? o.lastActivityAt : void 0,
+					preview: typeof o.preview === "string" ? o.preview : void 0
+				};
+			}).filter((c) => c !== null) : [];
+			this.setIdentityRestore({
+				phase: "resolved",
+				email,
+				conversations
+			});
+		} catch (err) {
+			this.setIdentityRestore({
+				phase: "error",
+				message: err instanceof Error ? err.message : "Could not load your chats."
+			});
+		}
+	}
+	/**
+	* Replay a chosen restorable conversation: point the live session at its
+	* sessionId, hydrate its transcript (get_session + get_messages), and persist
+	* the new pointer so the next `sendMessage` continues it.
+	*/
+	async restoreConversation(sessionId) {
+		if (!this.client) await this.ensureClient();
+		const proven = this.sessionId ? this.verifiedEmailForSession(this.sessionId) : null;
+		if (await this.tryResume(sessionId)) {
+			this.store.getState().setSessionId(sessionId);
+			if (proven) this.store.getState().setVerifiedEmail(proven, sessionId);
+			this.setIdentityRestore({ phase: "idle" });
+			this.setStatus("ready");
+		} else this.setIdentityRestore({
+			phase: "error",
+			message: "That conversation is no longer available."
+		});
+	}
+	/** Dismiss the cross-device restore panel. */
+	cancelIdentityRestore() {
+		this.setIdentityRestore({ phase: "idle" });
+	}
 	/** Tear down the underlying client. */
 	disconnect() {
 		this.client?.disconnect("widget closed");
 		this.client = null;
 		this.sessionId = null;
 		this.activeRequestId = null;
+		this.resumeAttempted = false;
 		this.setInterrupt(null);
 		this.setStatus("closed");
 	}
@@ -1162,6 +1865,24 @@ function buildStyles(theme, mode = "popover") {
     border-color: color-mix(in srgb, var(--sac-primary) 60%, transparent);
     box-shadow: 0 0 0 4px color-mix(in srgb, var(--sac-primary) 14%, transparent);
 }
+/* Inline phone validity — subtle, themed. Empty stays neutral (optional field). */
+.pc-field.valid input {
+    border-color: color-mix(in srgb, var(--sac-primary) 55%, #2faa6a 45%);
+}
+.pc-field.invalid input {
+    border-color: color-mix(in srgb, #e2566b 62%, var(--sac-border) 38%);
+}
+.pc-field.invalid input:focus {
+    box-shadow: 0 0 0 4px color-mix(in srgb, #e2566b 16%, transparent);
+}
+.pc-field .pc-hint {
+    min-height: 13px;
+    margin-top: 1px;
+    font-size: 11.5px;
+    font-weight: 500;
+    line-height: 1.2;
+    color: color-mix(in srgb, #e2566b 78%, var(--sac-text) 22%);
+}
 .pc-submit {
     margin-top: 4px;
     border: none;
@@ -1177,6 +1898,17 @@ function buildStyles(theme, mode = "popover") {
 }
 .pc-submit:hover { transform: translateY(-1px); }
 .pc-submit:active { transform: scale(.98); }
+.pc-consents { display: flex; flex-direction: column; gap: 9px; margin-top: 2px; }
+.pc-consent { display: flex; align-items: flex-start; gap: 9px; cursor: pointer; }
+.pc-consent input {
+    margin-top: 2px;
+    width: 16px;
+    height: 16px;
+    flex: 0 0 auto;
+    accent-color: var(--sac-primary);
+    cursor: pointer;
+}
+.pc-consent span { font-size: 12px; line-height: 1.4; color: color-mix(in srgb, var(--sac-text) 72%, transparent); }
 
 /* ─────────────────── Starter-prompt chips ─────────────────────────── */
 .prompts { display: flex; flex-wrap: wrap; gap: 8px; margin: 2px 0 2px 35px; }
@@ -1255,6 +1987,61 @@ function buildStyles(theme, mode = "popover") {
 .int-row .int-btn { flex: 1; }
 .int-row .int-input + .int-btn { flex: 0 0 auto; }
 .int-error { margin-top: 8px; font-size: 12px; color: #f87171; }
+.int-card { position: relative; }
+.int-close {
+    position: absolute;
+    top: 8px;
+    right: 9px;
+    border: none;
+    background: transparent;
+    color: color-mix(in srgb, var(--sac-text) 55%, transparent);
+    font-size: 18px;
+    line-height: 1;
+    cursor: pointer;
+    padding: 2px 4px;
+    border-radius: 6px;
+    transition: color .2s ease, background .2s ease;
+}
+.int-close:hover { color: var(--sac-text); background: color-mix(in srgb, var(--sac-text) 8%, transparent); }
+
+/* ─────────────── Cross-device "Restore my chats" ──────────────────── */
+.restore-link {
+    border: none;
+    background: none;
+    padding: 0;
+    font: inherit;
+    font-size: 10.5px;
+    letter-spacing: .04em;
+    color: color-mix(in srgb, var(--sac-primary) 80%, var(--sac-text));
+    cursor: pointer;
+    text-decoration: underline;
+    text-underline-offset: 2px;
+}
+.restore-link:hover { color: var(--sac-primary); }
+.restore-list { display: flex; flex-direction: column; gap: 7px; margin-top: 9px; }
+.restore-item {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 10px;
+    text-align: left;
+    border: 1px solid color-mix(in srgb, var(--sac-border) 80%, transparent);
+    background: var(--sac-bg);
+    color: var(--sac-text);
+    border-radius: 10px;
+    padding: 9px 11px;
+    font-family: inherit;
+    font-size: 12.5px;
+    cursor: pointer;
+    transition: border-color .2s ease, background .2s ease, transform .2s ease;
+}
+.restore-item:hover {
+    border-color: color-mix(in srgb, var(--sac-primary) 50%, transparent);
+    background: color-mix(in srgb, var(--sac-primary) 8%, var(--sac-bg));
+    transform: translateY(-1px);
+}
+.restore-preview { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.restore-when { flex: 0 0 auto; font-size: 11px; color: color-mix(in srgb, var(--sac-text) 55%, transparent); }
 
 .hidden { display: none !important; }
 
@@ -1266,7 +2053,46 @@ function buildStyles(theme, mode = "popover") {
 }
 //#endregion
 //#region src/element.ts
+/**
+* `<smooth-agent-chat>` — a framework-light embeddable chat web component.
+*
+* A clean, dependency-light web component that preserves a familiar embedding
+* model — a launcher + popover panel, declarative HTML attributes, and a
+* programmatic API — while talking to the `@smooai/smooth-operator` protocol
+* client. The visual layer is the "Aurora Glass" design system (see
+* {@link buildStyles}): a spring launcher with a live presence pulse, a
+* glass-depth panel, a gradient brand avatar + status dot, an animated typing
+* indicator, message rise-in, refined source cards, and an icon composer. Every
+* color is driven by `--sac-*` custom properties so a host's brand flows through.
+*
+* Embedding model:
+*   <smooth-agent-chat endpoint="ws://localhost:8787/ws" agent-id="…"></smooth-agent-chat>
+* or programmatically via {@link mountChatWidget}.
+*/
 const ELEMENT_TAG = "smooth-agent-chat";
+/**
+* Default region for phone parsing/formatting on the pre-chat form. The widget
+* is US-first; the backend does the authoritative E.164 normalization (SMOODEV-2153),
+* so this only governs the as-you-type display + the inline validity hint and the
+* best-effort E.164 we send when the number already parses as valid.
+*/
+const PHONE_DEFAULT_REGION = "US";
+/**
+* Best-effort E.164 for an as-typed phone number. Returns the canonical
+* `+1…` form when the value parses to a valid number in {@link PHONE_DEFAULT_REGION},
+* otherwise `null` (caller falls back to sending the raw value — the backend
+* re-parses and normalizes/nulls authoritatively).
+*/
+function phoneToE164(value) {
+	const v = value.trim();
+	if (!v) return null;
+	try {
+		if (!isValidPhoneNumber(v, PHONE_DEFAULT_REGION)) return null;
+		return parsePhoneNumber(v, PHONE_DEFAULT_REGION).number;
+	} catch {
+		return null;
+	}
+}
 const OBSERVED = [
 	"endpoint",
 	"agent-id",
@@ -1315,6 +2141,9 @@ var SmoothAgentChatElement = class extends HTMLElement {
 		_defineProperty(this, "greeting", "");
 		_defineProperty(this, "interrupt", null);
 		_defineProperty(this, "interruptEl", null);
+		_defineProperty(this, "identityRestore", { phase: "idle" });
+		_defineProperty(this, "allowChatRestore", true);
+		_defineProperty(this, "gating", false);
 		_defineProperty(this, "panelEl", null);
 		_defineProperty(this, "launcherEl", null);
 		_defineProperty(this, "messagesEl", null);
@@ -1361,7 +2190,7 @@ var SmoothAgentChatElement = class extends HTMLElement {
 	openChat() {
 		this.open = true;
 		this.syncOpenState();
-		this.controller?.connect().catch(() => {});
+		if (!this.gating) this.controller?.connect().catch(() => {});
 	}
 	/** Collapse the chat panel back to the launcher. */
 	closeChat() {
@@ -1382,6 +2211,7 @@ var SmoothAgentChatElement = class extends HTMLElement {
 			userName: this.overrides.userName,
 			userEmail: this.overrides.userEmail,
 			userPhone: this.overrides.userPhone,
+			authContext: this.overrides.authContext,
 			placeholder: this.overrides.placeholder ?? this.getAttribute("placeholder") ?? void 0,
 			greeting: this.overrides.greeting ?? this.getAttribute("greeting") ?? void 0,
 			connectionErrorMessage: this.overrides.connectionErrorMessage,
@@ -1390,6 +2220,9 @@ var SmoothAgentChatElement = class extends HTMLElement {
 			requireName: this.overrides.requireName,
 			requireEmail: this.overrides.requireEmail,
 			requirePhone: this.overrides.requirePhone,
+			collectPhone: this.overrides.collectPhone,
+			collectConsent: this.overrides.collectConsent,
+			allowChatRestore: this.overrides.allowChatRestore,
 			allowAnonymous: this.overrides.allowAnonymous,
 			theme
 		};
@@ -1401,6 +2234,7 @@ var SmoothAgentChatElement = class extends HTMLElement {
 			return;
 		}
 		const resolved = resolveConfig(config);
+		this.allowChatRestore = resolved.allowChatRestore;
 		if (!this.controller) {
 			this.controller = new ConversationController(config, {
 				onMessages: (messages) => {
@@ -1414,9 +2248,14 @@ var SmoothAgentChatElement = class extends HTMLElement {
 				onInterrupt: (interrupt) => {
 					this.interrupt = interrupt;
 					this.renderInterrupt();
+				},
+				onIdentityRestore: (state) => {
+					this.identityRestore = state;
+					this.renderInterrupt();
 				}
 			});
 			if (resolved.startOpen) this.open = true;
+			if (this.controller.hasPersistedSession() || this.controller.hasPersistedIdentity()) this.userInfoSatisfied = true;
 		}
 		const fullpage = resolved.mode === "fullpage";
 		if (fullpage) this.open = true;
@@ -1441,7 +2280,14 @@ var SmoothAgentChatElement = class extends HTMLElement {
 		this.examplePrompts = resolved.examplePrompts;
 		this.greeting = resolved.greeting;
 		const gating = needsUserInfo(resolved) && !this.userInfoSatisfied;
-		const field = (name, type, label, autocomplete) => `<label class="pc-field"><span>${escapeHtml(label)}</span><input name="${name}" type="${type}" autocomplete="${autocomplete}" required /></label>`;
+		this.gating = gating;
+		const showPhone = resolved.requirePhone || resolved.collectPhone;
+		const field = (name, type, label, autocomplete, required, hint = false) => `<label class="pc-field"><span>${escapeHtml(label)}</span><input name="${name}" type="${type}" autocomplete="${autocomplete}"${required ? " required" : ""} />${hint ? "<span class=\"pc-hint\" aria-live=\"polite\"></span>" : ""}</label>`;
+		const consentBox = (name, label) => `<label class="pc-consent"><input name="${name}" type="checkbox" /><span>${escapeHtml(label)}</span></label>`;
+		const consentHtml = resolved.collectConsent ? `<div class="pc-consents">
+                    ${consentBox("emailOptIn", "Email me product news and offers.")}
+                    ${consentBox("smsOptIn", "Text me updates by SMS. Message/data rates may apply.")}
+                </div>` : "";
 		const prechatHtml = `
             <div class="prechat">
                 <div class="pc-head">
@@ -1449,12 +2295,14 @@ var SmoothAgentChatElement = class extends HTMLElement {
                     <div class="pc-sub">A couple details so ${escapeHtml(resolved.agentName)} can help.</div>
                 </div>
                 <form class="pc-form" novalidate>
-                    ${resolved.requireName ? field("name", "text", "Name", "name") : ""}
-                    ${resolved.requireEmail ? field("email", "email", "Email", "email") : ""}
-                    ${resolved.requirePhone ? field("phone", "tel", "Phone", "tel") : ""}
+                    ${resolved.requireName ? field("name", "text", "Name", "name", true) : ""}
+                    ${resolved.requireEmail ? field("email", "email", "Email", "email", true) : ""}
+                    ${showPhone ? field("phone", "tel", "Phone", "tel", resolved.requirePhone, true) : ""}
+                    ${consentHtml}
                     <button type="submit" class="pc-submit">Start chat</button>
                 </form>
             </div>`;
+		const restoreLink = this.allowChatRestore ? ` · <button type="button" class="restore-link">Restore my chats</button>` : "";
 		const chatHtml = `
                 <div class="messages"></div>
                 <div class="interrupt hidden"></div>
@@ -1463,7 +2311,7 @@ var SmoothAgentChatElement = class extends HTMLElement {
                         <textarea rows="1" placeholder="${escapeHtml(resolved.placeholder)}"></textarea>
                         <button class="send" type="button" aria-label="Send message">${ICON.send}</button>
                     </div>
-                    <div class="footer">powered by <b>smooth&#8209;operator</b></div>
+                    <div class="footer">powered by <b>smooth&#8209;operator</b>${restoreLink}</div>
                 </div>`;
 		const container = document.createElement("div");
 		container.innerHTML = `
@@ -1501,6 +2349,14 @@ var SmoothAgentChatElement = class extends HTMLElement {
 			ev.preventDefault();
 			this.handlePrechatSubmit(pcForm);
 		});
+		this.wirePhoneField(pcForm);
+		container.querySelector(".restore-link")?.addEventListener("click", () => {
+			(async () => {
+				this.identityRestore = { phase: "awaiting_email" };
+				this.renderInterrupt();
+				await this.controller?.connect().catch(() => {});
+			})();
+		});
 		if (fullpage && !gating) this.controller?.connect().catch(() => {});
 		this.syncOpenState();
 		if (!gating) this.renderMessages();
@@ -1519,6 +2375,11 @@ var SmoothAgentChatElement = class extends HTMLElement {
 		el.replaceChildren();
 		const it = this.interrupt;
 		if (!it) {
+			if (this.identityRestore.phase !== "idle") {
+				el.classList.remove("hidden");
+				el.appendChild(this.buildRestoreCard());
+				return;
+			}
 			el.classList.add("hidden");
 			return;
 		}
@@ -1598,15 +2459,247 @@ var SmoothAgentChatElement = class extends HTMLElement {
 		}
 		el.appendChild(card);
 	}
-	/** Collect identity from the pre-chat form, then drop into the chat view. */
+	/**
+	* Build the cross-device "Restore my chats" card (ADR-048 §c). Reuses the
+	* same overlay slot + visual language as the OTP interrupt. All server-supplied
+	* strings (masked destination, conversation previews) are set via `textContent`
+	* — never innerHTML — so they can't inject markup; only the static lock icon
+	* uses innerHTML.
+	*/
+	buildRestoreCard() {
+		const state = this.identityRestore;
+		const card = document.createElement("div");
+		card.className = "int-card";
+		const head = document.createElement("div");
+		head.className = "int-head";
+		const ico = document.createElement("span");
+		ico.className = "int-ico";
+		ico.innerHTML = ICON.lock;
+		const title = document.createElement("span");
+		title.className = "int-title";
+		title.textContent = "Restore your chats";
+		head.append(ico, title);
+		card.appendChild(head);
+		const close = document.createElement("button");
+		close.className = "int-close";
+		close.type = "button";
+		close.setAttribute("aria-label", "Cancel");
+		close.textContent = "×";
+		close.addEventListener("click", () => {
+			this.controller?.cancelIdentityRestore();
+			this.identityRestore = { phase: "idle" };
+			this.renderInterrupt();
+		});
+		card.appendChild(close);
+		if (state.phase === "awaiting_email") {
+			const desc = document.createElement("div");
+			desc.className = "int-desc";
+			desc.textContent = "Enter your email and we'll send a code to find your previous chats.";
+			card.appendChild(desc);
+			const row = document.createElement("div");
+			row.className = "int-row";
+			const input = document.createElement("input");
+			input.className = "int-input";
+			input.type = "email";
+			input.autocomplete = "email";
+			input.placeholder = "you@example.com";
+			const go = () => {
+				const email = input.value.trim();
+				if (email) this.controller?.requestIdentityOtp(email, "email");
+			};
+			input.addEventListener("keydown", (ev) => {
+				if (ev.key === "Enter") {
+					ev.preventDefault();
+					go();
+				}
+			});
+			const send = document.createElement("button");
+			send.className = "int-btn primary";
+			send.type = "button";
+			send.textContent = "Send code";
+			send.addEventListener("click", go);
+			row.append(input, send);
+			card.appendChild(row);
+			if (state.error) {
+				const err = document.createElement("div");
+				err.className = "int-error";
+				err.textContent = state.error;
+				card.appendChild(err);
+			}
+			queueMicrotask(() => input.focus());
+		} else if (state.phase === "requesting" || state.phase === "verifying" || state.phase === "resolving") {
+			const msg = document.createElement("div");
+			msg.className = "int-sent";
+			msg.textContent = state.phase === "requesting" ? "Sending a code…" : state.phase === "verifying" ? "Verifying…" : "Finding your chats…";
+			card.appendChild(msg);
+		} else if (state.phase === "awaiting_code") {
+			if (state.maskedDestination) {
+				const sent = document.createElement("div");
+				sent.className = "int-sent";
+				sent.textContent = `Code sent to ${state.maskedDestination}.`;
+				card.appendChild(sent);
+			}
+			const row = document.createElement("div");
+			row.className = "int-row";
+			const input = document.createElement("input");
+			input.className = "int-input";
+			input.type = "text";
+			input.inputMode = "numeric";
+			input.autocomplete = "one-time-code";
+			input.placeholder = "Enter code";
+			const submit = () => {
+				const code = input.value.trim();
+				if (code) this.controller?.verifyIdentityOtp(code);
+			};
+			input.addEventListener("keydown", (ev) => {
+				if (ev.key === "Enter") {
+					ev.preventDefault();
+					submit();
+				}
+			});
+			const verify = document.createElement("button");
+			verify.className = "int-btn primary";
+			verify.type = "button";
+			verify.textContent = "Verify";
+			verify.addEventListener("click", submit);
+			row.append(input, verify);
+			card.appendChild(row);
+			if (state.error) {
+				const err = document.createElement("div");
+				err.className = "int-error";
+				err.textContent = state.attemptsRemaining != null ? `${state.error} (${state.attemptsRemaining} left)` : state.error;
+				card.appendChild(err);
+			}
+			queueMicrotask(() => input.focus());
+		} else if (state.phase === "resolved") if (state.conversations.length === 0) {
+			const none = document.createElement("div");
+			none.className = "int-desc";
+			none.textContent = "No previous chats found for that email.";
+			card.appendChild(none);
+		} else {
+			const pick = document.createElement("div");
+			pick.className = "int-desc";
+			pick.textContent = "Pick a conversation to continue:";
+			card.appendChild(pick);
+			const list = document.createElement("div");
+			list.className = "restore-list";
+			for (const conv of state.conversations) {
+				const btn = document.createElement("button");
+				btn.type = "button";
+				btn.className = "restore-item";
+				const preview = document.createElement("span");
+				preview.className = "restore-preview";
+				preview.textContent = conv.preview || "Conversation";
+				btn.appendChild(preview);
+				if (conv.lastActivityAt) {
+					const when = document.createElement("span");
+					when.className = "restore-when";
+					when.textContent = this.formatWhen(conv.lastActivityAt);
+					btn.appendChild(when);
+				}
+				btn.addEventListener("click", () => {
+					this.controller?.restoreConversation(conv.sessionId);
+				});
+				list.appendChild(btn);
+			}
+			card.appendChild(list);
+		}
+		else if (state.phase === "error") {
+			const err = document.createElement("div");
+			err.className = "int-error";
+			err.textContent = state.message;
+			card.appendChild(err);
+		}
+		return card;
+	}
+	/** Format an ISO timestamp as a short, locale-aware label (best-effort). */
+	formatWhen(iso) {
+		const d = new Date(iso);
+		if (Number.isNaN(d.getTime())) return "";
+		try {
+			return d.toLocaleDateString(void 0, {
+				month: "short",
+				day: "numeric"
+			});
+		} catch {
+			return "";
+		}
+	}
+	/**
+	* Wire as-you-type formatting + an inline validity hint onto the pre-chat
+	* phone input (libphonenumber-js, US default region). Autofill is preserved:
+	* the input keeps its `type="tel"` + `autocomplete="tel"` + implicit <label>,
+	* and we also reformat on `change` so a browser-autofilled value gets
+	* formatted/validated too.
+	*
+	* As-you-type caret note: `AsYouType` reformats the entire string, which
+	* moves the caret to the end on a mid-string edit. To avoid fighting the
+	* user, we only rewrite the value when the caret is at the end (the typical
+	* append-a-digit case) and never on a deletion — so backspacing the
+	* formatting characters works naturally.
+	*/
+	wirePhoneField(form) {
+		const input = form?.querySelector("input[name=\"phone\"]");
+		if (!input) return;
+		const hint = input.parentElement?.querySelector(".pc-hint");
+		const updateHint = () => {
+			const v = input.value.trim();
+			const field = input.closest(".pc-field");
+			if (!v) {
+				field?.classList.remove("valid", "invalid");
+				if (hint) hint.textContent = "";
+				return;
+			}
+			const ok = isValidPhoneNumber(v, PHONE_DEFAULT_REGION);
+			field?.classList.toggle("valid", ok);
+			field?.classList.toggle("invalid", !ok);
+			if (hint) hint.textContent = ok ? "" : "Enter a valid phone number";
+		};
+		const reformat = () => {
+			if (input.selectionStart === input.value.length && input.selectionEnd === input.value.length) {
+				const formatted = new AsYouType(PHONE_DEFAULT_REGION).input(input.value);
+				if (formatted.length >= input.value.length) input.value = formatted;
+			}
+			updateHint();
+		};
+		input.addEventListener("input", (ev) => {
+			const ie = ev;
+			if (typeof ie.inputType === "string" && ie.inputType.startsWith("delete")) {
+				updateHint();
+				return;
+			}
+			reformat();
+		});
+		input.addEventListener("change", reformat);
+	}
+	/** Collect identity + consent from the pre-chat form, then drop into the chat view. */
 	handlePrechatSubmit(form) {
 		if (!form.reportValidity()) return;
 		const data = new FormData(form);
 		const val = (k) => data.get(k)?.trim() || void 0;
+		const checked = (k) => data.get(k) === "on";
+		const rawPhone = val("phone");
+		const phoneInput = form.querySelector("input[name=\"phone\"]");
+		if (rawPhone && phoneInput && !isValidPhoneNumber(rawPhone, PHONE_DEFAULT_REGION)) {
+			const required = phoneInput.hasAttribute("required");
+			const field = phoneInput.closest(".pc-field");
+			field?.classList.add("invalid");
+			const hint = field?.querySelector(".pc-hint");
+			if (hint) hint.textContent = "Enter a valid phone number";
+			if (required) {
+				phoneInput.focus();
+				return;
+			}
+		}
+		const phone = rawPhone ? phoneToE164(rawPhone) ?? rawPhone : void 0;
 		this.controller?.setUserInfo({
 			name: val("name"),
 			email: val("email"),
-			phone: val("phone")
+			phone,
+			consent: {
+				emailOptIn: checked("emailOptIn"),
+				smsOptIn: checked("smsOptIn")
+			}
 		});
 		this.userInfoSatisfied = true;
 		this.render();
@@ -2053,6 +3146,6 @@ function initChatWidgetLoader() {
 	else window.addEventListener("load", schedule, { once: true });
 }
 //#endregion
-export { ConversationController, ELEMENT_TAG, SmoothAgentChatElement, defineChatWidget, initChatWidgetLoader, mountChatWidget, mountFullPageChat };
+export { ConversationController, ELEMENT_TAG, PERSIST_VERSION, SmoothAgentChatElement, computeFingerprint, createWidgetStore, defineChatWidget, getOrCreateFingerprint, httpBaseFromWsEndpoint, initChatWidgetLoader, mountChatWidget, mountFullPageChat, storageKey };
 
 //# sourceMappingURL=index.js.map