copilot-chat-widget 0.1.17 → 0.1.19

package/README.md

@@ -1,63 +1,56 @@
-# Copilot Chat Widget
-
-Embeddable chat widget that can be added via NPM or a script tag.
-
-## Installation
-```bash
-npm install copilot-chat-widget
-# or
-yarn add copilot-chat-widget
-```
-
-## Usage (NPM import)
-```js
-import { loadCopilotChatWidget } from "copilot-chat-widget";
-
+# Copilot Chat Widget
+
+Embeddable chat widget that can be added via NPM or a script tag.
+
+## Installation
+```bash
+npm install copilot-chat-widget
+# or
+yarn add copilot-chat-widget
+```
+
+## Usage (NPM import)
+```js
+import { loadCopilotChatWidget } from "copilot-chat-widget";
+
 loadCopilotChatWidget({
-  token: "YOUR_WIDGET_TOKEN",
   // optional: baseUrl if backend is on a different origin
   // baseUrl: "https://your-backend-domain"
 });
 ```
-`loadCopilotChatWidget` injects the standalone script (`chat-widget.min.js`) and bootstraps the widget using the provided `token`.
-
-### React/Next.js example
-```jsx
-import { useEffect } from "react";
-import { loadCopilotChatWidget } from "copilot-chat-widget";
-
-export default function Page() {
+`loadCopilotChatWidget` fetches widget config from `/api/chat-widget/config` and mounts the chat bubble.
+
+### React/Next.js example
+```jsx
+import { useEffect } from "react";
+import { loadCopilotChatWidget } from "copilot-chat-widget";
+
+export default function Page() {
   useEffect(() => {
     loadCopilotChatWidget({
-      token: process.env.NEXT_PUBLIC_CHAT_WIDGET_TOKEN,
       baseUrl: process.env.NEXT_PUBLIC_WIDGET_BASE_URL // optional override if backend is another origin
     });
   }, []);
-
-  return <main>Your page content</main>;
-}
-```
-
-## Usage (script tag)
-```html
+
+  return <main>Your page content</main>;
+}
+```
+
+## Usage (script tag)
+```html
 <script
   src="https://cdn.example.com/chat-widget.min.js"
-  data-token="YOUR_WIDGET_TOKEN"
-  data-base-url="https://your-backend-domain"  <!-- optional if backend is another origin -->
 ></script>
 ```
-- `data-token`: required.
-- `data-base-url`: optional override; if omitted, the widget uses the build-time default `WIDGET_BASE_URL`, then falls back to the script/page origin.
 - `data-autoload="false"`: if you want to insert the script but call `window.CopilotChat.init()` manually.
-
+
 ## Configuration
-- `token` (string, required): widget token.
 - `baseUrl` (string): backend host serving `/api/chat-widget/config`. Needed when the embedding page is on a different origin. If omitted, the widget uses `WIDGET_BASE_URL` (injected at build) then falls back to the script/page origin.
 - `autoload` (boolean): set `false` to defer bootstrap and call `window.CopilotChat.load()` yourself.
-
-Runtime controls (after script loads):
-```js
-window.CopilotChat.open();   // open widget
-window.CopilotChat.close();  // close widget
-window.CopilotChat.load();   // initialize if autoload=false
-```
+
+Runtime controls (after script loads):
+```js
+window.CopilotChat.open();   // open widget
+window.CopilotChat.close();  // close widget
+window.CopilotChat.load();   // initialize if autoload=false
+```

package/dist/chat-widget.min.js

@@ -1,7 +1,7 @@
-(function(){"use strict";(()=>{if(typeof window>"u"||typeof document>"u"||window.__copilotWidgetLoaded)return;window.__copilotWidgetLoaded=!0;const T="http://localhost:3000",b=64,y=720,x=document.currentScript,k=t=>{if(!t?.src)return{};try{const s=new URL(t.src,window.location.href),n={};return s.searchParams.forEach((l,c)=>{n[c]=l}),n}catch(s){return console.warn("[CopilotChat] Failed to parse script query params:",s),{}}},I=t=>{document.readyState==="complete"||document.readyState==="interactive"?setTimeout(t,0):document.addEventListener("DOMContentLoaded",t)},v=()=>x||Array.from(document.querySelectorAll("script")).reverse().find(n=>n.dataset?.token||n.src&&n.src.includes("chat-widget"))||null,U=({iframeUrl:t,launcherIcon:s})=>{const n=document.querySelector("[data-copilot-widget-root]");n&&n.remove();const l=w=>{const a=document.querySelector("[data-copilot-checkout-toast]");a&&a.remove();const h=document.createElement("div");h.setAttribute("data-copilot-checkout-toast","true"),h.innerText=w,Object.assign(h.style,{position:"fixed",top:"20px",left:"50%",transform:"translateX(-50%)",padding:"12px 16px",background:"#0f172a",color:"white",borderRadius:"12px",boxShadow:"0 8px 24px rgba(0,0,0,0.25)",zIndex:2147483647,fontSize:"14px",fontWeight:"600",maxWidth:"420px",lineHeight:"1.4",textAlign:"center"}),document.body.appendChild(h),setTimeout(()=>{h.remove()},4500)},c=document.createElement("div");c.setAttribute("data-copilot-widget-root","true");const C=c.attachShadow({mode:"open"});document.body.appendChild(c);const e=document.createElement("button");e.type="button",e.setAttribute("aria-label","Open Copilot chat"),e.innerHTML=`
+(function(){"use strict";(()=>{if(typeof window>"u"||typeof document>"u"||window.__copilotWidgetLoaded)return;window.__copilotWidgetLoaded=!0;const S="http://localhost:3000",g=64,f=720,x=document.currentScript,k=e=>{document.readyState==="complete"||document.readyState==="interactive"?setTimeout(e,0):document.addEventListener("DOMContentLoaded",e)},C=()=>x||Array.from(document.querySelectorAll("script")).reverse().find(r=>r.dataset?.token||r.src&&r.src.includes("chat-widget"))||null,I=({iframeUrl:e,launcherIcon:h})=>{const r=document.querySelector("[data-copilot-widget-root]");r&&r.remove();const a=l=>{const n=document.querySelector("[data-copilot-checkout-toast]");n&&n.remove();const d=document.createElement("div");d.setAttribute("data-copilot-checkout-toast","true"),d.innerText=l,Object.assign(d.style,{position:"fixed",top:"20px",left:"50%",transform:"translateX(-50%)",padding:"12px 16px",background:"#0f172a",color:"white",borderRadius:"12px",boxShadow:"0 8px 24px rgba(0,0,0,0.25)",zIndex:2147483647,fontSize:"14px",fontWeight:"600",maxWidth:"420px",lineHeight:"1.4",textAlign:"center"}),document.body.appendChild(d),setTimeout(()=>{d.remove()},4500)},s=document.createElement("div");s.setAttribute("data-copilot-widget-root","true");const b=s.attachShadow({mode:"open"});document.body.appendChild(s);const t=document.createElement("button");t.type="button",t.setAttribute("aria-label","Open Copilot chat"),t.innerHTML=`
       <img
-        src="${s}"
+        src="${h}"
         alt="Copilot chat launcher"
         style="width: 38px; height: 38px; object-fit: contain; border-radius: 50%; pointer-events: none;"
       />
-    `,Object.assign(e.style,{position:"fixed",bottom:"24px",right:"24px",width:`${b}px`,height:`${b}px`,borderRadius:"50%",border:"none",background:"linear-gradient(135deg, #0078ff, #00c6ff)",color:"white",cursor:"pointer",zIndex:999998,display:"flex",alignItems:"center",justifyContent:"center",boxShadow:"0 6px 14px rgba(0,0,0,0.25)",transition:"all 0.25s ease"}),e.onmouseover=()=>{e.style.transform="scale(1.12)",e.style.boxShadow="0 10px 25px rgba(0,0,0,0.3)"},e.onmouseout=()=>{e.style.transform="scale(1)",e.style.boxShadow="0 6px 14px rgba(0,0,0,0.25)"};const i=document.createElement("div");i.setAttribute("data-copilot-widget-root","true"),Object.assign(i.style,{display:"none",position:"fixed",bottom:`${b+36}px`,right:"24px",zIndex:"999999",transformOrigin:"bottom right",transform:"scale(0.8) translateY(20px)",opacity:"0",transition:"all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55)"});const o=document.createElement("div"),r=document.createElement("div"),m=document.createElement("div");Object.assign(o.style,{position:"absolute",bottom:"-14px",right:"28px",width:"30px",height:"20px",pointerEvents:"none",display:"none",zIndex:"1"}),Object.assign(r.style,{position:"absolute",bottom:"0",left:"0",right:"0",margin:"0 auto",width:"0",height:"0",borderLeft:"15px solid transparent",borderRight:"15px solid transparent",borderTop:"15px solid rgba(15,23,42,0.1)"}),Object.assign(m.style,{position:"absolute",bottom:"2px",left:"0",right:"0",margin:"0 auto",width:"0",height:"0",borderLeft:"13px solid transparent",borderRight:"13px solid transparent",borderTop:"13px solid white",boxShadow:"0 6px 16px rgba(15,23,42,0.12)",borderRadius:"2px"}),o.appendChild(r),o.appendChild(m);const p=document.createElement("div");Object.assign(p.style,{width:`${y}px`,maxWidth:"calc(100vw - 48px)",height:`${Math.min(y,Math.max(320,window.innerHeight-140))}px`,maxHeight:"calc(100vh - 150px)",borderRadius:"20px",background:"white",border:"1px solid rgba(15,23,42,0.12)",boxShadow:"0 18px 45px rgba(15,23,42,0.16)",overflow:"hidden"}),C.appendChild(p);const d=document.createElement("iframe");d.src=t,d.title="Copilot chat widget",d.allow="clipboard-read; clipboard-write; microphone; camera; display-capture",d.setAttribute("scrolling","no"),Object.assign(d.style,{width:"100%",height:"100%",border:"none",display:"block",background:"transparent",overflow:"hidden"}),C.appendChild(p),p.appendChild(d),i.appendChild(o),i.appendChild(p),document.body.appendChild(e),document.body.appendChild(i);let u=!1;const f=()=>{u&&(u=!1,i.style.opacity="0",i.style.transform="scale(0.8) translateY(20px)",o.style.display="none",setTimeout(()=>{i.style.display="none"},250),e.style.transform="scale(1)")},O=w=>{const{data:a,source:h}=w||{};if(a?.type){if(a.type==="CART_CHECKOUT"&&h===d.contentWindow){console.log("[CopilotChat] Received checkout payload from widget:",a),l("Checkout message received from chat widget. Check console for payload.");return}if(a.type==="WIDGET_READY"&&h===d.contentWindow){d.contentWindow.postMessage({type:"INIT_WIDGET"},"*");return}a.type==="CHAT_CLOSED"&&f()}};e.onclick=w=>{w.stopPropagation(),u=!u,u?(i.style.display="block",o.style.display="block",requestAnimationFrame(()=>{i.style.opacity="1",i.style.transform="scale(1) translateY(0)"})):f()},window.addEventListener("message",O),document.addEventListener("click",w=>{const a=w.target;a&&u&&!i.contains(a)&&a!==e&&f()});const g={close:f,open:()=>{u||e.click()}};return window.CopilotChat=window.CopilotChat||{},window.CopilotChat.close=g.close,window.CopilotChat.open=g.open,window.CopilotChat.controls=g,g},E=t=>{console.error(`[CopilotChat] ${t}`)},A=()=>{const t=v();if(!t)return!1;const s=k(t),n=t.dataset||{},l=n.token||s.token,c=typeof window<"u"&&window.CopilotChatConfig&&window.CopilotChatConfig.token;return(l||c)&&n.autoload!=="false"},S=async(t={})=>{const s=t.scriptEl||v(),n=window.CopilotChatConfig||{},l=s?.dataset||{},c=k(s),e=(()=>{const o=t.token||n.token||l.token||c.token;if(o)return o;try{const r=window.localStorage.getItem("copilotChatToken");if(r)return r}catch{}if(typeof window<"u"&&typeof window.prompt=="function"){const r=window.prompt("Enter your Copilot Chat token:");if(r){try{window.localStorage.setItem("copilotChatToken",r)}catch{}return r}}return null})();if(!e)return E("Missing token (provide via init config, window.CopilotChatConfig.token, or data-token attribute)."),null;const i=t.baseUrl||n.baseUrl||l.baseUrl||c.baseUrl||T;try{const o=await fetch(`${i}/api/chat-widget/config?token=${encodeURIComponent(e)}`,{credentials:"omit",mode:"cors"});if(!o.ok)throw new Error(`Server responded with ${o.status}`);const r=await o.json();if(!r?.iframeUrl||!r?.launcherIcon)throw new Error("Received incomplete widget configuration from server.");return window.CopilotChat=window.CopilotChat||{},window.CopilotChat.init=(p={})=>{const d={iframeUrl:p.iframeUrl||r.iframeUrl,launcherIcon:p.launcherIcon||r.launcherIcon};return U(d)},window.CopilotChat.init(t)}catch(o){return E(o instanceof Error?o.message:"Unknown error during widget bootstrap."),null}};A()&&I(()=>{S()}),window.CopilotChat=window.CopilotChat||{},window.CopilotChat.load=S})()})();
+    `,Object.assign(t.style,{position:"fixed",bottom:"24px",right:"24px",width:`${g}px`,height:`${g}px`,borderRadius:"50%",border:"none",background:"linear-gradient(135deg, #0078ff, #00c6ff)",color:"white",cursor:"pointer",zIndex:999998,display:"flex",alignItems:"center",justifyContent:"center",boxShadow:"0 6px 14px rgba(0,0,0,0.25)",transition:"all 0.25s ease"}),t.onmouseover=()=>{t.style.transform="scale(1.12)",t.style.boxShadow="0 10px 25px rgba(0,0,0,0.3)"},t.onmouseout=()=>{t.style.transform="scale(1)",t.style.boxShadow="0 6px 14px rgba(0,0,0,0.25)"};const o=document.createElement("div");o.setAttribute("data-copilot-widget-root","true"),Object.assign(o.style,{display:"none",position:"fixed",bottom:`${g+36}px`,right:"24px",zIndex:"999999",transformOrigin:"bottom right",transform:"scale(0.8) translateY(20px)",opacity:"0",transition:"all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55)"});const p=document.createElement("div"),E=document.createElement("div"),v=document.createElement("div");Object.assign(p.style,{position:"absolute",bottom:"-14px",right:"28px",width:"30px",height:"20px",pointerEvents:"none",display:"none",zIndex:"1"}),Object.assign(E.style,{position:"absolute",bottom:"0",left:"0",right:"0",margin:"0 auto",width:"0",height:"0",borderLeft:"15px solid transparent",borderRight:"15px solid transparent",borderTop:"15px solid rgba(15,23,42,0.1)"}),Object.assign(v.style,{position:"absolute",bottom:"2px",left:"0",right:"0",margin:"0 auto",width:"0",height:"0",borderLeft:"13px solid transparent",borderRight:"13px solid transparent",borderTop:"13px solid white",boxShadow:"0 6px 16px rgba(15,23,42,0.12)",borderRadius:"2px"}),p.appendChild(E),p.appendChild(v);const u=document.createElement("div");Object.assign(u.style,{width:`${f}px`,maxWidth:"calc(100vw - 48px)",height:`${Math.min(f,Math.max(320,window.innerHeight-140))}px`,maxHeight:"calc(100vh - 150px)",borderRadius:"20px",background:"white",border:"1px solid rgba(15,23,42,0.12)",boxShadow:"0 18px 45px rgba(15,23,42,0.16)",overflow:"hidden"}),b.appendChild(u);const i=document.createElement("iframe");i.src=e,i.title="Copilot chat widget",i.allow="clipboard-read; clipboard-write; microphone; camera; display-capture",i.setAttribute("scrolling","no"),Object.assign(i.style,{width:"100%",height:"100%",border:"none",display:"block",background:"transparent",overflow:"hidden"}),b.appendChild(u),u.appendChild(i),o.appendChild(p),o.appendChild(u),document.body.appendChild(t),document.body.appendChild(o);let c=!1;const m=()=>{c&&(c=!1,o.style.opacity="0",o.style.transform="scale(0.8) translateY(20px)",p.style.display="none",setTimeout(()=>{o.style.display="none"},250),t.style.transform="scale(1)")},O=l=>{const{data:n,source:d}=l||{};if(n?.type){if(n.type==="CART_CHECKOUT"&&d===i.contentWindow){console.log("[CopilotChat] Received checkout payload from widget:",n),a("Checkout message received from chat widget. Check console for payload.");return}if(n.type==="WIDGET_READY"&&d===i.contentWindow){i.contentWindow.postMessage({type:"INIT_WIDGET"},"*");return}n.type==="CHAT_CLOSED"&&m()}};t.onclick=l=>{l.stopPropagation(),c=!c,c?(o.style.display="block",p.style.display="block",requestAnimationFrame(()=>{o.style.opacity="1",o.style.transform="scale(1) translateY(0)"})):m()},window.addEventListener("message",O),document.addEventListener("click",l=>{const n=l.target;n&&c&&!o.contains(n)&&n!==t&&m()});const w={close:m,open:()=>{c||t.click()}};return window.CopilotChat=window.CopilotChat||{},window.CopilotChat.close=w.close,window.CopilotChat.open=w.open,window.CopilotChat.controls=w,w},T=e=>{console.error(`[CopilotChat] ${e}`)},A=()=>{const e=C();return e?(e.dataset||{}).autoload!=="false":!1},y=async(e={})=>{e.scriptEl||C();const h=window.CopilotChatConfig||{},r=e.baseUrl||h.baseUrl||S;try{const a=await fetch(`${r}/api/chat-widget/config`,{credentials:"omit",mode:"cors"});if(!a.ok)throw new Error(`Server responded with ${a.status}`);const s=await a.json();if(!s?.iframeUrl||!s?.launcherIcon)throw new Error("Received incomplete widget configuration from server.");return window.CopilotChat=window.CopilotChat||{},window.CopilotChat.init=(t={})=>{const o={iframeUrl:t.iframeUrl||s.iframeUrl,launcherIcon:t.launcherIcon||s.launcherIcon};return I(o)},window.CopilotChat.init(e)}catch(a){return T(a instanceof Error?a.message:"Unknown error during widget bootstrap."),null}};A()&&k(()=>{y()}),window.CopilotChat=window.CopilotChat||{},window.CopilotChat.load=y})()})();

package/dist/index.cjs

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const k="http://localhost:3000",w=64,C=720,E=({iframeUrl:h,launcherIcon:u})=>{const d=document.querySelector("[data-copilot-widget-root]");d&&d.remove();const g=s=>{const o=document.querySelector("[data-copilot-checkout-toast]");o&&o.remove();const r=document.createElement("div");r.setAttribute("data-copilot-checkout-toast","true"),r.innerText=s,Object.assign(r.style,{position:"fixed",top:"20px",left:"50%",transform:"translateX(-50%)",padding:"12px 16px",background:"#0f172a",color:"white",borderRadius:"12px",boxShadow:"0 8px 24px rgba(0,0,0,0.25)",zIndex:2147483647,fontSize:"14px",fontWeight:"600",maxWidth:"420px",lineHeight:"1.4",textAlign:"center"}),document.body.appendChild(r),setTimeout(()=>{r.remove()},4500)},c=document.createElement("div");c.setAttribute("data-copilot-widget-root","true");const n=c.attachShadow({mode:"open"});document.body.appendChild(c);const t=document.createElement("button");t.type="button",t.setAttribute("aria-label","Open Copilot chat"),t.innerHTML=`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const E="http://localhost:3000",w=64,y=720,k=({iframeUrl:g,launcherIcon:b})=>{const c=document.querySelector("[data-copilot-widget-root]");c&&c.remove();const m=d=>{const o=document.querySelector("[data-copilot-checkout-toast]");o&&o.remove();const r=document.createElement("div");r.setAttribute("data-copilot-checkout-toast","true"),r.innerText=d,Object.assign(r.style,{position:"fixed",top:"20px",left:"50%",transform:"translateX(-50%)",padding:"12px 16px",background:"#0f172a",color:"white",borderRadius:"12px",boxShadow:"0 8px 24px rgba(0,0,0,0.25)",zIndex:2147483647,fontSize:"14px",fontWeight:"600",maxWidth:"420px",lineHeight:"1.4",textAlign:"center"}),document.body.appendChild(r),setTimeout(()=>{r.remove()},4500)},n=document.createElement("div");n.setAttribute("data-copilot-widget-root","true");const a=n.attachShadow({mode:"open"});document.body.appendChild(n);const t=document.createElement("button");t.type="button",t.setAttribute("aria-label","Open Copilot chat"),t.innerHTML=`
       <img
-        src="${u}"
+        src="${b}"
         alt="Copilot chat launcher"
         style="width: 38px; height: 38px; object-fit: contain; border-radius: 50%; pointer-events: none;"
       />
-    `,Object.assign(t.style,{position:"fixed",bottom:"24px",right:"24px",width:`${w}px`,height:`${w}px`,borderRadius:"50%",border:"none",background:"linear-gradient(135deg, #0078ff, #00c6ff)",color:"white",cursor:"pointer",zIndex:999998,display:"flex",alignItems:"center",justifyContent:"center",boxShadow:"0 6px 14px rgba(0,0,0,0.25)",transition:"all 0.25s ease"}),t.onmouseover=()=>{t.style.transform="scale(1.12)",t.style.boxShadow="0 10px 25px rgba(0,0,0,0.3)"},t.onmouseout=()=>{t.style.transform="scale(1)",t.style.boxShadow="0 6px 14px rgba(0,0,0,0.25)"};const e=document.createElement("div");e.setAttribute("data-copilot-widget-root","true"),Object.assign(e.style,{display:"none",position:"fixed",bottom:`${w+36}px`,right:"24px",zIndex:"999999",transformOrigin:"bottom right",transform:"scale(0.8) translateY(20px)",opacity:"0",transition:"all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55)"});const l=document.createElement("div"),f=document.createElement("div"),x=document.createElement("div");Object.assign(l.style,{position:"absolute",bottom:"-14px",right:"28px",width:"30px",height:"20px",pointerEvents:"none",display:"none",zIndex:"1"}),Object.assign(f.style,{position:"absolute",bottom:"0",left:"0",right:"0",margin:"0 auto",width:"0",height:"0",borderLeft:"15px solid transparent",borderRight:"15px solid transparent",borderTop:"15px solid rgba(15,23,42,0.1)"}),Object.assign(x.style,{position:"absolute",bottom:"2px",left:"0",right:"0",margin:"0 auto",width:"0",height:"0",borderLeft:"13px solid transparent",borderRight:"13px solid transparent",borderTop:"13px solid white",boxShadow:"0 6px 16px rgba(15,23,42,0.12)",borderRadius:"2px"}),l.appendChild(f),l.appendChild(x);const p=document.createElement("div");Object.assign(p.style,{width:`${C}px`,maxWidth:"calc(100vw - 48px)",height:`${Math.min(C,Math.max(320,window.innerHeight-140))}px`,maxHeight:"calc(100vh - 150px)",borderRadius:"20px",background:"white",border:"1px solid rgba(15,23,42,0.12)",boxShadow:"0 18px 45px rgba(15,23,42,0.16)",overflow:"hidden"}),n.appendChild(p);const i=document.createElement("iframe");i.src=h,i.title="Copilot chat widget",i.allow="clipboard-read; clipboard-write; microphone; camera; display-capture",i.setAttribute("scrolling","no"),Object.assign(i.style,{width:"100%",height:"100%",border:"none",display:"block",background:"transparent",overflow:"hidden"}),n.appendChild(p),p.appendChild(i),e.appendChild(l),e.appendChild(p),document.body.appendChild(t),document.body.appendChild(e);let a=!1;const m=()=>{a&&(a=!1,e.style.opacity="0",e.style.transform="scale(0.8) translateY(20px)",l.style.display="none",setTimeout(()=>{e.style.display="none"},250),t.style.transform="scale(1)")},v=s=>{const{data:o,source:r}=s||{};if(o?.type){if(o.type==="CART_CHECKOUT"&&r===i.contentWindow){console.log("[CopilotChat] Received checkout payload from widget:",o),g("Checkout message received from chat widget. Check console for payload.");return}if(o.type==="WIDGET_READY"&&r===i.contentWindow){i.contentWindow.postMessage({type:"INIT_WIDGET"},"*");return}o.type==="CHAT_CLOSED"&&m()}};window.addEventListener("message",v),t.onclick=s=>{s.stopPropagation(),a=!a,a?(e.style.display="block",l.style.display="block",requestAnimationFrame(()=>{e.style.opacity="1",e.style.transform="scale(1) translateY(0)"})):m()},document.addEventListener("click",s=>{const o=s.target;o&&a&&!e.contains(o)&&o!==t&&m()});const b={close:m,open:()=>{a||t.click()}};return window.CopilotChat=window.CopilotChat||{},window.CopilotChat.close=b.close,window.CopilotChat.open=b.open,window.CopilotChat.controls=b,b};async function y(h={}){if(typeof window>"u"||typeof document>"u")return null;const u=window.CopilotChatConfig||{},d=h.token||u.token||typeof window<"u"&&window.localStorage?.getItem("copilotChatToken")||null;if(!d)return console.error("[CopilotChat] Missing token (provide via loadCopilotChatWidget({ token }) or window.CopilotChatConfig.token)."),null;const g=h.baseUrl||u.baseUrl||k,c=`${g.replace(/\/$/,"")}/api/chat-widget/config?token=${encodeURIComponent(d)}`;try{const n=await fetch(c,{credentials:"omit",mode:"cors"});if(!n.ok)throw new Error(`Server responded with ${n.status}`);const t=await n.json();if(!t?.iframeUrl||!t?.launcherIcon)throw new Error("Received incomplete widget configuration from server.");return window.CopilotChat=window.CopilotChat||{},window.CopilotChat.token=d,window.CopilotChat.baseUrl=g,E({iframeUrl:t.iframeUrl,launcherIcon:t.launcherIcon})}catch(n){return console.error("[CopilotChat] Error during widget bootstrap:",n instanceof Error?n.message:n),null}}exports.default=y;exports.loadCopilotChatWidget=y;
+    `,Object.assign(t.style,{position:"fixed",bottom:"24px",right:"24px",width:`${w}px`,height:`${w}px`,borderRadius:"50%",border:"none",background:"linear-gradient(135deg, #0078ff, #00c6ff)",color:"white",cursor:"pointer",zIndex:999998,display:"flex",alignItems:"center",justifyContent:"center",boxShadow:"0 6px 14px rgba(0,0,0,0.25)",transition:"all 0.25s ease"}),t.onmouseover=()=>{t.style.transform="scale(1.12)",t.style.boxShadow="0 10px 25px rgba(0,0,0,0.3)"},t.onmouseout=()=>{t.style.transform="scale(1)",t.style.boxShadow="0 6px 14px rgba(0,0,0,0.25)"};const e=document.createElement("div");e.setAttribute("data-copilot-widget-root","true"),Object.assign(e.style,{display:"none",position:"fixed",bottom:`${w+36}px`,right:"24px",zIndex:"999999",transformOrigin:"bottom right",transform:"scale(0.8) translateY(20px)",opacity:"0",transition:"all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55)"});const l=document.createElement("div"),f=document.createElement("div"),x=document.createElement("div");Object.assign(l.style,{position:"absolute",bottom:"-14px",right:"28px",width:"30px",height:"20px",pointerEvents:"none",display:"none",zIndex:"1"}),Object.assign(f.style,{position:"absolute",bottom:"0",left:"0",right:"0",margin:"0 auto",width:"0",height:"0",borderLeft:"15px solid transparent",borderRight:"15px solid transparent",borderTop:"15px solid rgba(15,23,42,0.1)"}),Object.assign(x.style,{position:"absolute",bottom:"2px",left:"0",right:"0",margin:"0 auto",width:"0",height:"0",borderLeft:"13px solid transparent",borderRight:"13px solid transparent",borderTop:"13px solid white",boxShadow:"0 6px 16px rgba(15,23,42,0.12)",borderRadius:"2px"}),l.appendChild(f),l.appendChild(x);const p=document.createElement("div");Object.assign(p.style,{width:`${y}px`,maxWidth:"calc(100vw - 48px)",height:`${Math.min(y,Math.max(320,window.innerHeight-140))}px`,maxHeight:"calc(100vh - 150px)",borderRadius:"20px",background:"white",border:"1px solid rgba(15,23,42,0.12)",boxShadow:"0 18px 45px rgba(15,23,42,0.16)",overflow:"hidden"}),a.appendChild(p);const i=document.createElement("iframe");i.src=g,i.title="Copilot chat widget",i.allow="clipboard-read; clipboard-write; microphone; camera; display-capture",i.setAttribute("scrolling","no"),Object.assign(i.style,{width:"100%",height:"100%",border:"none",display:"block",background:"transparent",overflow:"hidden"}),a.appendChild(p),p.appendChild(i),e.appendChild(l),e.appendChild(p),document.body.appendChild(t),document.body.appendChild(e);let s=!1;const h=()=>{s&&(s=!1,e.style.opacity="0",e.style.transform="scale(0.8) translateY(20px)",l.style.display="none",setTimeout(()=>{e.style.display="none"},250),t.style.transform="scale(1)")},v=d=>{const{data:o,source:r}=d||{};if(o?.type){if(o.type==="CART_CHECKOUT"&&r===i.contentWindow){console.log("[CopilotChat] Received checkout payload from widget:",o),m("Checkout message received from chat widget. Check console for payload.");return}if(o.type==="WIDGET_READY"&&r===i.contentWindow){i.contentWindow.postMessage({type:"INIT_WIDGET"},"*");return}o.type==="CHAT_CLOSED"&&h()}};window.addEventListener("message",v),t.onclick=d=>{d.stopPropagation(),s=!s,s?(e.style.display="block",l.style.display="block",requestAnimationFrame(()=>{e.style.opacity="1",e.style.transform="scale(1) translateY(0)"})):h()},document.addEventListener("click",d=>{const o=d.target;o&&s&&!e.contains(o)&&o!==t&&h()});const u={close:h,open:()=>{s||t.click()}};return window.CopilotChat=window.CopilotChat||{},window.CopilotChat.close=u.close,window.CopilotChat.open=u.open,window.CopilotChat.controls=u,u};async function C(g={}){if(typeof window>"u"||typeof document>"u")return null;const b=window.CopilotChatConfig||{},c=g.baseUrl||b.baseUrl||E,m=`${c.replace(/\/$/,"")}/api/chat-widget/config`;try{const n=await fetch(m,{credentials:"omit",mode:"cors"});if(!n.ok)throw new Error(`Server responded with ${n.status}`);const a=await n.json();if(!a?.iframeUrl||!a?.launcherIcon)throw new Error("Received incomplete widget configuration from server.");return window.CopilotChat=window.CopilotChat||{},window.CopilotChat.baseUrl=c,k({iframeUrl:a.iframeUrl,launcherIcon:a.launcherIcon})}catch(n){return console.error("[CopilotChat] Error during widget bootstrap:",n instanceof Error?n.message:n),null}}exports.default=C;exports.loadCopilotChatWidget=C;

package/dist/index.mjs

@@ -1,12 +1,12 @@
-const C = "http://localhost:3000";
-const y = ({ iframeUrl: h, launcherIcon: u }) => {
-  const d = document.querySelector("[data-copilot-widget-root]");
-  d && d.remove();
-  const g = (s) => {
+const y = "http://localhost:3000";
+const C = ({ iframeUrl: g, launcherIcon: b }) => {
+  const c = document.querySelector("[data-copilot-widget-root]");
+  c && c.remove();
+  const m = (d) => {
     const o = document.querySelector("[data-copilot-checkout-toast]");
     o && o.remove();
     const r = document.createElement("div");
-    r.setAttribute("data-copilot-checkout-toast", "true"), r.innerText = s, Object.assign(r.style, {
+    r.setAttribute("data-copilot-checkout-toast", "true"), r.innerText = d, Object.assign(r.style, {
       position: "fixed",
       top: "20px",
       left: "50%",
@@ -25,14 +25,14 @@ const y = ({ iframeUrl: h, launcherIcon: u }) => {
     }), document.body.appendChild(r), setTimeout(() => {
       r.remove();
     }, 4500);
-  }, c = document.createElement("div");
-  c.setAttribute("data-copilot-widget-root", "true");
-  const n = c.attachShadow({ mode: "open" });
-  document.body.appendChild(c);
+  }, n = document.createElement("div");
+  n.setAttribute("data-copilot-widget-root", "true");
+  const a = n.attachShadow({ mode: "open" });
+  document.body.appendChild(n);
   const t = document.createElement("button");
   t.type = "button", t.setAttribute("aria-label", "Open Copilot chat"), t.innerHTML = `
       <img
-        src="${u}"
+        src="${b}"
         alt="Copilot chat launcher"
         style="width: 38px; height: 38px; object-fit: contain; border-radius: 50%; pointer-events: none;"
       />
@@ -70,7 +70,7 @@ const y = ({ iframeUrl: h, launcherIcon: u }) => {
     opacity: "0",
     transition: "all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55)"
   });
-  const l = document.createElement("div"), b = document.createElement("div"), f = document.createElement("div");
+  const l = document.createElement("div"), w = document.createElement("div"), x = document.createElement("div");
   Object.assign(l.style, {
     position: "absolute",
     bottom: "-14px",
@@ -80,7 +80,7 @@ const y = ({ iframeUrl: h, launcherIcon: u }) => {
     pointerEvents: "none",
     display: "none",
     zIndex: "1"
-  }), Object.assign(b.style, {
+  }), Object.assign(w.style, {
     position: "absolute",
     bottom: "0",
     left: "0",
@@ -91,7 +91,7 @@ const y = ({ iframeUrl: h, launcherIcon: u }) => {
     borderLeft: "15px solid transparent",
     borderRight: "15px solid transparent",
     borderTop: "15px solid rgba(15,23,42,0.1)"
-  }), Object.assign(f.style, {
+  }), Object.assign(x.style, {
     position: "absolute",
     bottom: "2px",
     left: "0",
@@ -104,7 +104,7 @@ const y = ({ iframeUrl: h, launcherIcon: u }) => {
     borderTop: "13px solid white",
     boxShadow: "0 6px 16px rgba(15,23,42,0.12)",
     borderRadius: "2px"
-  }), l.appendChild(b), l.appendChild(f);
+  }), l.appendChild(w), l.appendChild(x);
   const p = document.createElement("div");
   Object.assign(p.style, {
     width: "720px",
@@ -116,75 +116,68 @@ const y = ({ iframeUrl: h, launcherIcon: u }) => {
     border: "1px solid rgba(15,23,42,0.12)",
     boxShadow: "0 18px 45px rgba(15,23,42,0.16)",
     overflow: "hidden"
-  }), n.appendChild(p);
+  }), a.appendChild(p);
   const i = document.createElement("iframe");
-  i.src = h, i.title = "Copilot chat widget", i.allow = "clipboard-read; clipboard-write; microphone; camera; display-capture", i.setAttribute("scrolling", "no"), Object.assign(i.style, {
+  i.src = g, i.title = "Copilot chat widget", i.allow = "clipboard-read; clipboard-write; microphone; camera; display-capture", i.setAttribute("scrolling", "no"), Object.assign(i.style, {
     width: "100%",
     height: "100%",
     border: "none",
     display: "block",
     background: "transparent",
     overflow: "hidden"
-  }), n.appendChild(p), p.appendChild(i), e.appendChild(l), e.appendChild(p), document.body.appendChild(t), document.body.appendChild(e);
-  let a = !1;
-  const m = () => {
-    a && (a = !1, e.style.opacity = "0", e.style.transform = "scale(0.8) translateY(20px)", l.style.display = "none", setTimeout(() => {
+  }), a.appendChild(p), p.appendChild(i), e.appendChild(l), e.appendChild(p), document.body.appendChild(t), document.body.appendChild(e);
+  let s = !1;
+  const h = () => {
+    s && (s = !1, e.style.opacity = "0", e.style.transform = "scale(0.8) translateY(20px)", l.style.display = "none", setTimeout(() => {
       e.style.display = "none";
     }, 250), t.style.transform = "scale(1)");
-  }, x = (s) => {
-    const { data: o, source: r } = s || {};
+  }, f = (d) => {
+    const { data: o, source: r } = d || {};
     if (o?.type) {
       if (o.type === "CART_CHECKOUT" && r === i.contentWindow) {
-        console.log("[CopilotChat] Received checkout payload from widget:", o), g("Checkout message received from chat widget. Check console for payload.");
+        console.log("[CopilotChat] Received checkout payload from widget:", o), m("Checkout message received from chat widget. Check console for payload.");
         return;
       }
       if (o.type === "WIDGET_READY" && r === i.contentWindow) {
         i.contentWindow.postMessage({ type: "INIT_WIDGET" }, "*");
         return;
       }
-      o.type === "CHAT_CLOSED" && m();
+      o.type === "CHAT_CLOSED" && h();
     }
   };
-  window.addEventListener("message", x), t.onclick = (s) => {
-    s.stopPropagation(), a = !a, a ? (e.style.display = "block", l.style.display = "block", requestAnimationFrame(() => {
+  window.addEventListener("message", f), t.onclick = (d) => {
+    d.stopPropagation(), s = !s, s ? (e.style.display = "block", l.style.display = "block", requestAnimationFrame(() => {
       e.style.opacity = "1", e.style.transform = "scale(1) translateY(0)";
-    })) : m();
-  }, document.addEventListener("click", (s) => {
-    const o = s.target;
-    o && a && !e.contains(o) && o !== t && m();
+    })) : h();
+  }, document.addEventListener("click", (d) => {
+    const o = d.target;
+    o && s && !e.contains(o) && o !== t && h();
   });
-  const w = {
-    close: m,
+  const u = {
+    close: h,
     open: () => {
-      a || t.click();
+      s || t.click();
     }
   };
-  return window.CopilotChat = window.CopilotChat || {}, window.CopilotChat.close = w.close, window.CopilotChat.open = w.open, window.CopilotChat.controls = w, w;
+  return window.CopilotChat = window.CopilotChat || {}, window.CopilotChat.close = u.close, window.CopilotChat.open = u.open, window.CopilotChat.controls = u, u;
 };
-async function E(h = {}) {
+async function E(g = {}) {
   if (typeof window > "u" || typeof document > "u")
     return null;
-  const u = window.CopilotChatConfig || {}, d = h.token || u.token || typeof window < "u" && window.localStorage?.getItem("copilotChatToken") || null;
-  if (!d)
-    return console.error(
-      "[CopilotChat] Missing token (provide via loadCopilotChatWidget({ token }) or window.CopilotChatConfig.token)."
-    ), null;
-  const g = h.baseUrl || u.baseUrl || C, c = `${g.replace(/\/$/, "")}/api/chat-widget/config?token=${encodeURIComponent(
-    d
-  )}`;
+  const b = window.CopilotChatConfig || {}, c = g.baseUrl || b.baseUrl || y, m = `${c.replace(/\/$/, "")}/api/chat-widget/config`;
   try {
-    const n = await fetch(c, {
+    const n = await fetch(m, {
       credentials: "omit",
       mode: "cors"
     });
     if (!n.ok)
       throw new Error(`Server responded with ${n.status}`);
-    const t = await n.json();
-    if (!t?.iframeUrl || !t?.launcherIcon)
+    const a = await n.json();
+    if (!a?.iframeUrl || !a?.launcherIcon)
       throw new Error("Received incomplete widget configuration from server.");
-    return window.CopilotChat = window.CopilotChat || {}, window.CopilotChat.token = d, window.CopilotChat.baseUrl = g, y({
-      iframeUrl: t.iframeUrl,
-      launcherIcon: t.launcherIcon
+    return window.CopilotChat = window.CopilotChat || {}, window.CopilotChat.baseUrl = c, C({
+      iframeUrl: a.iframeUrl,
+      launcherIcon: a.launcherIcon
     });
   } catch (n) {
     return console.error(

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "copilot-chat-widget",
-  "version": "0.1.17",
+  "version": "0.1.19",
   "description": "Embeddable Copilot chat widget that can be loaded via NPM or a script tag.",
   "type": "module",
   "main": "./dist/index.cjs",

package/src/index.d.ts

@@ -1,8 +1,7 @@
 export interface CopilotChatOptions {
-  token: string;
   autoload?: boolean;
   baseUrl?: string;
 }
-
-export function loadCopilotChatWidget(options: CopilotChatOptions): unknown;
-export default loadCopilotChatWidget;
+
+export function loadCopilotChatWidget(options: CopilotChatOptions): unknown;
+export default loadCopilotChatWidget;