@useago/sdk 0.3.2 → 0.3.4

package/dist/widget.js

@@ -0,0 +1,398 @@
+import { t as X } from "./AgoClient-DF7M2WAz.js";
+import { t as Z } from "./createFormCollector-ClzHfaBd.js";
+var G = '"IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif';
+function m(l, o) {
+  Object.assign(l.style, o);
+}
+function c(l = {}) {
+  const o = document.createElement("div");
+  return m(o, l), o;
+}
+var P = "ago-chat-widget-keyframes";
+function ee() {
+  if (typeof document > "u" || document.getElementById(P)) return;
+  const l = document.createElement("style");
+  l.id = P, l.textContent = "@keyframes ago-pulse { 0%, 80%, 100% { opacity: 0.3; transform: scale(0.8); } 40% { opacity: 1; transform: scale(1); } }", document.head.appendChild(l);
+}
+function te(l) {
+  const o = typeof l == "string" ? document.querySelector(l) : l;
+  if (!o) throw new Error(`mountChatWidget: target "${String(l)}" not found.`);
+  return o;
+}
+function ae(l, o) {
+  const { title: w = "Chat", welcomeMessage: I = "Hello! How can I help you today?", placeholder: R = "Type a message...", allowFiles: u = !1, height: x = 500, logoUrl: f, showAgentName: b = !1, forms: _, onFollowUpClick: k, onMessageSent: D, onMessageReceived: s } = o;
+  if (!o.client && !o.config?.baseUrl) throw new Error("mountChatWidget requires either `client` or `config` (with a baseUrl).");
+  const i = o.client ?? new X(o.config), z = te(l);
+  let g = o.conversationId, n = [], y = !1, v = null;
+  const N = c({
+    display: "flex",
+    flexDirection: "column",
+    height: typeof x == "number" ? `${x}px` : x,
+    border: "1px solid #dee3e8",
+    borderRadius: "16px",
+    overflow: "hidden",
+    backgroundColor: "#fff",
+    fontFamily: G,
+    boxShadow: "rgba(15, 15, 15, 0.08) 0px 2px 16px 0px"
+  });
+  N.className = "ago-chat-widget";
+  const W = c({
+    padding: "14px 16px",
+    borderBottom: "1px solid #dee3e8",
+    backgroundColor: "#03182f",
+    color: "#e8f0fe",
+    display: "flex",
+    alignItems: "center",
+    gap: "10px"
+  });
+  if (W.className = "ago-chat-widget__header", f) {
+    const e = document.createElement("img");
+    e.src = f, e.alt = "Logo", m(e, {
+      height: "24px",
+      width: "auto"
+    }), W.appendChild(e);
+  }
+  const F = document.createElement("h3");
+  F.textContent = w, m(F, {
+    margin: "0",
+    fontSize: "15px",
+    fontWeight: "600"
+  }), W.appendChild(F);
+  const E = c({
+    flex: "1",
+    overflow: "auto",
+    padding: "16px",
+    backgroundColor: "#fbfbfb"
+  });
+  E.className = "ago-chat-widget__messages";
+  const { inputRow: K, setDisabled: j, focus: q } = ne({
+    placeholder: R,
+    allowFiles: u,
+    onSend: (e, t) => {
+      L(e, t);
+    }
+  });
+  ee(), N.append(W, E, K), z.appendChild(N);
+  const U = k !== !1, A = k === !1 ? void 0 : k ?? ((e) => {
+    L(e);
+  });
+  function V(e) {
+    const t = e.role === "user", d = c({
+      display: "flex",
+      flexDirection: "column",
+      alignItems: t ? "flex-end" : "flex-start",
+      marginBottom: "16px"
+    });
+    if (d.className = `ago-message ago-message--${e.role}`, !t && b && e.agent) {
+      const a = c({
+        fontSize: "13px",
+        fontWeight: "500",
+        color: "#30373e",
+        marginBottom: "6px",
+        padding: "0 4px"
+      });
+      a.className = "ago-message__agent", a.textContent = e.agent.displayName || e.agent.name, d.appendChild(a);
+    }
+    if (!t && e.sources && e.sources.length > 0) {
+      const a = c({
+        display: "grid",
+        gridTemplateColumns: "1fr 1fr",
+        gap: "6px",
+        marginBottom: "10px",
+        width: "100%",
+        maxWidth: "85%"
+      });
+      a.className = "ago-message__sources", e.sources.forEach((p, r) => {
+        const C = p.url ? document.createElement("a") : document.createElement("div");
+        p.url && C instanceof HTMLAnchorElement && (C.href = p.url, C.target = "_blank", C.rel = "noopener noreferrer"), m(C, {
+          display: "flex",
+          alignItems: "center",
+          gap: "8px",
+          padding: "8px 10px",
+          border: "1px solid #dee3e8",
+          borderRadius: "8px",
+          backgroundColor: "#fff",
+          textDecoration: "none",
+          color: "#30373e",
+          fontSize: "12px",
+          overflow: "hidden"
+        });
+        const $ = c({
+          flexShrink: "0",
+          width: "18px",
+          height: "18px",
+          borderRadius: "3px",
+          border: "1px solid #1b5fc4",
+          color: "#1b5fc4",
+          fontSize: "11px",
+          fontWeight: "500",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          backgroundColor: "#f0f4ff"
+        });
+        $.textContent = String(r + 1);
+        const M = c({
+          overflow: "hidden",
+          textOverflow: "ellipsis",
+          whiteSpace: "nowrap"
+        });
+        M.textContent = p.title, M.title = p.title, C.append($, M), a.appendChild(C);
+      }), d.appendChild(a);
+    }
+    const h = c({
+      maxWidth: t ? "75%" : "100%",
+      padding: t ? "10px 14px" : "2px 8px",
+      borderRadius: t ? "16px" : "0",
+      backgroundColor: t ? "#03182f" : "transparent",
+      color: t ? "#fff" : "#30373e",
+      wordBreak: "break-word",
+      fontSize: "14px",
+      lineHeight: "1.6",
+      whiteSpace: "pre-wrap"
+    });
+    if (h.className = "ago-message__content", e.content ? h.textContent = e.content : e.status === "IN_PROGRESS" && h.appendChild(Q()), d.appendChild(h), e.followUpReplies && e.followUpReplies.length > 0) {
+      const a = c({
+        display: "flex",
+        flexWrap: "wrap",
+        gap: "8px",
+        marginTop: "10px"
+      });
+      a.className = "ago-message__followups";
+      for (const p of e.followUpReplies) {
+        const r = document.createElement("button");
+        r.type = "button", r.className = "ago-message__followup-btn", r.textContent = p, r.disabled = !U, m(r, {
+          padding: "6px 14px",
+          fontSize: "13px",
+          borderRadius: "16px",
+          border: "1px solid #dee3e8",
+          backgroundColor: "#fff",
+          color: "#30373e",
+          cursor: U ? "pointer" : "default",
+          transition: "border-color 0.15s"
+        }), A && r.addEventListener("click", () => A(p)), r.addEventListener("mouseenter", () => {
+          r.style.borderColor = "#1b5fc4";
+        }), r.addEventListener("mouseleave", () => {
+          r.style.borderColor = "#dee3e8";
+        }), a.appendChild(r);
+      }
+      d.appendChild(a);
+    }
+    return d;
+  }
+  function S() {
+    if (E.replaceChildren(), n.length === 0) {
+      const e = c({
+        textAlign: "center",
+        color: "#6b6d6f",
+        padding: "24px 16px",
+        fontSize: "14px",
+        lineHeight: "1.5"
+      });
+      e.textContent = I, E.appendChild(e);
+    } else for (const e of n) E.appendChild(V(e));
+    if (v) {
+      const e = c({
+        padding: "10px 14px",
+        backgroundColor: "#fef2f2",
+        color: "#dc2626",
+        borderRadius: "12px",
+        marginTop: "8px",
+        fontSize: "13px",
+        border: "1px solid #fecaca"
+      });
+      e.textContent = v, E.appendChild(e);
+    }
+    E.scrollTop = E.scrollHeight, j(y);
+  }
+  function Y() {
+    for (let e = n.length - 1; e >= 0; e--) {
+      const t = n[e];
+      if (t.role === "assistant" && t.status === "IN_PROGRESS") return t;
+    }
+  }
+  const B = (e) => {
+    g || (g = e.conversationId);
+  }, H = (e) => {
+    const t = Y();
+    t && (t.content += e.content, S());
+  }, O = (e) => {
+    const t = n.findIndex((d) => d.id === e.id || d.role === "assistant" && d.status === "IN_PROGRESS");
+    t >= 0 ? n[t] = e : n.push(e), y = !1, S(), e.status === "DONE" && s?.({
+      id: e.id,
+      content: e.content
+    });
+  }, T = (e) => {
+    v = e.error, y = !1, n = n.filter((t) => !t.id.startsWith("temp-")), S();
+  };
+  i.on("message:start", B), i.on("message:chunk", H), i.on("message:complete", O), i.on("message:error", T);
+  const J = (_ ?? []).map((e) => Z(e).install(i));
+  async function L(e, t) {
+    const d = e.trim();
+    if (!d && !t?.length || y) return;
+    D?.(d), y = !0, v = null;
+    const h = Date.now();
+    n.push({
+      id: `temp-user-${h}`,
+      conversationId: g || "",
+      content: d,
+      role: "user",
+      status: "DONE",
+      createdAt: /* @__PURE__ */ new Date()
+    }), n.push({
+      id: `temp-assistant-${h}`,
+      conversationId: g || "",
+      content: "",
+      role: "assistant",
+      status: "IN_PROGRESS",
+      createdAt: /* @__PURE__ */ new Date()
+    }), S();
+    try {
+      const a = await i.sendMessage(d, {
+        conversationId: g,
+        files: t
+      });
+      a.conversationId && !g && (g = a.conversationId);
+      const p = n.find((r) => r.id === `temp-user-${h}`);
+      if (p && (p.id = `user-${h}`, p.conversationId = a.conversationId), !n.some((r) => r.id === a.id)) {
+        const r = n.findIndex((C) => C.id === `temp-assistant-${h}`);
+        r >= 0 ? n[r] = a : n.push(a);
+      }
+      n = n.filter((r) => !r.id.startsWith("temp-")), y = !1, S();
+    } catch (a) {
+      v = a instanceof Error ? a.message : "Failed to send message", y = !1, n = n.filter((p) => !p.id.startsWith("temp-")), S();
+    }
+  }
+  return S(), q(), {
+    client: i,
+    element: N,
+    sendMessage: L,
+    destroy() {
+      i.off("message:start", B), i.off("message:chunk", H), i.off("message:complete", O), i.off("message:error", T), J.forEach((e) => e()), N.remove(), o.client || i.destroy();
+    }
+  };
+  function Q() {
+    const e = c({
+      display: "flex",
+      gap: "4px",
+      padding: "4px 0"
+    });
+    for (let t = 0; t < 3; t++) {
+      const d = c({
+        width: "6px",
+        height: "6px",
+        borderRadius: "50%",
+        backgroundColor: "#b5bfc8",
+        animation: "ago-pulse 1.2s ease-in-out infinite",
+        animationDelay: `${t * 0.2}s`
+      });
+      e.appendChild(d);
+    }
+    return e;
+  }
+}
+function ne(l) {
+  let o = [];
+  const w = document.createElement("form");
+  m(w, {
+    display: "flex",
+    flexDirection: "column",
+    gap: "8px",
+    padding: "12px",
+    borderTop: "1px solid #dee3e8",
+    backgroundColor: "#fff"
+  }), w.className = "ago-chat-input";
+  const I = c({
+    display: "flex",
+    flexWrap: "wrap",
+    gap: "6px"
+  }), R = c({
+    display: "flex",
+    gap: "8px",
+    alignItems: "flex-end"
+  }), u = document.createElement("textarea");
+  u.placeholder = l.placeholder, u.rows = 1, m(u, {
+    flex: "1",
+    resize: "none",
+    padding: "10px 12px",
+    border: "1px solid #dee3e8",
+    borderRadius: "12px",
+    fontSize: "14px",
+    fontFamily: G,
+    lineHeight: "1.4",
+    maxHeight: "120px",
+    outline: "none"
+  });
+  const x = document.createElement("button");
+  x.type = "submit", x.textContent = "Send", m(x, {
+    padding: "10px 16px",
+    border: "none",
+    borderRadius: "12px",
+    backgroundColor: "#03182f",
+    color: "#fff",
+    fontSize: "14px",
+    fontWeight: "500",
+    cursor: "pointer"
+  });
+  let f = null, b = null;
+  l.allowFiles && (f = document.createElement("input"), f.type = "file", f.multiple = !0, m(f, { display: "none" }), b = document.createElement("button"), b.type = "button", b.textContent = "📎", m(b, {
+    padding: "10px 12px",
+    border: "1px solid #dee3e8",
+    borderRadius: "12px",
+    backgroundColor: "#fff",
+    cursor: "pointer",
+    fontSize: "14px"
+  }), b.addEventListener("click", () => f?.click()), f.addEventListener("change", () => {
+    o = [...o, ...Array.from(f?.files ?? [])], _();
+  }));
+  function _() {
+    I.replaceChildren(), o.forEach((s, i) => {
+      const z = c({
+        display: "flex",
+        alignItems: "center",
+        gap: "4px",
+        padding: "4px 8px",
+        backgroundColor: "#f0f4ff",
+        border: "1px solid #dee3e8",
+        borderRadius: "8px",
+        fontSize: "12px"
+      }), g = document.createElement("span");
+      g.textContent = s.name;
+      const n = document.createElement("button");
+      n.type = "button", n.textContent = "×", m(n, {
+        border: "none",
+        background: "transparent",
+        cursor: "pointer",
+        fontSize: "14px",
+        lineHeight: "1"
+      }), n.addEventListener("click", () => {
+        o = o.filter((y, v) => v !== i), _();
+      }), z.append(g, n), I.appendChild(z);
+    });
+  }
+  const k = () => {
+    const s = u.value, i = o;
+    return u.value = "", o = [], _(), {
+      content: s,
+      files: i
+    };
+  }, D = () => {
+    const { content: s, files: i } = k();
+    (s.trim() || i.length > 0) && l.onSend(s.trim(), i.length > 0 ? i : void 0);
+  };
+  return w.addEventListener("submit", (s) => {
+    s.preventDefault(), D();
+  }), u.addEventListener("keydown", (s) => {
+    s.key === "Enter" && !s.shiftKey && (s.preventDefault(), D());
+  }), b && R.appendChild(b), R.append(u, x), f && w.appendChild(f), w.append(I, R), {
+    inputRow: w,
+    getValueAndClear: k,
+    setDisabled: (s) => {
+      u.disabled = s, x.disabled = s, x.style.opacity = s ? "0.6" : "1", x.style.cursor = s ? "not-allowed" : "pointer";
+    },
+    focus: () => u.focus()
+  };
+}
+export {
+  ae as mountChatWidget
+};

package/package.json

@@ -1,57 +1,66 @@
 {
   "name": "@useago/sdk",
-  "version": "0.3.2",
+  "version": "0.3.4",
   "description": "JavaScript SDK for AGO Chat integration",
   "type": "module",
+  "sideEffects": false,
   "main": "dist/index.cjs",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
   "exports": {
     ".": {
-      "import": "./dist/index.js",
-      "require": "./dist/index.cjs",
-      "types": "./dist/index.d.ts"
+      "import": { "types": "./dist/index.d.ts", "default": "./dist/index.js" },
+      "require": { "types": "./dist/index.d.cts", "default": "./dist/index.cjs" }
     },
     "./react": {
-      "import": "./dist/react.js",
-      "require": "./dist/react.cjs",
-      "types": "./dist/react.d.ts"
+      "import": { "types": "./dist/react.d.ts", "default": "./dist/react.js" },
+      "require": { "types": "./dist/react.d.cts", "default": "./dist/react.cjs" }
     },
     "./vue": {
-      "import": "./dist/vue.js",
-      "require": "./dist/vue.cjs",
-      "types": "./dist/vue.d.ts"
+      "import": { "types": "./dist/vue.d.ts", "default": "./dist/vue.js" },
+      "require": { "types": "./dist/vue.d.cts", "default": "./dist/vue.cjs" }
     },
     "./angular": {
-      "import": "./dist/angular.js",
-      "require": "./dist/angular.cjs",
-      "types": "./dist/angular.d.ts"
+      "import": { "types": "./dist/angular.d.ts", "default": "./dist/angular.js" },
+      "require": { "types": "./dist/angular.d.cts", "default": "./dist/angular.cjs" }
     },
     "./helpers": {
-      "import": "./dist/helpers.js",
-      "require": "./dist/helpers.cjs",
-      "types": "./dist/helpers.d.ts"
+      "import": { "types": "./dist/helpers.d.ts", "default": "./dist/helpers.js" },
+      "require": { "types": "./dist/helpers.d.cts", "default": "./dist/helpers.cjs" }
     },
     "./widget": {
-      "import": "./dist/widget.js",
-      "require": "./dist/widget.cjs",
-      "types": "./dist/widget.d.ts"
+      "import": { "types": "./dist/widget.d.ts", "default": "./dist/widget.js" },
+      "require": { "types": "./dist/widget.d.cts", "default": "./dist/widget.cjs" }
     },
     "./devtools": {
-      "import": "./dist/devtools.js",
-      "require": "./dist/devtools.cjs",
-      "types": "./dist/devtools.d.ts"
+      "import": { "types": "./dist/devtools.d.ts", "default": "./dist/devtools.js" },
+      "require": { "types": "./dist/devtools.d.cts", "default": "./dist/devtools.cjs" }
     }
   },
   "publishConfig": {
     "access": "public"
   },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/useago/ago-chat.git",
+    "directory": "sdk"
+  },
+  "bugs": {
+    "url": "https://github.com/useago/ago-chat/issues"
+  },
+  "engines": {
+    "node": ">=18"
+  },
   "files": [
     "dist",
     "README.md"
   ],
   "scripts": {
-    "build": "vite build && tsc --emitDeclarationOnly",
+    "clean": "rm -rf dist",
+    "build": "npm run clean && vite build && npm run build:cts-types",
+    "build:cts-types": "for f in $(find dist -name '*.d.ts'); do cp \"$f\" \"${f%.d.ts}.d.cts\"; done",
+    "prepublishOnly": "npm run lint && npm run typecheck && npm test && npm run build && npm run check:package",
+    "check:package": "publint --strict && attw --pack . --profile node16",
     "dev": "vite build --watch",
     "test": "vitest run",
     "test:watch": "vitest",
@@ -79,6 +88,7 @@
     }
   },
   "devDependencies": {
+    "@arethetypeswrong/cli": "^0.18.0",
     "@types/node": "^20.0.0",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
@@ -87,6 +97,7 @@
     "eslint": "^8.0.0",
     "eslint-plugin-react-hooks": "^4.6.2",
     "jsdom": "^28.0.0",
+    "publint": "^0.3.0",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
     "typescript": "^5.0.0",
@@ -102,6 +113,6 @@
     "ai",
     "chatbot"
   ],
-  "license": "MIT",
+  "license": "UNLICENSED",
   "homepage": "https://docs.useago.com"
 }