@locdo.tech/botiq-chat-sdk 0.2.0 → 0.3.0

package/dist/sdk/index.js

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

package/dist/sdk/{npm-Bo1fPZM3.js → npm-6G46H82M.js}

@@ -1,5 +1,5 @@
 //#region src/core/config.ts
-var e = "http://localhost:3001", t = {
+var e = "https://bot-q-backend.vercel.app", t = {
 	name: "BotIQ",
 	design: {
 		colors: {
@@ -26,7 +26,12 @@ var e = "http://localhost:3001", t = {
 }, n = /^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/, r = new Set(["bottom-right", "bottom-left"]), i = new Set(["circle", "square"]), a = new Set([
 	"inter",
 	"plus-jakarta",
-	"poppins"
+	"poppins",
+	"nunito",
+	"dm-sans",
+	"raleway",
+	"lato",
+	"playfair"
 ]);
 function o(e) {
 	let t = e.colors;
@@ -149,6 +154,26 @@ var S = {
 	poppins: {
 		url: "https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap",
 		family: "'Poppins', system-ui, -apple-system, sans-serif"
+	},
+	nunito: {
+		url: "https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600&display=swap",
+		family: "'Nunito', system-ui, -apple-system, sans-serif"
+	},
+	"dm-sans": {
+		url: "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&display=swap",
+		family: "'DM Sans', system-ui, -apple-system, sans-serif"
+	},
+	raleway: {
+		url: "https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600&display=swap",
+		family: "'Raleway', system-ui, -apple-system, sans-serif"
+	},
+	lato: {
+		url: "https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap",
+		family: "'Lato', system-ui, -apple-system, sans-serif"
+	},
+	playfair: {
+		url: "https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600&display=swap",
+		family: "'Playfair Display', Georgia, serif"
 	}
 };
 function C(e) {
@@ -250,6 +275,7 @@ function C(e) {
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
+  overflow: hidden;
 }
 
 .avatar svg { width: 20px; height: 20px; fill: #fff; }
@@ -471,9 +497,12 @@ function C(e) {
 //#region src/core/ui.ts
 var w = "https://bot-q-frontend.vercel.app/", T = "<svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n  <path d=\"M20 2H4a2 2 0 00-2 2v18l4-4h14a2 2 0 002-2V4a2 2 0 00-2-2z\"/>\n</svg>", E = "<svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n  <path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"/>\n</svg>", D = "<svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n  <path d=\"M12 2a2 2 0 012 2c0 .74-.4 1.38-1 1.72V7h3a3 3 0 013 3v8a3 3 0 01-3 3H8a3 3 0 01-3-3v-8a3 3 0 013-3h3V5.72A2 2 0 0110 4a2 2 0 012-2zm-2 9a1.5 1.5 0 100 3 1.5 1.5 0 000-3zm4 0a1.5 1.5 0 100 3 1.5 1.5 0 000-3z\"/>\n</svg>", O = "<svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n  <path d=\"M2.01 21L23 12 2.01 3 2 10l15 2-15 2z\"/>\n</svg>", k = "<svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\">\n  <path d=\"M20 2H4a2 2 0 00-2 2v18l4-4h14a2 2 0 002-2V4a2 2 0 00-2-2zm-2 10H6v-2h12v2zm0-3H6V7h12v2z\"/>\n</svg>";
 function A(e) {
+	return !e || e.type === "icon" ? D : e.type === "emoji" ? `<span style="font-size:22px;line-height:1;display:flex;align-items:center;justify-content:center;width:100%;height:100%">${j(e.value)}</span>` : e.type === "initials" ? `<div style="width:100%;height:100%;border-radius:50%;background:${e.bgColor ?? "#F97316"};display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff">${j(e.value.slice(0, 2).toUpperCase())}</div>` : e.type === "image" ? `<img src="${j(e.value)}" style="width:100%;height:100%;object-fit:cover;border-radius:50%" alt="" />` : D;
+}
+function j(e) {
 	return e.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#x27;");
 }
-function j(e, t, n, r) {
+function M(e, t, n, r) {
 	let { name: i, design: a } = t, o, s, c, l, u, d, { content: f } = a;
 	function p(e) {
 		e.setAttribute("data-position", a.layout.position), o = e.attachShadow({ mode: "open" });
@@ -483,9 +512,9 @@ function j(e, t, n, r) {
       <span class="icon-close">${E}</span>
     `, s.addEventListener("click", r), o.appendChild(s), c = document.createElement("div"), c.className = "chat-window", c.setAttribute("role", "dialog"), c.setAttribute("aria-label", `${i} chat`), c.innerHTML = `
       <div class="chat-header">
-        <div class="avatar">${D}</div>
+        <div class="avatar">${A(a.avatar)}</div>
         <div class="header-text">
-          <span class="bot-name">${A(i)}</span>
+          <span class="bot-name">${j(i)}</span>
           <span class="bot-status">Trực tuyến</span>
         </div>
         <button class="close-btn" aria-label="Close chat">×</button>
@@ -495,7 +524,7 @@ function j(e, t, n, r) {
         <div class="input-row">
           <textarea
             class="input"
-            placeholder="${A(f.placeholder)}"
+            placeholder="${j(f.placeholder)}"
             rows="1"
             maxlength="2000"
             aria-label="Message input"
@@ -520,11 +549,11 @@ function j(e, t, n, r) {
 	}
 	function h(e) {
 		if (e.messages.length === 0 && !e.isLoading) {
-			let e = f.suggestionChips.length > 0 ? `<div class="chips">${f.suggestionChips.map((e) => `<button class="chip">${A(e)}</button>`).join("")}</div>` : "";
+			let e = f.suggestionChips.length > 0 ? `<div class="chips">${f.suggestionChips.map((e) => `<button class="chip">${j(e)}</button>`).join("")}</div>` : "";
 			l.innerHTML = `
         <div class="empty-state">
           ${k}
-          <span class="greeting">${A(f.greeting)}</span>
+          <span class="greeting">${j(f.greeting)}</span>
           ${e}
         </div>
       `, l.querySelectorAll(".chip").forEach((e) => {
@@ -534,7 +563,7 @@ function j(e, t, n, r) {
 		}
 		let t = e.messages.map((e) => `
         <div class="message ${e.role}">
-          <div class="message-bubble">${A(e.content)}</div>
+          <div class="message-bubble">${j(e.content)}</div>
         </div>
       `).join(""), r = e.isLoading ? "<div class=\"typing\"><span></span><span></span><span></span></div>" : "";
 		l.innerHTML = t + r, l.scrollTop = l.scrollHeight;
@@ -549,7 +578,7 @@ function j(e, t, n, r) {
 }
 //#endregion
 //#region src/builds/npm/index.ts
-function M(e) {
+function N(e) {
 	if (!e.apiKey) return console.warn("[BotIQ] apiKey is required"), () => void 0;
 	let t = c(e), n = f();
 	b({ messages: p(n) });
@@ -558,7 +587,7 @@ function M(e) {
 	let i = () => void 0, a = !1;
 	s(t.apiKey, t.apiUrl).then((e) => {
 		if (a) return;
-		let n = j(t, e, o, l);
+		let n = M(t, e, o, l);
 		n.mount(r), i = x((e) => n.update(e)), n.update(y());
 	});
 	function o(e) {
@@ -592,4 +621,4 @@ function M(e) {
 	};
 }
 //#endregion
-export { M as t };
+export { N as t };

package/dist/sdk/react.js

@@ -1,4 +1,4 @@
-import { t as e } from "./npm-Bo1fPZM3.js";
+import { t as e } from "./npm-6G46H82M.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-Bo1fPZM3.js";
+import { t as e } from "./npm-6G46H82M.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.2.0",
+  "version": "0.3.0",
   "description": "BotIQ chat widget SDK — embed AI chatbot into any website with vanilla JS, React, or Vue.",
   "keywords": [
     "botiq",