@pluno/product-agent-web 0.1.35 → 0.1.36

package/dist/product-agent-widget.js

@@ -265,7 +265,7 @@ function st(e, t, n) {
 async function yn(e) {
   return await (await fetch(e)).blob();
 }
-const Cn = "https://app.pluno.ai", En = "/api/product-agent/embed/active-users", Sn = 1800, kn = 15e3, Ln = 250, Pn = 1e3, An = 3e4;
+const Cn = "https://app.pluno.ai", En = "/api/product-agent/embed/active-users", kn = 1800, Sn = 15e3, Ln = 250, Pn = 1e3, An = 3e4;
 function Tn(e, t = {}) {
   let n = !1, o = null, a = null, i = null;
   const l = () => {
@@ -285,8 +285,8 @@ function Tn(e, t = {}) {
         l();
         return;
       }
-      const k = Math.min(1, (performance.now() - C) / Sn);
-      o = Math.round(f + (s - f) * Mn(k)), e(o), k >= 1 && (o = s, e(s), l());
+      const S = Math.min(1, (performance.now() - C) / kn);
+      o = Math.round(f + (s - f) * Mn(S)), e(o), S >= 1 && (o = s, e(s), l());
     }, Ln);
   }, d = async () => {
     try {
@@ -295,7 +295,7 @@ function Tn(e, t = {}) {
         return;
       c(s.count), p(s.refreshAfterMs);
     } catch {
-      p(kn);
+      p(Sn);
     }
   };
   return d(), () => {
@@ -399,13 +399,13 @@ async function lo(e = {}) {
     fontFamily: t.fontFamily,
     cssAccent: a.style.getPropertyValue("--pluno-pa-accent")
   });
-  const c = a.querySelector(".pluno-pa-widget__launcher"), d = a.querySelector(".pluno-pa-widget__launcher-drag-handle"), s = a.querySelector(".pluno-pa-widget__launcher-input"), f = a.querySelector(".pluno-pa-widget__panel"), C = a.querySelector(".pluno-pa-widget__close"), k = a.querySelector(".pluno-pa-widget__composer"), x = a.querySelector(".pluno-pa-widget__attachment-error"), R = a.querySelector(".pluno-pa-widget__billing-status"), v = a.querySelector(".pluno-pa-widget__attachments"), y = a.querySelector(".pluno-pa-widget__attachment-input"), h = a.querySelector(".pluno-pa-widget__attach"), g = a.querySelector(".pluno-pa-widget__input"), _ = a.querySelector(".pluno-pa-widget__send"), N = a.querySelector(".pluno-pa-widget__new-chat"), Z = a.querySelector(".pluno-pa-widget__timeline-jump"), de = a.querySelector(".pluno-pa-widget__active-users-counter"), E = a.querySelector(".pluno-pa-widget__timeline"), b = a.querySelector(".pluno-pa-widget__timeline-bottom-sentinel");
-  if (!c || !s || !f || !C || !k || !x || !R || !v || !y || !h || !g || !_ || !N || !Z || !de || !E || !b)
+  const c = a.querySelector(".pluno-pa-widget__launcher"), d = a.querySelector(".pluno-pa-widget__launcher-drag-handle"), s = a.querySelector(".pluno-pa-widget__launcher-input"), f = a.querySelector(".pluno-pa-widget__panel"), C = a.querySelector(".pluno-pa-widget__close"), S = a.querySelector(".pluno-pa-widget__composer"), x = a.querySelector(".pluno-pa-widget__attachment-error"), R = a.querySelector(".pluno-pa-widget__billing-status"), v = a.querySelector(".pluno-pa-widget__attachments"), y = a.querySelector(".pluno-pa-widget__attachment-input"), h = a.querySelector(".pluno-pa-widget__attach"), g = a.querySelector(".pluno-pa-widget__input"), _ = a.querySelector(".pluno-pa-widget__send"), N = a.querySelector(".pluno-pa-widget__new-chat"), Z = a.querySelector(".pluno-pa-widget__timeline-jump"), de = a.querySelector(".pluno-pa-widget__active-users-counter"), E = a.querySelector(".pluno-pa-widget__timeline"), b = a.querySelector(".pluno-pa-widget__timeline-bottom-sentinel");
+  if (!c || !s || !f || !C || !S || !x || !R || !v || !y || !h || !g || !_ || !N || !Z || !de || !E || !b)
     throw new Error("Failed to mount Pluno widget");
   if (t.movableLauncher && !d)
     throw new Error("Failed to mount Pluno widget drag handle");
   _t(s), _t(g);
-  let m = [], S = null;
+  let m = [], k = null;
   const P = () => {
     Oo(v, m, (r) => {
       m = m.filter((u, T) => T !== r), P(), O(w.getState()), U();
@@ -443,7 +443,7 @@ async function lo(e = {}) {
     autoConnect: t.loginRequired ? !1 : void 0
   });
   const J = ha(t), Ee = new Set(J.openToolGroupKeys), ae = new Set(J.seenShareCandidateIds), fe = new Set(ae);
-  let Se = J.sharePromptsDisabled || await ma(t), G = t.movableLauncher ? J.launcherPosition : null, qe = G !== null, q = null, ke = !1, Q = !1, ee = {
+  let ke = J.sharePromptsDisabled || await ma(t), G = t.movableLauncher ? J.launcherPosition : null, qe = G !== null, q = null, Se = !1, Q = !1, ee = {
     enabled: !0
   }, te = 0, Ke = "";
   const H = (r, u) => {
@@ -455,7 +455,7 @@ async function lo(e = {}) {
   }, tn = (r = "jump") => {
     H(!0, r), W(), he(E, () => ee.enabled), te = E.scrollTop;
   }, nn = () => {
-    ke || typeof document > "u" || (Lt(o, t.accentColor), n.isConnected || p.body?.appendChild(n));
+    Se || typeof document > "u" || (Lt(o, t.accentColor), n.isConnected || p.body?.appendChild(n));
   }, Ye = new MutationObserver(nn);
   Ye.observe(p.documentElement, { childList: !0, subtree: !0 });
   const Le = (r = !0) => {
@@ -472,7 +472,7 @@ async function lo(e = {}) {
       openToolGroupKeys: [...Ee],
       launcherPosition: qe ? G : null,
       seenShareCandidateIds: [...ae].slice(-Mt),
-      sharePromptsDisabled: Se
+      sharePromptsDisabled: ke
     });
   }, ne = (r, u = {}) => {
     _o(r, {
@@ -585,7 +585,7 @@ async function lo(e = {}) {
   const U = () => {
     _.disabled = $(t.billingStatus) || !w.getState().isThinking && g.value.trim().length === 0 && m.length === 0, h.disabled = t.loginRequired || $(t.billingStatus);
   };
-  t.loginRequired && (s.readOnly = !0, s.placeholder = t.loginButtonLabel, g.placeholder = t.loginButtonLabel, k.hidden = !0), k.addEventListener("submit", (r) => {
+  t.loginRequired && (s.readOnly = !0, s.placeholder = t.loginButtonLabel, g.placeholder = t.loginButtonLabel, S.hidden = !0), S.addEventListener("submit", (r) => {
     if (r.preventDefault(), t.loginRequired) {
       t.onLoginClick?.();
       return;
@@ -596,11 +596,11 @@ async function lo(e = {}) {
   const an = () => {
     ce = 0, a.classList.remove("pluno-pa-widget--drag-over");
   }, tt = (r) => {
-    S !== null && window.clearTimeout(S), x.textContent = r, x.hidden = !1, S = window.setTimeout(() => {
-      x.textContent = "", x.hidden = !0, S = null;
+    k !== null && window.clearTimeout(k), x.textContent = r, x.hidden = !1, k = window.setTimeout(() => {
+      x.textContent = "", x.hidden = !0, k = null;
     }, 3e3);
   }, rn = () => {
-    S !== null && (window.clearTimeout(S), S = null), x.textContent = "", x.hidden = !0;
+    k !== null && (window.clearTimeout(k), k = null), x.textContent = "", x.hidden = !0;
   }, nt = async (r) => {
     if (r.length === 0)
       return;
@@ -685,7 +685,7 @@ async function lo(e = {}) {
       (M) => {
         Q = !0, H(!0, "send"), W(), w.sendMessage(M);
       },
-      ln && !Se ? {
+      ln && !ke ? {
         dismissedCandidateIds: fe,
         draftingCandidateId: we,
         error: ue,
@@ -699,13 +699,13 @@ async function lo(e = {}) {
           ae.add(M.id), fe.add(M.id), F(), ue = null, O(w.getState());
         },
         onDisable: (M) => {
-          Se = !0, ae.add(M.id), fe.add(M.id), F(), fa(t, !0), ue = null, O(w.getState());
+          ke = !0, ae.add(M.id), fe.add(M.id), F(), fa(t, !0), ue = null, O(w.getState());
         }
       } : void 0
     ), K ? (te = E.scrollTop, W()) : T && vo(r) && en();
   };
   return it = Tn((r) => {
-    Te = r, !ke && Ct(w.getState(), g.value.trim().length > 0 || m.length > 0) && O(w.getState());
+    Te = r, !Se && Ct(w.getState(), g.value.trim().length > 0 || m.length > 0) && O(w.getState());
   }, { backendUrl: t.backendUrl, fetcher: A, loader: t.activeUsersLoader }), w.on("state", (r) => {
     const u = at && !r.isThinking;
     at = r.isThinking, r.appearance ? (Ae = !0, Y("web-sdk.widget", "Agent state supplied appearance", {
@@ -732,7 +732,7 @@ async function lo(e = {}) {
       oe(g.value, !1);
     },
     destroy: () => {
-      ke = !0, Ye.disconnect(), et?.disconnect(), window.removeEventListener("resize", Ze), Je(), S !== null && window.clearTimeout(S), it(), ie?.remove(), w.destroy(), n.remove();
+      Se = !0, Ye.disconnect(), et?.disconnect(), window.removeEventListener("resize", Ze), Je(), k !== null && window.clearTimeout(k), it(), ie?.remove(), w.destroy(), n.remove();
     }
   };
   async function pn(r) {
@@ -834,7 +834,7 @@ function go({
     l = null, p = null, c = null, d = !1, e.classList.remove("pluno-pa-widget--dragging");
   }, C = (h) => {
     e.classList.contains("pluno-pa-widget--open") || e.classList.contains("pluno-pa-widget--closing") || (h.preventDefault(), h.stopPropagation(), l = h.pointerId, p = { x: h.clientX, y: h.clientY }, c = o(), d = !1, t.setPointerCapture?.(h.pointerId));
-  }, k = (h) => {
+  }, S = (h) => {
     if (l !== h.pointerId || !p || !c)
       return;
     h.preventDefault();
@@ -856,8 +856,8 @@ function go({
     let N = null;
     h.key === "ArrowUp" ? N = { x: _.x, y: _.y - g } : h.key === "ArrowDown" ? N = { x: _.x, y: _.y + g } : h.key === "ArrowLeft" ? N = { x: _.x - g, y: _.y } : h.key === "ArrowRight" && (N = { x: _.x + g, y: _.y }), N && (h.preventDefault(), h.stopPropagation(), a(N), i());
   };
-  return t.addEventListener("pointerdown", C), t.addEventListener("pointermove", k), t.addEventListener("pointerup", x), t.addEventListener("pointercancel", R), t.addEventListener("click", v, !0), n.addEventListener("keydown", y), () => {
-    t.removeEventListener("pointerdown", C), t.removeEventListener("pointermove", k), t.removeEventListener("pointerup", x), t.removeEventListener("pointercancel", R), t.removeEventListener("click", v, !0), n.removeEventListener("keydown", y);
+  return t.addEventListener("pointerdown", C), t.addEventListener("pointermove", S), t.addEventListener("pointerup", x), t.addEventListener("pointercancel", R), t.addEventListener("click", v, !0), n.addEventListener("keydown", y), () => {
+    t.removeEventListener("pointerdown", C), t.removeEventListener("pointermove", S), t.removeEventListener("pointerup", x), t.removeEventListener("pointercancel", R), t.removeEventListener("click", v, !0), n.removeEventListener("keydown", y);
   };
 }
 function Ge(e, t = !0) {
@@ -1013,15 +1013,15 @@ function Eo(e) {
   const n = document.createElement("div");
   n.className = "pluno-pa-widget__timeline-wrap";
   const o = document.createElement("main");
-  o.className = "pluno-pa-widget__timeline", o.appendChild(ko(e));
+  o.className = "pluno-pa-widget__timeline", o.appendChild(So(e));
   const a = document.createElement("div");
   a.className = "pluno-pa-widget__timeline-bottom-sentinel", a.setAttribute("aria-hidden", "true"), o.appendChild(a), n.appendChild(o);
   const i = document.createElement("div");
   i.className = "pluno-pa-widget__active-users-counter", i.hidden = !0, n.appendChild(i);
   const l = document.createElement("button");
-  return l.type = "button", l.className = "pluno-pa-widget__timeline-jump", l.textContent = "New messages ↓", l.hidden = !0, n.appendChild(l), n.appendChild(Wt("pluno-pa-widget__new-chat", "New chat", To(), !0)), t.appendChild(n), t.appendChild(So()), t;
+  return l.type = "button", l.className = "pluno-pa-widget__timeline-jump", l.textContent = "New messages ↓", l.hidden = !0, n.appendChild(l), n.appendChild(Wt("pluno-pa-widget__new-chat", "New chat", To(), !0)), t.appendChild(n), t.appendChild(ko()), t;
 }
-function So() {
+function ko() {
   const e = document.createElement("form");
   e.className = "pluno-pa-widget__composer";
   const t = document.createElement("div");
@@ -1047,7 +1047,7 @@ function So() {
   const f = document.createElement("span");
   return f.className = "pluno-pa-widget__ai-disclaimer", f.textContent = "AI can make mistakes. Verify outputs.", d.appendChild(f), e.appendChild(d), e;
 }
-function ko(e) {
+function So(e) {
   const t = document.createElement("div");
   return t.className = "pluno-pa-widget__empty-state", t.appendChild(Ht("pluno-pa-widget__character--empty", e)), t.appendChild(Gt()), t;
 }
@@ -1353,7 +1353,12 @@ function Kt(e, t, n) {
 }
 function yt(e, t) {
   const n = document.createElement("button");
-  return n.type = "button", n.textContent = e, n.disabled = t.trim().length === 0, n.addEventListener("click", () => {
+  if (n.type = "button", e === "Earn credits") {
+    const o = document.createElement("span");
+    o.className = "pluno-pa-widget__billing-action-card-earn-credits-label", o.textContent = e, n.appendChild(o);
+  } else
+    n.textContent = e;
+  return n.disabled = t.trim().length === 0, n.addEventListener("click", () => {
     t.trim().length !== 0 && window.open(t, "_blank", "noopener,noreferrer");
   }), n;
 }
@@ -1388,7 +1393,7 @@ function Zo(e) {
 function Ct(e, t) {
   return e.messages.filter((o) => !Yt(o)).length === 0 && !e.assistantDraft && !e.lastError && !e.isThinking && !t;
 }
-function Jo(e, t, n, o, a, i, l, p, c, d, s, f, C, k, x) {
+function Jo(e, t, n, o, a, i, l, p, c, d, s, f, C, S, x) {
   const R = [...i.messages], v = R.filter((b) => !Yt(b)), y = e.scrollTop;
   e.replaceChildren(), Zt(n, i.isThinking), a.hidden = !p, p && l !== null && Lo(a, l);
   const h = v.length > 0 || !!i.assistantDraft || i.isThinking;
@@ -1397,14 +1402,14 @@ function Jo(e, t, n, o, a, i, l, p, c, d, s, f, C, k, x) {
     b.className = "pluno-pa-widget__empty-state pluno-pa-widget__empty-state--starter";
     const m = document.createElement("div");
     m.className = "pluno-pa-widget__empty-hero";
-    const S = document.createElement("img");
-    S.className = "pluno-pa-widget__character pluno-pa-widget__character--empty", S.src = C(), S.alt = "", S.setAttribute("aria-hidden", "true"), m.appendChild(S), b.appendChild(m), b.appendChild(Gt());
+    const k = document.createElement("img");
+    k.className = "pluno-pa-widget__character pluno-pa-widget__character--empty", k.src = C(), k.alt = "", k.setAttribute("aria-hidden", "true"), m.appendChild(k), b.appendChild(m), b.appendChild(Gt());
     const P = document.createElement("div");
     if (P.className = i.starterPrompts.length > 0 ? "pluno-pa-widget__starter-prompts" : "pluno-pa-widget__starter-prompts pluno-pa-widget__starter-prompts--empty", i.starterPrompts.length === 0 && P.setAttribute("aria-hidden", "true"), i.starterPrompts.length > 0)
       for (const I of i.starterPrompts) {
         const A = document.createElement("button");
         A.type = "button", A.className = "pluno-pa-widget__starter-prompt", A.textContent = `"${I}"`, A.addEventListener("click", () => {
-          k(I);
+          S(I);
         }), P.appendChild(A);
       }
     else
@@ -1430,13 +1435,13 @@ function Jo(e, t, n, o, a, i, l, p, c, d, s, f, C, k, x) {
     }
     if (m.role === "system")
       continue;
-    const S = Z(), P = St(m.content);
-    if (m.role === "assistant" && !S) {
+    const k = Z(), P = kt(m.content);
+    if (m.role === "assistant" && !k) {
       const w = We(C());
       e.appendChild(w), g = null, _ = w;
     }
     const I = document.createElement("div");
-    I.className = `pluno-pa-widget__message pluno-pa-widget__message--${m.role}`, m.role === "assistant" ? kt(I, P) : I.textContent = P, m.role === "user" && m.attachments?.length && I.appendChild(ea(m.attachments));
+    I.className = `pluno-pa-widget__message pluno-pa-widget__message--${m.role}`, m.role === "assistant" ? St(I, P) : I.textContent = P, m.role === "user" && m.attachments?.length && I.appendChild(ea(m.attachments));
     const A = document.createElement("div");
     A.className = "pluno-pa-widget__message-actions", A.appendChild(Et(P)), I.appendChild(A), e.appendChild(I), g = I, _ = null;
   }
@@ -1446,10 +1451,10 @@ function Jo(e, t, n, o, a, i, l, p, c, d, s, f, C, k, x) {
       const P = We(C());
       e.appendChild(P), g = null, _ = P;
     }
-    const b = St(i.assistantDraft), m = document.createElement("div");
-    m.className = "pluno-pa-widget__message pluno-pa-widget__message--assistant", kt(m, b);
-    const S = document.createElement("div");
-    S.className = "pluno-pa-widget__message-actions", S.appendChild(Et(b)), m.appendChild(S), e.appendChild(m), g = m, _ = null;
+    const b = kt(i.assistantDraft), m = document.createElement("div");
+    m.className = "pluno-pa-widget__message pluno-pa-widget__message--assistant", St(m, b);
+    const k = document.createElement("div");
+    k.className = "pluno-pa-widget__message-actions", k.appendChild(Et(b)), m.appendChild(k), e.appendChild(m), g = m, _ = null;
   }
   if (i.isThinking && !i.assistantDraft)
     if (de) {
@@ -1571,8 +1576,8 @@ function na(e, t) {
   o.appendChild(c), o.appendChild(p);
   const C = document.createElement("div");
   C.className = "pluno-pa-widget__share-dialog-step";
-  const k = document.createElement("strong");
-  k.className = "pluno-pa-widget__share-dialog-step-title", k.textContent = "2) Share on", C.appendChild(k);
+  const S = document.createElement("strong");
+  S.className = "pluno-pa-widget__share-dialog-step-title", S.textContent = "2) Share on", C.appendChild(S);
   const x = document.createElement("p");
   x.className = "pluno-pa-widget__share-dialog-hint", x.textContent = "Post draft opens prefilled on supported platforms.", C.appendChild(x);
   const R = document.createElement("footer");
@@ -1632,7 +1637,7 @@ function ra() {
 function Yt(e) {
   return e.role === "tool" && e.toolName === Dt;
 }
-function St(e) {
+function kt(e) {
   return e.replace(/\uE200[^\uE201]*(?:\uE201|$)/g, "");
 }
 function la(e, t, n, o) {
@@ -1651,10 +1656,10 @@ function la(e, t, n, o) {
     const f = document.createElement("div");
     f.className = "pluno-pa-widget__tool-lines";
     for (const C of e) {
-      const k = document.createElement("div");
-      k.className = "pluno-pa-widget__tool-line", C.loading && k.appendChild(je());
+      const S = document.createElement("div");
+      S.className = "pluno-pa-widget__tool-line", C.loading && S.appendChild(je());
       const x = document.createElement("span");
-      x.textContent = C.content || "Run tool", k.appendChild(x), f.appendChild(k);
+      x.textContent = C.content || "Run tool", S.appendChild(x), f.appendChild(S);
     }
     l.appendChild(f);
   }
@@ -1688,7 +1693,7 @@ function je() {
 function Zt(e, t) {
   e.setAttribute("aria-label", t ? "Stop" : "Send"), e.classList.toggle("pluno-pa-widget__send--stop", t), e.replaceChildren(t ? Do() : jt());
 }
-function kt(e, t) {
+function St(e, t) {
   const n = t.replace(/\r\n/g, `
 `).split(`
 `);
@@ -2803,7 +2808,7 @@ function Lt(e, t) {
     }
     .pluno-pa-widget__billing-action-card {
       display: grid;
-      gap: 8px;
+      gap: 7px;
       padding: 10px;
       border: 1px solid color-mix(in srgb, var(--pluno-pa-accent) 24%, var(--pluno-pa-divider));
       border-radius: 8px;
@@ -2842,6 +2847,10 @@ function Lt(e, t) {
       cursor: pointer;
       white-space: nowrap;
     }
+    .pluno-pa-widget__billing-action-card-earn-credits-label {
+      display: inline-block;
+      transform: translateY(1px);
+    }
     .pluno-pa-widget__billing-action-card-actions button:first-child {
       border-color: var(--pluno-pa-text);
       background: var(--pluno-pa-text);
@@ -3117,7 +3126,7 @@ function Lt(e, t) {
     }
     .pluno-pa-widget__active-users-counter {
       position: absolute;
-      top: 18px;
+      top: 22px;
       left: 50%;
       z-index: 2;
       display: inline-flex;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pluno/product-agent-web",
-  "version": "0.1.35",
+  "version": "0.1.36",
   "description": "Browser SDK and default widget for embedding Pluno Product Agent into customer web apps.",
   "license": "Apache-2.0",
   "type": "module",