@clivly/chat-widget 0.9.6 → 0.10.0

package/dist/browser-mount.cjs

@@ -376,7 +376,7 @@ function isSendKey(event) {
 }
 function generateId() {
 	if (typeof crypto !== "undefined" && "randomUUID" in crypto) return crypto.randomUUID();
-	return `msg_${Math.random().toString(36).slice(2, 10)}`;
+	return `msg_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 10)}`;
 }
 function mergeMessage(messages, nextMessage) {
 	const existingIndex = messages.findIndex((message) => message.id === nextMessage.id);

package/dist/browser-mount.mjs

@@ -375,7 +375,7 @@ function isSendKey(event) {
 }
 function generateId() {
 	if (typeof crypto !== "undefined" && "randomUUID" in crypto) return crypto.randomUUID();
-	return `msg_${Math.random().toString(36).slice(2, 10)}`;
+	return `msg_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 10)}`;
 }
 function mergeMessage(messages, nextMessage) {
 	const existingIndex = messages.findIndex((message) => message.id === nextMessage.id);

package/dist/browser.cjs

@@ -376,7 +376,7 @@ function isSendKey(event) {
 }
 function generateId() {
 	if (typeof crypto !== "undefined" && "randomUUID" in crypto) return crypto.randomUUID();
-	return `msg_${Math.random().toString(36).slice(2, 10)}`;
+	return `msg_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 10)}`;
 }
 function mergeMessage(messages, nextMessage) {
 	const existingIndex = messages.findIndex((message) => message.id === nextMessage.id);

package/dist/browser.mjs

@@ -375,7 +375,7 @@ function isSendKey(event) {
 }
 function generateId() {
 	if (typeof crypto !== "undefined" && "randomUUID" in crypto) return crypto.randomUUID();
-	return `msg_${Math.random().toString(36).slice(2, 10)}`;
+	return `msg_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 10)}`;
 }
 function mergeMessage(messages, nextMessage) {
 	const existingIndex = messages.findIndex((message) => message.id === nextMessage.id);

package/dist/index.cjs

@@ -376,7 +376,7 @@ function isSendKey(event) {
 }
 function generateId() {
 	if (typeof crypto !== "undefined" && "randomUUID" in crypto) return crypto.randomUUID();
-	return `msg_${Math.random().toString(36).slice(2, 10)}`;
+	return `msg_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 10)}`;
 }
 function mergeMessage(messages, nextMessage) {
 	const existingIndex = messages.findIndex((message) => message.id === nextMessage.id);

package/dist/index.mjs

@@ -375,7 +375,7 @@ function isSendKey(event) {
 }
 function generateId() {
 	if (typeof crypto !== "undefined" && "randomUUID" in crypto) return crypto.randomUUID();
-	return `msg_${Math.random().toString(36).slice(2, 10)}`;
+	return `msg_${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 10)}`;
 }
 function mergeMessage(messages, nextMessage) {
 	const existingIndex = messages.findIndex((message) => message.id === nextMessage.id);

package/dist/widget.global.js

@@ -344,7 +344,7 @@ process.env.NODE_ENV!==`production`&&(function(){function t(e){if(e==null)return
   <%s {...props} />
 React keys must be passed directly to JSX without using spread:
   let props = %s;
-  <%s key={someKey} {...props} />`,o,f,m,f),ue[f+o]=!0)}if(f=null,i!==void 0&&(r(i),f=``+i),c(n)&&(r(n.key),f=``+n.key),`key`in n)for(var h in i={},n)h!==`key`&&(i[h]=n[h]);else i=n;return f&&l(i,typeof e==`function`?e.displayName||e.name||`Unknown`:e),d(e,f,i,a(),s,u)}function p(e){m(e)?e._store&&(e._store.validated=1):typeof e==`object`&&e&&e.$$typeof===ie&&(e._payload.status===`fulfilled`?m(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function m(e){return typeof e==`object`&&!!e&&e.$$typeof===g}var h=o(),g=Symbol.for(`react.transitional.element`),_=Symbol.for(`react.portal`),v=Symbol.for(`react.fragment`),y=Symbol.for(`react.strict_mode`),b=Symbol.for(`react.profiler`),x=Symbol.for(`react.consumer`),ee=Symbol.for(`react.context`),te=Symbol.for(`react.forward_ref`),S=Symbol.for(`react.suspense`),ne=Symbol.for(`react.suspense_list`),re=Symbol.for(`react.memo`),ie=Symbol.for(`react.lazy`),C=Symbol.for(`react.activity`),ae=Symbol.for(`react.client.reference`),w=h.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,oe=Object.prototype.hasOwnProperty,se=Array.isArray,T=console.createTask?console.createTask:function(){return null};h={react_stack_bottom_frame:function(e){return e()}};var ce,le={},E=h.react_stack_bottom_frame.bind(h,s)(),D=T(i(s)),ue={};e.Fragment=v,e.jsx=function(e,t,n){var r=1e4>w.recentlyCreatedOwnerStacks++;return f(e,t,n,!1,r?Error(`react-stack-top-frame`):E,r?T(i(e)):D)},e.jsxs=function(e,t,n){var r=1e4>w.recentlyCreatedOwnerStacks++;return f(e,t,n,!0,r?Error(`react-stack-top-frame`):E,r?T(i(e)):D)}})()})),C=e(((e,t)=>{process.env.NODE_ENV===`production`?t.exports=re():t.exports=ie()}))();let ae={failed:`Failed to send`,pending:`Sending…`,sent:null},w=typeof window>`u`?void 0:window.localStorage;function oe(e){return e.contact?.name??`You`}function se(e,t){return e?e.contact?`${e.contact.name} • ${e.contact.email}`:`Verified visitor`:t}function T(e,t=`sent`){return{...e,delivery:t}}function ce(e){return`clivly-chat-widget:${e}:visitor-token`}function le(e){let t=new Date(e);return Number.isNaN(t.getTime())?``:new Intl.DateTimeFormat(void 0,{hour:`numeric`,minute:`2-digit`,month:`short`,day:`numeric`}).format(t)}function E(e){return e.key===`Enter`&&!(e.shiftKey||e.nativeEvent.isComposing)}function D(){return typeof crypto<`u`&&`randomUUID`in crypto?crypto.randomUUID():`msg_${Math.random().toString(36).slice(2,10)}`}function ue(e,t){let n=e.findIndex(e=>e.id===t.id);if(n===-1)return[...e,T(t)];let r=[...e];return r[n]=T(t),r}function de(e,t,n){return e.map(e=>e.id===t?T(n):e)}function fe(e,t){return e.map(e=>e.id===t?{...e,delivery:`failed`}:e)}function pe(e){return[...e].sort((e,t)=>e.createdAt.localeCompare(t.createdAt))}function me(e,t){return(0,p.useMemo)(()=>{let n=e?.widget.config.brandColor??null;return n?{"--clivly-chat-accent":n,...t}:t},[e?.widget.config.brandColor,t])}function he(e){let[t,n]=(0,p.useState)(()=>te(e));return(0,p.useEffect)(()=>(n(te(e)),S(e,n)),[e]),t}function ge(e,{setError:t,setIsReady:n,setMessages:r}){switch(e.type){case`conversation.snapshot`:r(pe(e.messages.map(e=>T(e))));return;case`error`:t(e.message);return;case`message.ack`:r(t=>pe(de(t,e.clientMessageId,e.message)));return;case`message.created`:{let t=e.clientMessageId;r(n=>pe(t?de(n,t,e.message):ue(n,e.message)));return}case`session.ready`:n(!0);return;default:return}}function _e({message:e}){return(0,C.jsxs)(`article`,{className:`clivly-chat-widget__message`,"data-sender":e.senderType,children:[(0,C.jsxs)(`div`,{className:`clivly-chat-widget__message-meta`,children:[(0,C.jsx)(`span`,{children:e.author??`Clivly`}),(0,C.jsx)(`span`,{children:le(e.createdAt)})]}),(0,C.jsx)(`div`,{children:e.body}),e.delivery===`sent`?null:(0,C.jsx)(`div`,{className:`clivly-chat-widget__status`,children:ae[e.delivery]})]})}function ve({greeting:e,hasSession:t,messages:n}){return t?n.length===0?(0,C.jsx)(`p`,{className:`clivly-chat-widget__empty`,children:`No messages yet. Say hello to get the conversation started.`}):(0,C.jsx)(C.Fragment,{children:n.map(e=>(0,C.jsx)(_e,{message:e},e.id))}):(0,C.jsx)(`p`,{className:`clivly-chat-widget__empty`,children:e})}function ye({className:e,createTransport:t,getSession:n,initiallyOpen:r=!1,launcherLabel:i=`Chat with us`,storage:a=w,style:o,theme:s=`auto`,widgetId:c}){let[l,u]=(0,p.useState)(r),[d,f]=(0,p.useState)(null),[m,h]=(0,p.useState)(!1),[g,_]=(0,p.useState)(!1),[v,y]=(0,p.useState)(``),[b,x]=(0,p.useState)([]),[ee,te]=(0,p.useState)(null),[S,ne]=(0,p.useState)({email:``,name:``}),re=(0,p.useRef)(null),ie=(0,p.useRef)(null),ae=me(ee,o),le=he(s);(0,p.useEffect)(()=>()=>{re.current?.close(),re.current=null},[]),(0,p.useEffect)(()=>{ie.current&&(ie.current.scrollTop=ie.current.scrollHeight)},[b]),(0,p.useEffect)(()=>{if(re.current?.close(),re.current=null,_(!1),!(ee&&t))return;let e=t({handlers:{onClose:()=>{_(!1)},onError:e=>{f(e.message)},onEvent:e=>{ge(e,{setError:f,setIsReady:_,setMessages:x})},onOpen:()=>{_(!0)}},session:ee});return re.current=e,()=>{e.close(),re.current===e&&(re.current=null)}},[t,ee]);let ue=async e=>{e.preventDefault(),f(null),h(!0);try{let e=a?.getItem(ce(c))??null,t=await n({visitor:S,visitorToken:e,widgetId:c});a?.setItem(ce(c),t.visitorToken),te(t),x(pe(t.messages.map(e=>T(e))))}catch(e){let t=e instanceof Error?e:Error(`Failed to start the conversation.`);f(t.message)}finally{h(!1)}},de=e=>{if(e?.preventDefault(),!(ee&&re.current)){f(`Chat is not connected yet.`);return}let t=v.trim();if(!t)return;let n=D(),r={author:oe(ee),body:t,createdAt:new Date().toISOString(),id:n,senderType:`visitor`};x(e=>pe([...e,T(r,`pending`)])),y(``),f(null);try{re.current.sendMessage({body:t,id:n,type:`message.create`})}catch(e){let t=e instanceof Error?e:Error(`Failed to send your message.`);x(e=>fe(e,n)),f(t.message)}},_e=ee?.widget.config.greeting??`Tell us a little about yourself and we’ll pick up the conversation from there.`,ye=ee?.widget.name??`Start a conversation`,be=se(ee,_e);return(0,C.jsxs)(`div`,{className:`clivly-chat-widget ${e??``}`.trim(),"data-clivly-theme":le,style:ae,children:[(0,C.jsx)(`style`,{children:`
+  <%s key={someKey} {...props} />`,o,f,m,f),ue[f+o]=!0)}if(f=null,i!==void 0&&(r(i),f=``+i),c(n)&&(r(n.key),f=``+n.key),`key`in n)for(var h in i={},n)h!==`key`&&(i[h]=n[h]);else i=n;return f&&l(i,typeof e==`function`?e.displayName||e.name||`Unknown`:e),d(e,f,i,a(),s,u)}function p(e){m(e)?e._store&&(e._store.validated=1):typeof e==`object`&&e&&e.$$typeof===ie&&(e._payload.status===`fulfilled`?m(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function m(e){return typeof e==`object`&&!!e&&e.$$typeof===g}var h=o(),g=Symbol.for(`react.transitional.element`),_=Symbol.for(`react.portal`),v=Symbol.for(`react.fragment`),y=Symbol.for(`react.strict_mode`),b=Symbol.for(`react.profiler`),x=Symbol.for(`react.consumer`),ee=Symbol.for(`react.context`),te=Symbol.for(`react.forward_ref`),S=Symbol.for(`react.suspense`),ne=Symbol.for(`react.suspense_list`),re=Symbol.for(`react.memo`),ie=Symbol.for(`react.lazy`),C=Symbol.for(`react.activity`),ae=Symbol.for(`react.client.reference`),w=h.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,oe=Object.prototype.hasOwnProperty,se=Array.isArray,T=console.createTask?console.createTask:function(){return null};h={react_stack_bottom_frame:function(e){return e()}};var ce,le={},E=h.react_stack_bottom_frame.bind(h,s)(),D=T(i(s)),ue={};e.Fragment=v,e.jsx=function(e,t,n){var r=1e4>w.recentlyCreatedOwnerStacks++;return f(e,t,n,!1,r?Error(`react-stack-top-frame`):E,r?T(i(e)):D)},e.jsxs=function(e,t,n){var r=1e4>w.recentlyCreatedOwnerStacks++;return f(e,t,n,!0,r?Error(`react-stack-top-frame`):E,r?T(i(e)):D)}})()})),C=e(((e,t)=>{process.env.NODE_ENV===`production`?t.exports=re():t.exports=ie()}))();let ae={failed:`Failed to send`,pending:`Sending…`,sent:null},w=typeof window>`u`?void 0:window.localStorage;function oe(e){return e.contact?.name??`You`}function se(e,t){return e?e.contact?`${e.contact.name} • ${e.contact.email}`:`Verified visitor`:t}function T(e,t=`sent`){return{...e,delivery:t}}function ce(e){return`clivly-chat-widget:${e}:visitor-token`}function le(e){let t=new Date(e);return Number.isNaN(t.getTime())?``:new Intl.DateTimeFormat(void 0,{hour:`numeric`,minute:`2-digit`,month:`short`,day:`numeric`}).format(t)}function E(e){return e.key===`Enter`&&!(e.shiftKey||e.nativeEvent.isComposing)}function D(){return typeof crypto<`u`&&`randomUUID`in crypto?crypto.randomUUID():`msg_${Date.now().toString(36)}_${Math.random().toString(36).slice(2,10)}`}function ue(e,t){let n=e.findIndex(e=>e.id===t.id);if(n===-1)return[...e,T(t)];let r=[...e];return r[n]=T(t),r}function de(e,t,n){return e.map(e=>e.id===t?T(n):e)}function fe(e,t){return e.map(e=>e.id===t?{...e,delivery:`failed`}:e)}function pe(e){return[...e].sort((e,t)=>e.createdAt.localeCompare(t.createdAt))}function me(e,t){return(0,p.useMemo)(()=>{let n=e?.widget.config.brandColor??null;return n?{"--clivly-chat-accent":n,...t}:t},[e?.widget.config.brandColor,t])}function he(e){let[t,n]=(0,p.useState)(()=>te(e));return(0,p.useEffect)(()=>(n(te(e)),S(e,n)),[e]),t}function ge(e,{setError:t,setIsReady:n,setMessages:r}){switch(e.type){case`conversation.snapshot`:r(pe(e.messages.map(e=>T(e))));return;case`error`:t(e.message);return;case`message.ack`:r(t=>pe(de(t,e.clientMessageId,e.message)));return;case`message.created`:{let t=e.clientMessageId;r(n=>pe(t?de(n,t,e.message):ue(n,e.message)));return}case`session.ready`:n(!0);return;default:return}}function _e({message:e}){return(0,C.jsxs)(`article`,{className:`clivly-chat-widget__message`,"data-sender":e.senderType,children:[(0,C.jsxs)(`div`,{className:`clivly-chat-widget__message-meta`,children:[(0,C.jsx)(`span`,{children:e.author??`Clivly`}),(0,C.jsx)(`span`,{children:le(e.createdAt)})]}),(0,C.jsx)(`div`,{children:e.body}),e.delivery===`sent`?null:(0,C.jsx)(`div`,{className:`clivly-chat-widget__status`,children:ae[e.delivery]})]})}function ve({greeting:e,hasSession:t,messages:n}){return t?n.length===0?(0,C.jsx)(`p`,{className:`clivly-chat-widget__empty`,children:`No messages yet. Say hello to get the conversation started.`}):(0,C.jsx)(C.Fragment,{children:n.map(e=>(0,C.jsx)(_e,{message:e},e.id))}):(0,C.jsx)(`p`,{className:`clivly-chat-widget__empty`,children:e})}function ye({className:e,createTransport:t,getSession:n,initiallyOpen:r=!1,launcherLabel:i=`Chat with us`,storage:a=w,style:o,theme:s=`auto`,widgetId:c}){let[l,u]=(0,p.useState)(r),[d,f]=(0,p.useState)(null),[m,h]=(0,p.useState)(!1),[g,_]=(0,p.useState)(!1),[v,y]=(0,p.useState)(``),[b,x]=(0,p.useState)([]),[ee,te]=(0,p.useState)(null),[S,ne]=(0,p.useState)({email:``,name:``}),re=(0,p.useRef)(null),ie=(0,p.useRef)(null),ae=me(ee,o),le=he(s);(0,p.useEffect)(()=>()=>{re.current?.close(),re.current=null},[]),(0,p.useEffect)(()=>{ie.current&&(ie.current.scrollTop=ie.current.scrollHeight)},[b]),(0,p.useEffect)(()=>{if(re.current?.close(),re.current=null,_(!1),!(ee&&t))return;let e=t({handlers:{onClose:()=>{_(!1)},onError:e=>{f(e.message)},onEvent:e=>{ge(e,{setError:f,setIsReady:_,setMessages:x})},onOpen:()=>{_(!0)}},session:ee});return re.current=e,()=>{e.close(),re.current===e&&(re.current=null)}},[t,ee]);let ue=async e=>{e.preventDefault(),f(null),h(!0);try{let e=a?.getItem(ce(c))??null,t=await n({visitor:S,visitorToken:e,widgetId:c});a?.setItem(ce(c),t.visitorToken),te(t),x(pe(t.messages.map(e=>T(e))))}catch(e){let t=e instanceof Error?e:Error(`Failed to start the conversation.`);f(t.message)}finally{h(!1)}},de=e=>{if(e?.preventDefault(),!(ee&&re.current)){f(`Chat is not connected yet.`);return}let t=v.trim();if(!t)return;let n=D(),r={author:oe(ee),body:t,createdAt:new Date().toISOString(),id:n,senderType:`visitor`};x(e=>pe([...e,T(r,`pending`)])),y(``),f(null);try{re.current.sendMessage({body:t,id:n,type:`message.create`})}catch(e){let t=e instanceof Error?e:Error(`Failed to send your message.`);x(e=>fe(e,n)),f(t.message)}},_e=ee?.widget.config.greeting??`Tell us a little about yourself and we’ll pick up the conversation from there.`,ye=ee?.widget.name??`Start a conversation`,be=se(ee,_e);return(0,C.jsxs)(`div`,{className:`clivly-chat-widget ${e??``}`.trim(),"data-clivly-theme":le,style:ae,children:[(0,C.jsx)(`style`,{children:`
 .clivly-chat-widget, .clivly-chat-widget * { box-sizing: border-box; }
 .clivly-chat-widget {
   --clivly-chat-accent: #185adb;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clivly/chat-widget",
-  "version": "0.9.6",
+  "version": "0.10.0",
   "private": false,
   "type": "module",
   "description": "Clivly chat widget — embeddable React and script-tag entrypoints for Clivly conversations.",