@clivly/chat-widget 0.3.0-next.6

package/dist/index.cjs

@@ -0,0 +1,718 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+let react_dom_client = require("react-dom/client");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+//#region src/chat-widget.tsx
+const WIDGET_STYLES = `
+.clivly-chat-widget, .clivly-chat-widget * { box-sizing: border-box; }
+.clivly-chat-widget {
+  --clivly-chat-accent: #185adb;
+  --clivly-chat-panel: #ffffff;
+  --clivly-chat-border: #d6dde8;
+  --clivly-chat-text: #132238;
+  --clivly-chat-muted: #60738a;
+  --clivly-chat-visitor: #ecf3ff;
+  --clivly-chat-operator: #f5f7fa;
+  color: var(--clivly-chat-text);
+  font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  position: relative;
+}
+.clivly-chat-widget button,
+.clivly-chat-widget input,
+.clivly-chat-widget textarea {
+  font: inherit;
+}
+.clivly-chat-widget__launcher {
+  align-items: center;
+  background: var(--clivly-chat-accent);
+  border: 0;
+  border-radius: 999px;
+  color: white;
+  cursor: pointer;
+  display: inline-flex;
+  gap: 0.5rem;
+  padding: 0.85rem 1.1rem;
+}
+.clivly-chat-widget__panel {
+  background: var(--clivly-chat-panel);
+  border: 1px solid var(--clivly-chat-border);
+  border-radius: 1rem;
+  box-shadow: 0 24px 80px rgba(19, 34, 56, 0.18);
+  display: grid;
+  grid-template-rows: auto 1fr auto;
+  height: min(44rem, 75vh);
+  overflow: hidden;
+  position: absolute;
+  right: 0;
+  bottom: 4.5rem;
+  width: min(24rem, calc(100vw - 2rem));
+}
+.clivly-chat-widget__header {
+  border-bottom: 1px solid var(--clivly-chat-border);
+  display: flex;
+  justify-content: space-between;
+  gap: 1rem;
+  padding: 1rem;
+}
+.clivly-chat-widget__title {
+  font-size: 1rem;
+  font-weight: 600;
+  margin: 0;
+}
+.clivly-chat-widget__subtitle {
+  color: var(--clivly-chat-muted);
+  font-size: 0.875rem;
+  margin: 0.25rem 0 0;
+}
+.clivly-chat-widget__close {
+  background: transparent;
+  border: 0;
+  color: var(--clivly-chat-muted);
+  cursor: pointer;
+  padding: 0;
+}
+.clivly-chat-widget__body {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+  overflow-y: auto;
+  padding: 1rem;
+}
+.clivly-chat-widget__message {
+  border-radius: 1rem;
+  max-width: 85%;
+  padding: 0.8rem 0.9rem;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+.clivly-chat-widget__message[data-sender="visitor"] {
+  align-self: flex-end;
+  background: var(--clivly-chat-visitor);
+}
+.clivly-chat-widget__message[data-sender="operator"],
+.clivly-chat-widget__message[data-sender="system"] {
+  align-self: flex-start;
+  background: var(--clivly-chat-operator);
+}
+.clivly-chat-widget__message-meta {
+  color: var(--clivly-chat-muted);
+  display: flex;
+  font-size: 0.75rem;
+  gap: 0.5rem;
+  margin-bottom: 0.35rem;
+}
+.clivly-chat-widget__status {
+  color: var(--clivly-chat-muted);
+  font-size: 0.75rem;
+  margin-top: 0.35rem;
+}
+.clivly-chat-widget__composer,
+.clivly-chat-widget__form {
+  border-top: 1px solid var(--clivly-chat-border);
+  display: grid;
+  gap: 0.75rem;
+  padding: 1rem;
+}
+.clivly-chat-widget__field {
+  display: grid;
+  gap: 0.35rem;
+}
+.clivly-chat-widget__label {
+  font-size: 0.875rem;
+  font-weight: 600;
+}
+.clivly-chat-widget__input,
+.clivly-chat-widget__textarea {
+  border: 1px solid var(--clivly-chat-border);
+  border-radius: 0.8rem;
+  min-width: 0;
+  padding: 0.75rem 0.85rem;
+}
+.clivly-chat-widget__textarea {
+  min-height: 5.5rem;
+  resize: vertical;
+}
+.clivly-chat-widget__actions {
+  display: flex;
+  gap: 0.75rem;
+  justify-content: space-between;
+}
+.clivly-chat-widget__button {
+  background: var(--clivly-chat-accent);
+  border: 0;
+  border-radius: 0.8rem;
+  color: white;
+  cursor: pointer;
+  padding: 0.75rem 0.95rem;
+}
+.clivly-chat-widget__button[disabled] {
+  cursor: not-allowed;
+  opacity: 0.55;
+}
+.clivly-chat-widget__error {
+  background: #fff1f1;
+  border: 1px solid #f2c2c2;
+  border-radius: 0.8rem;
+  color: #9f2d2d;
+  font-size: 0.875rem;
+  padding: 0.75rem;
+}
+.clivly-chat-widget__empty {
+  color: var(--clivly-chat-muted);
+  font-size: 0.875rem;
+  margin: auto 0;
+  text-align: center;
+}
+`;
+const DEFAULT_STORAGE = typeof window !== "undefined" ? window.localStorage : void 0;
+function createLocalMessage(message, delivery = "sent") {
+	return {
+		...message,
+		delivery
+	};
+}
+function createStorageKey(widgetId) {
+	return `clivly-chat-widget:${widgetId}:visitor-token`;
+}
+function formatTimestamp(value) {
+	const date = new Date(value);
+	if (Number.isNaN(date.getTime())) return "";
+	return new Intl.DateTimeFormat(void 0, {
+		hour: "numeric",
+		minute: "2-digit",
+		month: "short",
+		day: "numeric"
+	}).format(date);
+}
+function generateId() {
+	if (typeof crypto !== "undefined" && "randomUUID" in crypto) return crypto.randomUUID();
+	return `msg_${Math.random().toString(36).slice(2, 10)}`;
+}
+function mergeMessage(messages, nextMessage) {
+	const existingIndex = messages.findIndex((message) => message.id === nextMessage.id);
+	if (existingIndex === -1) return [...messages, createLocalMessage(nextMessage)];
+	const copy = [...messages];
+	copy[existingIndex] = createLocalMessage(nextMessage);
+	return copy;
+}
+function replacePendingMessage(messages, clientMessageId, nextMessage) {
+	return messages.map((message) => message.id === clientMessageId ? createLocalMessage(nextMessage) : message);
+}
+function markMessageFailed(messages, clientMessageId) {
+	return messages.map((message) => message.id === clientMessageId ? {
+		...message,
+		delivery: "failed"
+	} : message);
+}
+function sortMessages(messages) {
+	return [...messages].sort((left, right) => left.createdAt.localeCompare(right.createdAt));
+}
+function useThemeStyle(session) {
+	return (0, react.useMemo)(() => {
+		const brandColor = session?.widget.config.brandColor ?? null;
+		if (!brandColor) return;
+		return { ["--clivly-chat-accent"]: brandColor };
+	}, [session?.widget.config.brandColor]);
+}
+function ChatWidget({ className, createTransport, getSession, initiallyOpen = false, launcherLabel = "Chat with us", storage = DEFAULT_STORAGE, widgetId }) {
+	const [isOpen, setIsOpen] = (0, react.useState)(initiallyOpen);
+	const [error, setError] = (0, react.useState)(null);
+	const [isConnecting, setIsConnecting] = (0, react.useState)(false);
+	const [isReady, setIsReady] = (0, react.useState)(false);
+	const [messageDraft, setMessageDraft] = (0, react.useState)("");
+	const [messages, setMessages] = (0, react.useState)([]);
+	const [session, setSession] = (0, react.useState)(null);
+	const [visitor, setVisitor] = (0, react.useState)({
+		email: "",
+		name: ""
+	});
+	const transportRef = (0, react.useRef)(null);
+	const listRef = (0, react.useRef)(null);
+	const themeStyle = useThemeStyle(session);
+	(0, react.useEffect)(() => {
+		return () => {
+			transportRef.current?.close();
+			transportRef.current = null;
+		};
+	}, []);
+	(0, react.useEffect)(() => {
+		if (!listRef.current) return;
+		listRef.current.scrollTop = listRef.current.scrollHeight;
+	}, [messages]);
+	(0, react.useEffect)(() => {
+		transportRef.current?.close();
+		transportRef.current = null;
+		setIsReady(false);
+		if (!session || !createTransport) return;
+		const handleEvent = (event) => {
+			switch (event.type) {
+				case "conversation.snapshot":
+					setMessages(sortMessages(event.messages.map((message) => createLocalMessage(message))));
+					return;
+				case "error":
+					setError(event.message);
+					return;
+				case "message.ack":
+					setMessages((currentMessages) => sortMessages(replacePendingMessage(currentMessages, event.clientMessageId, event.message)));
+					return;
+				case "message.created": {
+					const clientMessageId = event.clientMessageId;
+					if (clientMessageId) {
+						setMessages((currentMessages) => sortMessages(replacePendingMessage(currentMessages, clientMessageId, event.message)));
+						return;
+					}
+					setMessages((currentMessages) => sortMessages(mergeMessage(currentMessages, event.message)));
+					return;
+				}
+				case "session.ready":
+					setIsReady(true);
+					return;
+			}
+		};
+		const connection = createTransport({
+			handlers: {
+				onClose: () => {
+					setIsReady(false);
+				},
+				onError: (transportError) => {
+					setError(transportError.message);
+				},
+				onEvent: handleEvent,
+				onOpen: () => {
+					setIsReady(true);
+				}
+			},
+			session
+		});
+		transportRef.current = connection;
+		return () => {
+			connection.close();
+			if (transportRef.current === connection) transportRef.current = null;
+		};
+	}, [createTransport, session]);
+	const submitVisitor = async (event) => {
+		event.preventDefault();
+		setError(null);
+		setIsConnecting(true);
+		try {
+			const nextSession = await getSession({
+				visitor,
+				visitorToken: storage?.getItem(createStorageKey(widgetId)) ?? null,
+				widgetId
+			});
+			storage?.setItem(createStorageKey(widgetId), nextSession.visitorToken);
+			setSession(nextSession);
+			setMessages(sortMessages(nextSession.messages.map((message) => createLocalMessage(message))));
+		} catch (sessionError) {
+			setError((sessionError instanceof Error ? sessionError : /* @__PURE__ */ new Error("Failed to start the conversation.")).message);
+		} finally {
+			setIsConnecting(false);
+		}
+	};
+	const submitMessage = (event) => {
+		event.preventDefault();
+		if (!session || !transportRef.current) {
+			setError("Chat is not connected yet.");
+			return;
+		}
+		const body = messageDraft.trim();
+		if (!body) return;
+		const clientMessageId = generateId();
+		const optimisticMessage = {
+			author: session.contact.name,
+			body,
+			createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+			id: clientMessageId,
+			senderType: "visitor"
+		};
+		setMessages((currentMessages) => sortMessages([...currentMessages, createLocalMessage(optimisticMessage, "pending")]));
+		setMessageDraft("");
+		setError(null);
+		try {
+			transportRef.current.sendMessage({
+				body,
+				id: clientMessageId,
+				type: "message.create"
+			});
+		} catch (transportError) {
+			const resolved = transportError instanceof Error ? transportError : /* @__PURE__ */ new Error("Failed to send your message.");
+			setMessages((currentMessages) => markMessageFailed(currentMessages, clientMessageId));
+			setError(resolved.message);
+		}
+	};
+	const greeting = session?.widget.config.greeting ?? "Tell us a little about yourself and we’ll pick up the conversation from there.";
+	const panelTitle = session?.widget.name ?? "Start a conversation";
+	const sessionSummary = session ? `${session.contact.name} • ${session.contact.email}` : greeting;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: `clivly-chat-widget ${className ?? ""}`.trim(),
+		style: themeStyle,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("style", { children: WIDGET_STYLES }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				className: "clivly-chat-widget__launcher",
+				onClick: () => {
+					setIsOpen((open) => !open);
+				},
+				type: "button",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: launcherLabel })
+			}),
+			isOpen ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("section", {
+				"aria-label": panelTitle,
+				className: "clivly-chat-widget__panel",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("header", {
+						className: "clivly-chat-widget__header",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h2", {
+							className: "clivly-chat-widget__title",
+							children: panelTitle
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+							className: "clivly-chat-widget__subtitle",
+							children: sessionSummary
+						})] }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+							"aria-label": "Close chat",
+							className: "clivly-chat-widget__close",
+							onClick: () => {
+								setIsOpen(false);
+							},
+							type: "button",
+							children: "Close"
+						})]
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "clivly-chat-widget__body",
+						ref: listRef,
+						children: [error ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+							className: "clivly-chat-widget__error",
+							children: error
+						}) : null, session ? messages.length > 0 ? messages.map((message) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("article", {
+							className: "clivly-chat-widget__message",
+							"data-sender": message.senderType,
+							children: [
+								/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+									className: "clivly-chat-widget__message-meta",
+									children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: message.author ?? "Clivly" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: formatTimestamp(message.createdAt) })]
+								}),
+								/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: message.body }),
+								message.delivery !== "sent" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: "clivly-chat-widget__status",
+									children: message.delivery === "pending" ? "Sending…" : "Failed to send"
+								}) : null
+							]
+						}, message.id)) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+							className: "clivly-chat-widget__empty",
+							children: "No messages yet. Say hello to get the conversation started."
+						}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+							className: "clivly-chat-widget__empty",
+							children: greeting
+						})]
+					}),
+					session ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("form", {
+						className: "clivly-chat-widget__composer",
+						onSubmit: submitMessage,
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+							className: "clivly-chat-widget__field",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: "clivly-chat-widget__label",
+								children: "Message"
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("textarea", {
+								className: "clivly-chat-widget__textarea",
+								onChange: (event) => {
+									setMessageDraft(event.target.value);
+								},
+								placeholder: "Write your message",
+								value: messageDraft
+							})]
+						}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+							className: "clivly-chat-widget__actions",
+							children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+								className: "clivly-chat-widget__subtitle",
+								children: isReady || !createTransport ? "Conversation ready" : "Connecting…"
+							}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+								className: "clivly-chat-widget__button",
+								disabled: !messageDraft.trim() || !isReady,
+								type: "submit",
+								children: "Send"
+							})]
+						})]
+					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("form", {
+						className: "clivly-chat-widget__form",
+						onSubmit: submitVisitor,
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+								className: "clivly-chat-widget__field",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "clivly-chat-widget__label",
+									children: "Name"
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+									autoComplete: "name",
+									className: "clivly-chat-widget__input",
+									onChange: (event) => {
+										setVisitor((currentVisitor) => ({
+											...currentVisitor,
+											name: event.target.value
+										}));
+									},
+									required: true,
+									value: visitor.name
+								})]
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("label", {
+								className: "clivly-chat-widget__field",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "clivly-chat-widget__label",
+									children: "Email"
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("input", {
+									autoComplete: "email",
+									className: "clivly-chat-widget__input",
+									onChange: (event) => {
+										setVisitor((currentVisitor) => ({
+											...currentVisitor,
+											email: event.target.value
+										}));
+									},
+									required: true,
+									type: "email",
+									value: visitor.email
+								})]
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+								className: "clivly-chat-widget__actions",
+								children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+									className: "clivly-chat-widget__subtitle",
+									children: "We use this to start the conversation."
+								}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+									className: "clivly-chat-widget__button",
+									disabled: isConnecting || !visitor.name.trim() || !visitor.email.trim(),
+									type: "submit",
+									children: isConnecting ? "Starting…" : "Start chat"
+								})]
+							})
+						]
+					})
+				]
+			}) : null
+		]
+	});
+}
+function ChatLauncher() {
+	return null;
+}
+function ChatPanel() {
+	return null;
+}
+function MessageComposer() {
+	return null;
+}
+function PreChatForm() {
+	return null;
+}
+function ConversationView() {
+	return null;
+}
+//#endregion
+//#region src/transport.ts
+function isServerEvent(value) {
+	if (typeof value !== "object" || value === null) return false;
+	return typeof value.type === "string";
+}
+function createWebSocketTransport({ createSocket = (url, protocols) => new WebSocket(url, protocols), getProtocols, resolveUrl }) {
+	return ({ handlers, session }) => {
+		const socket = createSocket(resolveUrl(session), getProtocols?.(session));
+		socket.addEventListener("open", () => {
+			handlers.onOpen?.();
+		});
+		socket.addEventListener("close", () => {
+			handlers.onClose();
+		});
+		socket.addEventListener("error", () => {
+			handlers.onError(/* @__PURE__ */ new Error("Chat socket error."));
+		});
+		socket.addEventListener("message", (event) => {
+			try {
+				const payload = JSON.parse(String(event.data));
+				if (!isServerEvent(payload)) throw new Error("Chat socket event had an invalid shape.");
+				handlers.onEvent(payload);
+			} catch (error) {
+				const resolved = error instanceof Error ? error : /* @__PURE__ */ new Error("Chat socket event could not be parsed.");
+				handlers.onError(resolved);
+			}
+		});
+		return {
+			close: () => {
+				socket.close();
+			},
+			sendMessage: (message) => {
+				if (socket.readyState !== WebSocket.OPEN) throw new Error("Chat socket is not connected.");
+				socket.send(JSON.stringify(message));
+			}
+		};
+	};
+}
+function createLoopbackTransport({ operatorName = "Clivly", operatorReply = (body) => `Thanks for your message: ${body}`, replyDelayMs = 30 } = {}) {
+	return ({ handlers, session }) => {
+		let closed = false;
+		const timers = /* @__PURE__ */ new Set();
+		const schedule = (callback, delayMs) => {
+			const timer = window.setTimeout(() => {
+				timers.delete(timer);
+				if (!closed) callback();
+			}, delayMs);
+			timers.add(timer);
+		};
+		schedule(() => {
+			handlers.onOpen?.();
+			handlers.onEvent({
+				type: "session.ready",
+				conversationId: session.conversation.id
+			});
+		}, 0);
+		return {
+			close: () => {
+				closed = true;
+				for (const timer of timers) window.clearTimeout(timer);
+				timers.clear();
+			},
+			sendMessage: (message) => {
+				const createdAt = (/* @__PURE__ */ new Date()).toISOString();
+				schedule(() => {
+					handlers.onEvent({
+						type: "message.ack",
+						clientMessageId: message.id,
+						message: {
+							author: session.contact.name,
+							body: message.body,
+							createdAt,
+							id: `${message.id}:server`,
+							senderType: "visitor"
+						}
+					});
+				}, 10);
+				const reply = operatorReply(message.body);
+				if (!reply) return;
+				schedule(() => {
+					handlers.onEvent({
+						type: "message.created",
+						message: {
+							author: operatorName,
+							body: reply,
+							createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+							id: `${message.id}:reply`,
+							senderType: "operator"
+						}
+					});
+				}, replyDelayMs);
+			}
+		};
+	};
+}
+//#endregion
+//#region src/clivly-transport.ts
+/**
+* The transport a host app should use against a real Clivly backend.
+*
+* The URL comes from the bootstrap response rather than host configuration, so
+* no host page hardcodes Clivly's hostname and a misconfigured template cannot
+* produce a silently dead socket.
+*/
+function createClivlyTransport$1(options = {}) {
+	return createWebSocketTransport({
+		...options,
+		resolveUrl: (session) => {
+			if (!session.socketUrl) throw new Error("Chat session response is missing socketUrl. The Clivly server is older than this widget.");
+			return session.socketUrl;
+		}
+	});
+}
+//#endregion
+//#region src/session.ts
+function isWidgetSessionPayload(value) {
+	return typeof value === "object" && value !== null;
+}
+function createSessionFetcher({ fetchImpl = fetch, sessionUrl }) {
+	return async ({ visitor, visitorToken, widgetId }) => {
+		const response = await fetchImpl(sessionUrl, {
+			method: "POST",
+			headers: { "Content-Type": "application/json" },
+			body: JSON.stringify({
+				visitor,
+				visitorToken,
+				widgetId
+			})
+		});
+		if (!response.ok) throw new Error(`Chat session request failed with ${response.status}.`);
+		const data = await response.json();
+		if (!isWidgetSessionPayload(data)) throw new Error("Chat session response was not an object.");
+		if ("session" in data) return data.session;
+		return data;
+	};
+}
+//#endregion
+//#region src/browser-mount.tsx
+const MOUNTED_DATA_ATTR = "clivlyMounted";
+function resolveSocketUrl(socketUrlTemplate, conversationId, token) {
+	return socketUrlTemplate.replaceAll("{conversationId}", encodeURIComponent(conversationId)).replaceAll("{token}", encodeURIComponent(token));
+}
+function mountChatWidget$1({ container, createTransport, sessionUrl, socketUrlTemplate, widgetId, ...props }) {
+	const transport = createTransport ?? (socketUrlTemplate ? createWebSocketTransport({ resolveUrl: (session) => session.socketUrl ?? resolveSocketUrl(socketUrlTemplate, session.conversation.id, session.token) }) : createClivlyTransport$1());
+	const root = (0, react_dom_client.createRoot)(container);
+	root.render(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ChatWidget, {
+		...props,
+		createTransport: transport,
+		getSession: createSessionFetcher({ sessionUrl }),
+		widgetId
+	}));
+	return root;
+}
+function markScriptMounted(script) {
+	script.dataset[MOUNTED_DATA_ATTR] = "true";
+}
+function scriptAlreadyMounted(script) {
+	return script.dataset[MOUNTED_DATA_ATTR] === "true";
+}
+function mountChatWidgetScript$1(script = document.currentScript) {
+	if (scriptAlreadyMounted(script)) throw new Error("Widget script has already been mounted.");
+	const widgetId = script.dataset.widgetId;
+	const sessionUrl = script.dataset.sessionUrl;
+	if (!widgetId) throw new Error("Widget script is missing data-widget-id.");
+	if (!sessionUrl) throw new Error("Widget script is missing data-session-url.");
+	const host = document.createElement("div");
+	script.insertAdjacentElement("afterend", host);
+	const shadowRoot = host.attachShadow({ mode: "open" });
+	const container = document.createElement("div");
+	shadowRoot.append(container);
+	const root = mountChatWidget$1({
+		container,
+		sessionUrl,
+		socketUrlTemplate: script.dataset.socketUrlTemplate,
+		widgetId
+	});
+	markScriptMounted(script);
+	return {
+		root,
+		shadowRoot
+	};
+}
+function autoMountChatWidgetScript$1(script = document.currentScript) {
+	if (!script || scriptAlreadyMounted(script)) return null;
+	return mountChatWidgetScript$1(script);
+}
+//#endregion
+//#region src/index.ts
+const autoMountChatWidgetScript = autoMountChatWidgetScript$1;
+const createClivlyTransport = createClivlyTransport$1;
+const mountChatWidget = mountChatWidget$1;
+const mountChatWidgetScript = mountChatWidgetScript$1;
+//#endregion
+exports.ChatLauncher = ChatLauncher;
+exports.ChatPanel = ChatPanel;
+exports.ChatWidget = ChatWidget;
+exports.ConversationView = ConversationView;
+exports.MessageComposer = MessageComposer;
+exports.PreChatForm = PreChatForm;
+exports.autoMountChatWidgetScript = autoMountChatWidgetScript;
+exports.createClivlyTransport = createClivlyTransport;
+exports.createLoopbackTransport = createLoopbackTransport;
+exports.createSessionFetcher = createSessionFetcher;
+exports.createWebSocketTransport = createWebSocketTransport;
+exports.mountChatWidget = mountChatWidget;
+exports.mountChatWidgetScript = mountChatWidgetScript;