@locdo.tech/botiq-chat-sdk 0.3.1 → 0.3.3

package/dist/sdk/index.js

@@ -1,2 +1,2 @@
-import { t as e } from "./npm-D7UnWA_n.js";
+import { t as e } from "./npm-DfSKhYCq.js";
 export { e as init };

package/dist/sdk/{npm-D7UnWA_n.js → npm-DfSKhYCq.js}

@@ -65,8 +65,10 @@ async function l(e, n) {
 	try {
 		let r = await fetch(`${n}/widget/meta`, {
 			headers: { "X-Api-Key": e },
+			referrerPolicy: "no-referrer-when-downgrade",
 			signal: AbortSignal.timeout(5e3)
 		});
+		if (r.status === 401 || r.status === 403) return null;
 		if (!r.ok) return t;
 		let i = await r.json();
 		if (!i?.design?.colors || !i?.design?.layout || !i?.design?.content || !c(i.design)) return t;
@@ -121,6 +123,7 @@ async function _(e, t, n, r, i, a) {
 				"Content-Type": "application/json",
 				"X-Api-Key": t
 			},
+			referrerPolicy: "no-referrer-when-downgrade",
 			body: JSON.stringify({
 				sessionId: n,
 				message: r,
@@ -354,21 +357,60 @@ function D(e) {
 
 .message { display: flex; flex-direction: column; max-width: 82%; }
 .message.user { align-self: flex-end; align-items: flex-end; }
-.message.assistant { align-self: flex-start; align-items: flex-start; }
+.message.assistant { align-self: flex-start; align-items: flex-start; max-width: 92%; }
 
 .message-bubble {
   padding: 10px 14px;
   border-radius: var(--radius-msg);
   font-size: 14px;
   line-height: 1.5;
-  white-space: pre-wrap;
+  white-space: normal;
   word-break: break-word;
+  overflow-x: auto;
+}
+
+/* ── Markdown inline elements ───────────────────────── */
+.message-bubble strong { font-weight: 600; }
+.message-bubble em { font-style: italic; }
+.message-bubble a { color: var(--color-primary); text-decoration: underline; word-break: break-all; }
+.message-bubble code {
+  font-family: monospace;
+  font-size: 12px;
+  padding: 1px 5px;
+  border-radius: 4px;
+  background: rgba(255,255,255,.1);
+  white-space: pre-wrap;
+}
+
+/* ── Markdown tables ─────────────────────────────────── */
+.message-bubble table {
+  border-collapse: collapse;
+  min-width: 100%;
+  font-size: 12.5px;
+  display: block;
+  overflow-x: auto;
+  margin: 4px 0;
+}
+.message-bubble th,
+.message-bubble td {
+  border: 1px solid rgba(255,255,255,.15);
+  padding: 5px 10px;
+  text-align: left;
 }
+.message-bubble th { background: rgba(255,255,255,.08); font-weight: 600; white-space: nowrap; }
+.message-bubble td { white-space: normal; }
+.message-bubble tr:nth-child(even) td { background: rgba(255,255,255,.04); }
+
+/* ── Markdown lists ──────────────────────────────────── */
+.message-bubble ul,
+.message-bubble ol { padding-left: 18px; margin: 2px 0; }
+.message-bubble li { margin: 2px 0; }
 
 .message.user .message-bubble {
   background: ${h};
   color: #fff;
   border-bottom-right-radius: 4px;
+  white-space: pre-wrap;
 }
 
 .message.assistant .message-bubble {
@@ -538,13 +580,51 @@ function F(e) {
 	return e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#x27;");
 }
 function I(e) {
-	let t = F(e).replace(/\x00/g, ""), n = [];
-	return t = t.replace(/`([^`]+)`/g, (e, t) => (n.push(`<code>${t}</code>`), `\x00CODE${n.length - 1}\x00`)), t = t.replace(/\*\*\*(.+?)\*\*\*/g, "<strong><em>$1</em></strong>"), t = t.replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>"), t = t.replace(/(?<!\*)\*(?!\*)(.+?)(?<!\*)\*(?!\*)/g, "<em>$1</em>"), t = t.replace(/\[([^\]]+)\]\((https?:\/\/[^)]+)\)/g, "<a href=\"$2\" target=\"_blank\" rel=\"noopener noreferrer\">$1</a>"), t = t.replace(/\[([^\]]+)\]\([^)]+\)/g, "$1"), t = t.replace(/\n/g, "<br>"), t = t.replace(/\x00CODE(\d+)\x00/g, (e, t) => n[Number(t)]), t;
+	let t = [];
+	return e = e.replace(/`([^`]+)`/g, (e, n) => (t.push(`<code>${n}</code>`), `\x00CODE${t.length - 1}\x00`)), e = e.replace(/\*\*\*(.+?)\*\*\*/g, "<strong><em>$1</em></strong>"), e = e.replace(/\*\*(.+?)\*\*/g, "<strong>$1</strong>"), e = e.replace(/(?<!\*)\*(?!\*)(.+?)(?<!\*)\*(?!\*)/g, "<em>$1</em>"), e = e.replace(/\[([^\]]+)\]\(([^()]*(?:\([^()]*\))*[^()]*)\)/g, (e, t, n) => /^https?:\/\//.test(n) ? `<a href="${n}" target="_blank" rel="noopener noreferrer">${t}</a>` : t), e = e.replace(/\x00CODE(\d+)\x00/g, (e, n) => t[Number(n)]), e;
+}
+function L(e) {
+	return /^\|[\s\-:|]+\|$/.test(e);
+}
+function R(e) {
+	return e.replace(/^\|/, "").replace(/\|$/, "").split("|").map((e) => e.trim());
+}
+function z(e) {
+	let t = F(e).replace(/\x00/g, "").split("\n"), n = [], r = 0;
+	for (; r < t.length;) {
+		let e = t[r].trim();
+		if (e.startsWith("|") && e.endsWith("|")) {
+			let e = [];
+			for (; r < t.length && t[r].trim().startsWith("|") && t[r].trim().endsWith("|");) e.push(t[r].trim()), r++;
+			let i = e.findIndex(L), a = i > 0 ? e.slice(0, i) : [], o = i >= 0 ? e.slice(i + 1) : e, s = "<table>";
+			a.length > 0 && (s += "<thead>" + a.map((e) => "<tr>" + R(e).map((e) => `<th>${I(e)}</th>`).join("") + "</tr>").join("") + "</thead>"), o.length > 0 && (s += "<tbody>" + o.map((e) => "<tr>" + R(e).map((e) => `<td>${I(e)}</td>`).join("") + "</tr>").join("") + "</tbody>"), s += "</table>", n.push(s);
+			continue;
+		}
+		if (/^[-*]\s/.test(e)) {
+			let e = [];
+			for (; r < t.length && /^\s*[-*]\s/.test(t[r]);) e.push(t[r].trim().replace(/^[-*]\s+/, "")), r++;
+			n.push("<ul>" + e.map((e) => `<li>${I(e)}</li>`).join("") + "</ul>");
+			continue;
+		}
+		if (/^\d+\.\s/.test(e)) {
+			let e = [];
+			for (; r < t.length && /^\s*\d+\.\s/.test(t[r]);) e.push(t[r].trim().replace(/^\d+\.\s+/, "")), r++;
+			n.push("<ol>" + e.map((e) => `<li>${I(e)}</li>`).join("") + "</ol>");
+			continue;
+		}
+		if (e === "") {
+			n.push("<br>"), r++;
+			continue;
+		}
+		n.push(I(e)), n.push("<br>"), r++;
+	}
+	for (; n.length > 0 && n[n.length - 1] === "<br>";) n.pop();
+	return n.join("");
 }
-function L(e, t, n, r, i) {
+function B(e, t, n, r, i) {
 	let { name: a, design: o } = t, s, c, l, u, d, f, { content: p } = o;
 	function m(e) {
-		e.setAttribute("data-position", o.layout.position), s = e.attachShadow({ mode: "open" });
+		e.setAttribute("data-position", o.layout.position), s = e.attachShadow({ mode: "closed" });
 		let t = document.createElement("style");
 		t.textContent = D(o), s.appendChild(t), c = document.createElement("button"), c.className = "bubble", c.setAttribute("aria-label", n.ariaOpenChat), c.innerHTML = `
       <span class="icon-chat">${k}</span>
@@ -558,7 +638,7 @@ function L(e, t, n, r, i) {
         </div>
         <button class="close-btn" aria-label="${F(n.ariaCloseChat)}">×</button>
       </div>
-      <div class="messages" id="messages-container"></div>
+      <div class="messages" id="messages-container" role="log" aria-live="polite" aria-atomic="false"></div>
       <div class="chat-footer">
         <div class="input-row">
           <textarea
@@ -602,7 +682,7 @@ function L(e, t, n, r, i) {
 		}
 		let t = e.messages.map((e) => `
         <div class="message ${e.role}">
-          <div class="message-bubble">${e.role === "assistant" ? I(e.content) : F(e.content)}</div>
+          <div class="message-bubble">${e.role === "assistant" ? z(e.content) : F(e.content)}</div>
         </div>
       `).join(""), i = e.isLoading ? "<div class=\"typing\"><span></span><span></span><span></span></div>" : "";
 		u.innerHTML = t + i, u.scrollTop = u.scrollHeight;
@@ -617,7 +697,7 @@ function L(e, t, n, r, i) {
 }
 //#endregion
 //#region src/i18n/vi.ts
-var R = {
+var V = {
 	statusOnline: "Trực tuyến",
 	inputPlaceholder: "Nhắn tin...",
 	defaultGreeting: "Xin chào! Tôi có thể giúp gì cho bạn?",
@@ -633,7 +713,7 @@ var R = {
 	ariaOpenChat: "Mở khung chat",
 	ariaCloseChat: "Đóng khung chat",
 	ariaSendMessage: "Gửi tin nhắn"
-}, z = {
+}, H = {
 	statusOnline: "Online",
 	inputPlaceholder: "Type a message...",
 	defaultGreeting: "Hello! How can I help you?",
@@ -652,22 +732,26 @@ var R = {
 };
 //#endregion
 //#region src/i18n/index.ts
-function B(e) {
-	return e === "en" ? z : R;
+function U(e) {
+	return e === "en" ? H : V;
 }
 //#endregion
 //#region src/builds/npm/index.ts
-function V(e) {
+function W(e) {
 	if (!e.apiKey) return console.warn("[BotIQ] apiKey is required"), () => void 0;
 	let t = u(e), n = m();
 	x({ messages: h(n) });
 	let r = document.createElement("div");
 	document.body.appendChild(r);
-	let i = () => void 0, a = !1, o = B(void 0);
+	let i = () => void 0, a = !1, o = U(void 0);
 	l(t.apiKey, t.apiUrl).then((e) => {
 		if (a) return;
-		o = B(e.widgetLanguage);
-		let n = L(t, e, o, s, c);
+		if (e === null) {
+			console.warn("[BotIQ] Widget not authorised on this origin — skipped mount"), r.remove();
+			return;
+		}
+		o = U(e.widgetLanguage);
+		let n = B(t, e, o, s, c);
 		n.mount(r), i = S((e) => n.update(e)), n.update(b());
 	});
 	function s(e) {
@@ -701,4 +785,4 @@ function V(e) {
 	};
 }
 //#endregion
-export { V as t };
+export { W as t };

package/dist/sdk/react.js

@@ -1,4 +1,4 @@
-import { t as e } from "./npm-D7UnWA_n.js";
+import { t as e } from "./npm-DfSKhYCq.js";
 import { useEffect as t } from "react";
 //#region src/builds/npm/react.tsx
 function n(n) {

package/dist/sdk/vue.js

@@ -1,4 +1,4 @@
-import { t as e } from "./npm-D7UnWA_n.js";
+import { t as e } from "./npm-DfSKhYCq.js";
 import { defineComponent as t, onMounted as n, onUnmounted as r } from "vue";
 //#region src/builds/npm/vue.ts
 var i = t({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@locdo.tech/botiq-chat-sdk",
-  "version": "0.3.1",
+  "version": "0.3.3",
   "description": "BotIQ chat widget SDK — embed AI chatbot into any website with vanilla JS, React, or Vue.",
   "keywords": [
     "botiq",
@@ -69,15 +69,32 @@
     "preview": "vite preview",
     "test": "vitest run",
     "test:watch": "vitest",
-    "prepublishOnly": "npm run build:sdk"
+    "test:bundle": "npm run build:cdn && vitest run test/bundle",
+    "test:browser": "playwright test",
+    "test:browser:ui": "playwright test --ui",
+    "test:browser:chromium": "playwright test --project=chromium",
+    "pretest:browser": "npm run build:cdn && cpx \"test/browser/fixtures/**\" dist/test-fixtures",
+    "pretest:browser:chromium": "npm run pretest:browser",
+    "test:wordpress": "playwright test --config=playwright.wordpress.config.ts",
+    "pretest:wordpress": "npm run build:cdn",
+    "test:wordpress:up": "docker compose -f test/wordpress/docker-compose.wp.yml up -d",
+    "test:wordpress:down": "docker compose -f test/wordpress/docker-compose.wp.yml down -v",
+    "test:wordpress:logs": "docker compose -f test/wordpress/docker-compose.wp.yml logs --tail=100",
+    "prepublishOnly": "npm run build:sdk",
+    "rollback:cdn": "bash scripts/rollback/cdn-rollback.sh"
   },
   "devDependencies": {
+    "@playwright/test": "^1.60.0",
+    "@types/node": "^25.9.1",
     "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
     "@vitest/coverage-v8": "^4.1.6",
+    "cpx2": "^9.0.0",
+    "gzip-size": "^7.0.0",
     "jsdom": "^29.1.1",
     "react": "^19.2.6",
     "react-dom": "^19.2.6",
+    "serve": "^14.2.6",
     "typescript": "~6.0.2",
     "vite": "^8.0.12",
     "vite-plugin-dts": "^5.0.0",