@vunex/support-chat 1.0.6 → 1.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/App.vue.d.ts +2 -0
  2. package/dist/components/ChatMessage.vue.d.ts +2 -0
  3. package/dist/dev.d.ts +0 -0
  4. package/dist/gig-support-chat.es.js +610 -259
  5. package/dist/gig-support-chat.umd.js +1 -1
  6. package/dist/store/supportChat.d.ts +65 -0
  7. package/dist/support-chat.css +1 -1
  8. package/package.json +4 -4
package/dist/gig-support-chat.umd.js CHANGED
@@ -1 +1 @@
1
- (function(k,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("pinia"),require("socket.io-client")):typeof define=="function"&&define.amd?define(["exports","vue","pinia","socket.io-client"],e):(k=typeof globalThis<"u"?globalThis:k||self,e(k.GigSupportChat={},k.Vue,k.Pinia,k.io))})(this,(function(k,e,I,z){"use strict";const M=I.defineStore("gigSupportChat",()=>{const t=e.ref(null),u=e.ref([]),s=e.ref(!1),d=e.ref(!1),o=e.ref(0),r=e.ref(""),l=e.ref([]),c=e.ref(!1),f=e.ref(null),a=e.ref(null),C=g=>{a.value=g},V=()=>{var g;(g=t.value)!=null&&g.connected||!a.value||(t.value=z.io(a.value.apiUrl,{path:a.value.path||"/ws",transports:["websocket","polling"],auth:{apiKey:a.value.apiKey,uuid:a.value.uuid,metaUser:a.value.metaUser}}),t.value.on("connect",()=>{console.log("[GigSupportChat] Connected"),s.value=!0}),t.value.on("connected",n=>{console.log("[GigSupportChat] Registered as:",n.userId),r.value=n.userId,E()}),t.value.on("disconnect",()=>{console.log("[GigSupportChat] Disconnected"),s.value=!1}),t.value.on("new_message",n=>{n.status==="SUCCESS"&&(u.value.find(m=>m.id===n.message.id)||(u.value.push(n.message),d.value||o.value++))}),t.value.on("message_sent",n=>{n.status==="SUCCESS"&&(u.value.find(m=>m.id===n.message.id)||u.value.push(n.message))}),t.value.on("history",n=>{n.status==="SUCCESS"&&(u.value=n.messages)}),t.value.on("error",n=>{console.error("[GigSupportChat] Socket error:",n)}))},v=()=>{t.value&&(t.value.disconnect(),t.value=null),s.value=!1,u.value=[],o.value=0,r.value=""},w=g=>{var n,m;!t.value||!s.value||(t.value.emit("send_message",{userId:r.value,text:g,replyToMessageId:(n=f.value)==null?void 0:n.id,metaUser:(m=a.value)==null?void 0:m.metaUser}),f.value=null)},E=()=>{!t.value||!r.value||t.value.emit("get_history",{userId:r.value,limit:50,offset:0})};return{messages:u,isConnected:s,isWidgetOpen:d,unreadCount:o,currentUserId:r,stickers:l,isLoadingStickers:c,replyingToMessage:f,init:C,connect:V,disconnect:v,sendMessage:w,sendSticker:g=>{var n,m;!t.value||!s.value||(t.value.emit("send_message",{userId:r.value,stickerId:g,messageType:"sticker",replyToMessageId:(n=f.value)==null?void 0:n.id,metaUser:(m=a.value)==null?void 0:m.metaUser}),f.value=null)},fetchStickers:async()=>{var g;if((g=a.value)!=null&&g.apiUrl){c.value=!0;try{const m=await(await fetch(`${a.value.apiUrl}/api/v1.0/stickers?activeOnly=true`,{headers:{"x-api-key":a.value.apiKey||""}})).json();m.status==="SUCCESS"&&(l.value=m.content)}catch(n){console.error("[GigSupportChat] Error fetching stickers:",n)}finally{c.value=!1}}},toggleWidget:()=>{d.value=!d.value,d.value&&(o.value=0)},loadHistory:E,startReply:g=>{f.value=g},cancelReply:()=>{f.value=null}}}),L=["data-message-id"],G={key:0,class:"gig-message-author"},R=["src","alt"],D=["innerHTML"],H={class:"gig-message-time"},W=((t,u)=>{const s=t.__vccOpts||t;for(const[d,o]of u)s[d]=o;return s})(e.defineComponent({__name:"ChatMessage",props:{message:{},currentUserId:{}},emits:["reply","scroll-to"],setup(t){const u=t,s=e.computed(()=>u.message.userId===u.currentUserId),d=l=>l?new Date(l).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"}):"",o=l=>{const c=l.trim().split(/\s+/);return c.length>=2?`${c[0]} ${c[1][0]}.`:l},r=l=>{if(!l)return"";const c=l.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;"),f=/(https?:\/\/[^\s]+)/g;return c.replace(f,a=>`<a href="${a}" target="_blank" style="color: inherit; text-decoration: underline;">${a}</a>`)};return(l,c)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["gig-message-row",s.value?"sent":"received"]),"data-message-id":t.message.id},[e.createElementVNode("div",{class:e.normalizeClass(["gig-message-bubble",{"is-sticker":t.message.messageType==="sticker"}])},[s.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",G,[c[1]||(c[1]=e.createElementVNode("div",{class:"gig-author-avatar"},"GP",-1)),e.createTextVNode(" "+e.toDisplayString(o(t.message.userName||"Support")),1)])),t.message.replyToMessageId?(e.openBlock(),e.createElementBlock("div",{key:1,class:"gig-message-reply-preview",onClick:c[0]||(c[0]=f=>l.$emit("scroll-to",t.message.replyToMessageId))})):e.createCommentVNode("",!0),t.message.messageType==="sticker"&&t.message.sticker?(e.openBlock(),e.createElementBlock("img",{key:2,src:`data:${t.message.sticker.mimeType||"image/png"};base64,${t.message.sticker.base64}`,class:"gig-sticker-img",alt:t.message.sticker.name},null,8,R)):(e.openBlock(),e.createElementBlock("div",{key:3,innerHTML:r(t.message.text||"")},null,8,D)),e.createElementVNode("div",H,e.toDisplayString(d(t.message.createdAt)),1)],2)],10,L))}}),[["__scopeId","data-v-ca90faac"]]),K={key:0,style:{"text-align":"center",color:"#94a3b8","padding-top":"40px"}},O={class:"gig-input-area"},X={class:"gig-input-box"},Y=["onKeydown"],P=["disabled"],_={viewBox:"0 0 24 24",width:"18",height:"18",fill:"none",stroke:"currentColor","stroke-width":"2",style:{transform:"rotate(45deg)","margin-bottom":"2px"}},j=e.defineComponent({__name:"ChatWindow",props:{messages:{},currentUserId:{}},emits:["close","send"],setup(t,{emit:u}){const s=u,d=e.ref(""),o=e.ref(null),r=e.ref(null),l=e.ref({x:32,y:112}),c=e.ref({width:440,height:600}),f=e.ref(!1),a=e.ref(null),C=e.ref(!1),V=()=>{C.value=!C.value};let v=0,w=0,E=0,N=0,x=0,S=0;const T=p=>{p.button===0&&(f.value=!0,v=p.clientX,w=p.clientY,x=l.value.x,S=l.value.y,window.addEventListener("mousemove",B),window.addEventListener("mouseup",m))},B=p=>{f.value&&(l.value={x:x-(p.clientX-v),y:S-(p.clientY-w)})},g=(p,i)=>{p.preventDefault(),a.value=i,v=p.clientX,w=p.clientY,E=c.value.width,N=c.value.height,x=l.value.x,S=l.value.y,window.addEventListener("mousemove",n),window.addEventListener("mouseup",m)},n=p=>{if(!a.value)return;const i=v-p.clientX,h=w-p.clientY;if(a.value==="left"||a.value==="corner"){const y=E+i;y>320&&y<800&&(c.value.width=y)}if(a.value==="top"||a.value==="corner"){const y=N+h;y>400&&y<900&&(c.value.height=y)}},m=()=>{f.value=!1,a.value=null,window.removeEventListener("mousemove",B),window.removeEventListener("mousemove",n)},b=()=>{d.value.trim()&&(s("send",d.value),d.value="",r.value&&(r.value.style.height="auto"),U())},Z=()=>{r.value&&(r.value.style.height="auto",r.value.style.height=Math.min(r.value.scrollHeight,120)+"px")},U=async()=>{await e.nextTick(),o.value&&(o.value.scrollTop=o.value.scrollHeight)};return e.onMounted(U),e.onUnmounted(m),(p,i)=>(e.openBlock(),e.createElementBlock("div",{class:"gig-chat-window",style:e.normalizeStyle({width:c.value.width+"px",height:c.value.height+"px",bottom:l.value.y+"px",right:l.value.x+"px",cursor:f.value?"grabbing":"auto"})},[e.createElementVNode("div",{class:"gig-resizer gig-resizer-l",onMousedown:i[0]||(i[0]=h=>g(h,"left"))},null,32),e.createElementVNode("div",{class:"gig-resizer gig-resizer-t",onMousedown:i[1]||(i[1]=h=>g(h,"top"))},null,32),e.createElementVNode("div",{class:"gig-resizer gig-resizer-tl",onMousedown:i[2]||(i[2]=h=>g(h,"corner"))},null,32),e.createElementVNode("div",{class:"gig-chat-header",onMousedown:T},[i[6]||(i[6]=e.createStaticVNode('<div class="gig-header-left"><div class="gig-header-icon"><svg viewBox="0 0 24 24" width="22" height="22" stroke="currentColor" fill="none" stroke-width="2"><path d="M3 18v-6a9 9 0 0 1 18 0v6"></path><path d="M21 19a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3zM3 19a2 2 0 0 0 2 2h1a2 2 0 0 0 2-2v-3a2 2 0 0 0-2-2H3z"></path></svg></div><div><h3 class="gig-header-title">Чат поддержки</h3><div class="gig-header-status"><div class="gig-status-dot"></div><span>Мы онлайн!</span></div></div></div>',1)),e.createElementVNode("button",{class:"gig-btn-icon",onClick:i[3]||(i[3]=e.withModifiers(h=>p.$emit("close"),["stop"])),style:{opacity:"0.8"}},[...i[5]||(i[5]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",width:"22",height:"22",stroke:"currentColor",fill:"none","stroke-width":"2.5"},[e.createElementVNode("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),e.createElementVNode("line",{x1:"6",y1:"6",x2:"18",y2:"18"})],-1)])])],32),e.createElementVNode("div",{ref_key:"messagesArea",ref:o,class:"gig-messages-area"},[t.messages.length===0?(e.openBlock(),e.createElementBlock("div",K," Здесь будет история переписки ")):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.messages,h=>(e.openBlock(),e.createBlock(W,{key:h.id,message:h,"current-user-id":t.currentUserId},null,8,["message","current-user-id"]))),128))],512),e.createElementVNode("div",O,[e.createElementVNode("div",X,[e.createElementVNode("div",{class:"gig-input-star",onClick:V},[...i[7]||(i[7]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",width:"20",height:"20",fill:"none",stroke:"currentColor","stroke-width":"2"},[e.createElementVNode("polygon",{points:"12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"})],-1)])]),e.withDirectives(e.createElementVNode("textarea",{ref_key:"textareaRef",ref:r,"onUpdate:modelValue":i[4]||(i[4]=h=>d.value=h),placeholder:"Напишите сообщение...",class:"gig-textarea",rows:"1",onKeydown:e.withKeys(e.withModifiers(b,["exact","prevent"]),["enter"]),onInput:Z},null,40,Y),[[e.vModelText,d.value]]),e.createElementVNode("button",{class:e.normalizeClass(["gig-send-btn",{active:d.value.trim()}]),disabled:!d.value.trim(),onClick:b},[(e.openBlock(),e.createElementBlock("svg",_,[...i[8]||(i[8]=[e.createElementVNode("path",{d:"M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z"},null,-1)])]))],10,P)]),i[9]||(i[9]=e.createElementVNode("div",{class:"gig-footer"},[e.createElementVNode("div",{class:"gig-footer-line"}),e.createElementVNode("span",{class:"gig-footer-text"},"Работает на GigSupport"),e.createElementVNode("div",{class:"gig-footer-line"})],-1))])],4))}}),A={class:"gig-chat-wrapper"},q={key:0,class:"gig-chat-badge"},F={key:1,viewBox:"0 0 24 24",width:"32",height:"32",fill:"none",stroke:"white","stroke-width":"2"},J={key:2,viewBox:"0 0 24 24",width:"32",height:"32",fill:"none",stroke:"white","stroke-width":"2"},$=e.defineComponent({__name:"GigSupportChat",props:{config:{}},setup(t){const u=t,s=M();return e.onMounted(()=>{s.init(u.config),s.connect()}),e.onUnmounted(()=>{s.disconnect()}),(d,o)=>(e.openBlock(),e.createElementBlock("div",A,[e.createVNode(e.Transition,{name:"gig-fade"},{default:e.withCtx(()=>[e.unref(s).isWidgetOpen?(e.openBlock(),e.createBlock(j,{key:0,messages:e.unref(s).messages,"is-connected":e.unref(s).isConnected,"current-user-id":e.unref(s).currentUserId,onSend:o[0]||(o[0]=r=>e.unref(s).sendMessage(r)),onClose:o[1]||(o[1]=r=>e.unref(s).toggleWidget())},null,8,["messages","is-connected","current-user-id"])):e.createCommentVNode("",!0)]),_:1}),e.createElementVNode("button",{class:"gig-chat-trigger",onClick:o[2]||(o[2]=r=>e.unref(s).toggleWidget())},[e.unref(s).unreadCount>0?(e.openBlock(),e.createElementBlock("div",q,e.toDisplayString(e.unref(s).unreadCount),1)):e.createCommentVNode("",!0),e.unref(s).isWidgetOpen?(e.openBlock(),e.createElementBlock("svg",J,[...o[4]||(o[4]=[e.createElementVNode("line",{x1:"18",y1:"6",x2:"6",y2:"18"},null,-1),e.createElementVNode("line",{x1:"6",y1:"6",x2:"18",y2:"18"},null,-1)])])):(e.openBlock(),e.createElementBlock("svg",F,[...o[3]||(o[3]=[e.createElementVNode("path",{d:"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"},null,-1)])]))])]))}}),Q={install:t=>{t.component("GigSupportChat",$)}};k.GigSupportChat=$,k.default=Q,k.useSupportChat=M,Object.defineProperties(k,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
1
+ (function(x,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("pinia"),require("socket.io-client")):typeof define=="function"&&define.amd?define(["exports","vue","pinia","socket.io-client"],e):(x=typeof globalThis<"u"?globalThis:x||self,e(x.GigSupportChat={},x.Vue,x.Pinia,x.io))})(this,(function(x,e,X,Y){"use strict";const T=X.defineStore("gigSupportChat",()=>{const o=e.ref(null),f=e.ref([]),r=e.ref(!1),y=e.ref(!1),a=e.ref(0),m=e.ref(""),C=e.ref([]),w=e.ref(!1),l=e.ref(null),u=e.ref(null),B=d=>{u.value=d},V=()=>{var d;(d=o.value)!=null&&d.connected||!u.value||(o.value=Y.io(u.value.apiUrl,{path:u.value.path||"/ws",transports:["websocket","polling"],auth:{apiKey:u.value.apiKey,uuid:u.value.uuid,metaUser:u.value.metaUser}}),o.value.on("connect",()=>{console.log("[GigSupportChat] Connected"),r.value=!0}),o.value.on("connected",i=>{console.log("[GigSupportChat] Registered as:",i.userId),m.value=i.userId,S()}),o.value.on("disconnect",()=>{console.log("[GigSupportChat] Disconnected"),r.value=!1}),o.value.on("new_message",i=>{var g;i.status==="SUCCESS"&&(f.value.find(E=>E.id===i.message.id)||(f.value.push(i.message),y.value?i.message.userId!==m.value&&((g=o.value)==null||g.emit("mark_read",{messageIds:[i.message.id]}),i.message.isRead=!0):i.message.userId!==m.value&&a.value++))}),o.value.on("message_sent",i=>{i.status==="SUCCESS"&&(f.value.find(g=>g.id===i.message.id)||f.value.push(i.message))}),o.value.on("history",i=>{if(i.status==="SUCCESS"&&(f.value=i.messages,!y.value)){const g=f.value.filter(E=>!E.isRead&&E.userId!==m.value);a.value=g.length}}),o.value.on("error",i=>{console.error("[GigSupportChat] Socket error:",i)}))},N=()=>{o.value&&(o.value.disconnect(),o.value=null),r.value=!1,f.value=[],a.value=0,m.value=""},M=d=>{var i,g;!o.value||!r.value||(o.value.emit("send_message",{userId:m.value,text:d,replyToMessageId:(i=l.value)==null?void 0:i.id,metaUser:(g=u.value)==null?void 0:g.metaUser}),l.value=null)},S=()=>{!o.value||!m.value||o.value.emit("get_history",{userId:m.value,limit:50,offset:0})};return{messages:f,isConnected:r,isWidgetOpen:y,unreadCount:a,currentUserId:m,stickers:C,isLoadingStickers:w,replyingToMessage:l,init:B,connect:V,disconnect:N,sendMessage:M,sendSticker:d=>{var i,g;!o.value||!r.value||(o.value.emit("send_message",{userId:m.value,stickerId:d,messageType:"sticker",replyToMessageId:(i=l.value)==null?void 0:i.id,metaUser:(g=u.value)==null?void 0:g.metaUser}),l.value=null)},fetchStickers:async()=>{var d;if((d=u.value)!=null&&d.apiUrl){w.value=!0;try{const g=await(await fetch(`${u.value.apiUrl}/api/v1.0/stickers?activeOnly=true`,{headers:{"x-api-key":u.value.apiKey||""}})).json();g.status==="SUCCESS"&&(C.value=g.content)}catch(i){console.error("[GigSupportChat] Error fetching stickers:",i)}finally{w.value=!1}}},toggleWidget:()=>{if(y.value=!y.value,y.value){a.value=0;const d=f.value.filter(i=>!i.isRead&&i.userId!==m.value);if(d.length>0&&o.value){const i=d.map(g=>g.id);o.value.emit("mark_read",{messageIds:i}),f.value.forEach(g=>{i.includes(g.id)&&(g.isRead=!0)})}}},loadHistory:S,startReply:d=>{l.value=d},cancelReply:()=>{l.value=null}}}),F=["data-message-id"],P={class:"gig-message-group"},K={key:0,class:"gig-message-author"},j={class:"gig-author-avatar"},q={style:{"font-size":"10px","font-weight":"700",opacity:"0.7","margin-bottom":"2px"}},J={style:{"font-size":"11px",opacity:"0.8","white-space":"nowrap",overflow:"hidden","text-overflow":"ellipsis","max-width":"200px"}},Q=["src","alt"],Z=["src","alt"],ee={key:1,class:"gig-message-attachment-file"},te={class:"gig-file-info"},ne=["title"],se={class:"gig-file-size"},oe=["innerHTML"],ie=["innerHTML"],le={class:"gig-message-meta-out"},re={key:0,viewBox:"0 0 24 24",width:"14",height:"14",fill:"none",stroke:"currentColor","stroke-width":"2"},ae={key:1,viewBox:"0 0 24 24",width:"14",height:"14",fill:"none",stroke:"currentColor","stroke-width":"2"},ce=((o,f)=>{const r=o.__vccOpts||o;for(const[y,a]of f)r[y]=a;return r})(e.defineComponent({__name:"ChatMessage",props:{message:{},currentUserId:{}},emits:["reply","scroll-to","open-image"],setup(o,{emit:f}){const r=o,y=T(),a=e.computed(()=>r.message.userId===r.currentUserId),m=s=>y.messages.find(t=>t.id===s),C=s=>s.userId===r.currentUserId?"Вы":S(s.userName||"Support"),w=s=>s.messageType==="sticker"?"[Стикер]":s.attachmentName||s.attachmentBase64||s.attachmentUrl||s.attachment?"[Вложение]":s.text||"",l=e.computed(()=>{const s=r.message,t=s.attachment||s.Attachment||{},h=r.message.attachmentName||t.name||t.attachmentName||t.attachment_name||"Вложение",d=r.message.attachmentMimeType||t.mimeType||t.mime_type||"application/octet-stream",i=r.message.attachmentSize||t.size||t.attachmentSize||t.attachment_size||0,g=r.message.attachmentBase64||t.base64||t.attachmentBase64||t.attachment_base64||null,E=r.message.attachmentUrl||t.url||t.attachmentUrl||t.attachment_url||null;if(h!=="Вложение"||i>0||g||E){let $=E;return g&&($=`data:${d};base64,${g}`),{name:h,mimeType:d,size:Number(i),base64:g,url:E,previewUrl:$}}return null}),u=e.computed(()=>{var s;return((s=l.value)==null?void 0:s.mimeType.startsWith("image/"))||!1}),B=()=>{if(!l.value)return;const s=l.value,t=document.createElement("a");if(t.download=s.name,s.previewUrl)t.href=s.previewUrl;else if(s.url)t.href=s.url,t.target="_blank",t.rel="noopener";else return;document.body.appendChild(t),t.click(),document.body.removeChild(t)},V=s=>{if(s===0)return"0 B";const t=1024,h=["B","KB","MB","GB"],d=Math.floor(Math.log(s)/Math.log(t));return parseFloat((s/Math.pow(t,d)).toFixed(1))+" "+h[d]},N=(s,t=22)=>{if(!s||s.length<=t)return s;const h=s.lastIndexOf(".");if(h<=0)return s.substring(0,t-3)+"...";const d=s.substring(h),i=s.substring(0,h);return i.length+d.length<=t?s:i.substring(0,t-d.length-3)+"..."+d},M=s=>s?new Date(s).toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"}):"",S=s=>{if(!s)return"Support";const t=s.trim().split(/\s+/);return t.length>=2?`${t[0]} ${t[1][0]}.`:s},I=s=>{if(s.toLowerCase()==="support")return"GP";const t=s.trim().split(/\s+/);return t.length>=2?`${t[0][0]}${t[1][0]}`.toUpperCase():t.length===1&&t[0].length>=2?t[0].substring(0,2).toUpperCase():t[0]?t[0][0].toUpperCase():"GP"},b=s=>{if(!s)return"";const t=s.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;"),h=/(https?:\/\/[^\s]+)/g;return t.replace(h,d=>`<a href="${d}" target="_blank" style="color: inherit; text-decoration: underline;">${d}</a>`)};return(s,t)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["gig-message-row",a.value?"sent":"received"]),"data-message-id":o.message.id},[e.createElementVNode("div",P,[e.createElementVNode("div",{class:e.normalizeClass(["gig-message-bubble",{"is-sticker":o.message.messageType==="sticker"}])},[a.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",K,[e.createElementVNode("div",j,e.toDisplayString(I(o.message.userName||"Support")),1),e.createTextVNode(" "+e.toDisplayString(S(o.message.userName||"Support")),1)])),o.message.replyToMessageId&&m(o.message.replyToMessageId)?(e.openBlock(),e.createElementBlock("div",{key:1,class:"gig-message-reply-preview",onClick:t[0]||(t[0]=h=>s.$emit("scroll-to",o.message.replyToMessageId))},[e.createElementVNode("div",q,e.toDisplayString(C(m(o.message.replyToMessageId))),1),e.createElementVNode("div",J,e.toDisplayString(w(m(o.message.replyToMessageId))),1)])):e.createCommentVNode("",!0),o.message.messageType==="sticker"&&o.message.sticker?(e.openBlock(),e.createElementBlock("img",{key:2,src:`data:${o.message.sticker.mimeType||"image/png"};base64,${o.message.sticker.base64}`,class:"gig-sticker-img",alt:o.message.sticker.name},null,8,Q)):l.value?(e.openBlock(),e.createElementBlock(e.Fragment,{key:3},[u.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"gig-message-attachment-image",onClick:t[1]||(t[1]=h=>s.$emit("open-image",l.value.previewUrl))},[e.createElementVNode("img",{src:l.value.previewUrl,alt:l.value.name},null,8,Z)])):(e.openBlock(),e.createElementBlock("div",ee,[t[4]||(t[4]=e.createElementVNode("div",{class:"gig-file-icon"},[e.createElementVNode("svg",{viewBox:"0 0 24 24",width:"24",height:"24",fill:"none",stroke:"currentColor","stroke-width":"2"},[e.createElementVNode("path",{d:"M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"}),e.createElementVNode("polyline",{points:"13 2 13 9 20 9"})])],-1)),e.createElementVNode("div",te,[e.createElementVNode("div",{class:"gig-file-name",title:l.value.name},e.toDisplayString(N(l.value.name)),9,ne),e.createElementVNode("div",se,e.toDisplayString(V(l.value.size)),1)]),e.createElementVNode("button",{class:"gig-btn-icon gig-file-download",onClick:B},[...t[3]||(t[3]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",width:"20",height:"20",fill:"none",stroke:"currentColor","stroke-width":"2"},[e.createElementVNode("path",{d:"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"}),e.createElementVNode("polyline",{points:"7 10 12 15 17 10"}),e.createElementVNode("line",{x1:"12",y1:"15",x2:"12",y2:"3"})],-1)])])])),o.message.text?(e.openBlock(),e.createElementBlock("div",{key:2,innerHTML:b(o.message.text),style:{"margin-top":"8px"}},null,8,oe)):e.createCommentVNode("",!0)],64)):(e.openBlock(),e.createElementBlock("div",{key:4,innerHTML:b(o.message.text||"")},null,8,ie)),e.createElementVNode("button",{class:e.normalizeClass(["gig-message-reply-btn",a.value?"left-side":"right-side"]),onClick:t[2]||(t[2]=h=>s.$emit("reply",o.message))},[...t[5]||(t[5]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",width:"14",height:"14",fill:"none",stroke:"currentColor","stroke-width":"2.5"},[e.createElementVNode("polyline",{points:"9 17 4 12 9 7"}),e.createElementVNode("path",{d:"M20 18v-2a4 4 0 0 0-4-4H4"})],-1)])],2)],2),e.createElementVNode("div",le,[e.createElementVNode("span",null,e.toDisplayString(M(o.message.createdAt)),1),a.value?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[o.message.isRead?(e.openBlock(),e.createElementBlock("svg",re,[...t[6]||(t[6]=[e.createElementVNode("polyline",{points:"18 6 11 15 7 11"},null,-1),e.createElementVNode("polyline",{points:"22 6 15 15 13 13"},null,-1)])])):(e.openBlock(),e.createElementBlock("svg",ae,[...t[7]||(t[7]=[e.createElementVNode("polyline",{points:"20 6 9 17 4 12"},null,-1)])]))],64)):e.createCommentVNode("",!0)])])],10,F))}}),[["__scopeId","data-v-85f97065"]]),de={key:0,style:{"text-align":"center",color:"#94a3b8","padding-top":"40px"}},ge={key:0,class:"gig-sticker-picker"},me={class:"gig-sticker-header"},pe={class:"gig-sticker-body"},ue={key:0,style:{"text-align":"center",color:"#94a3b8",padding:"30px"}},he={key:1,style:{"text-align":"center",color:"#94a3b8",padding:"30px"}},fe={key:2,class:"gig-sticker-grid"},ke=["onClick"],ye=["src","alt"],we={class:"gig-input-area"},Ee={key:0,class:"gig-reply-preview-container"},xe={class:"gig-reply-content"},Ve={class:"gig-reply-author"},Ne={class:"gig-reply-text"},Ce={class:"gig-input-box"},Be=["onKeydown"],ve=["disabled"],Se={viewBox:"0 0 24 24",width:"18",height:"18",fill:"none",stroke:"currentColor","stroke-width":"2",style:{transform:"rotate(45deg) translate(-1px, 2px)"}},Me=["src"],be=e.defineComponent({__name:"ChatWindow",props:{messages:{},currentUserId:{}},emits:["close","send"],setup(o,{emit:f}){const r=o,y=f,a=T(),m=e.ref(""),C=e.ref(null),w=e.ref(null),l=e.ref({x:32,y:112}),u=e.ref({width:440,height:600}),B=e.ref(!1),V=e.ref(null),N=e.ref(!1),M=()=>{N.value=!N.value,N.value&&a.stickers.length===0&&a.fetchStickers()},S=c=>{a.sendSticker(c),N.value=!1,D()},I=c=>{const n=c.trim().split(/\s+/);return n.length>=2?`${n[0]} ${n[1][0]}.`:c},b=c=>c.userId===r.currentUserId?"Вы":I(c.userName||"Support"),s=c=>c.messageType==="sticker"?"[Стикер]":c.text||"",t=c=>{const n=document.querySelector(`.gig-message-row[data-message-id="${c}"]`);n&&(n.scrollIntoView({behavior:"smooth",block:"center"}),n.classList.add("gig-highlighted"),setTimeout(()=>n.classList.remove("gig-highlighted"),1500))},h=e.ref(null),d=c=>{h.value=c},i=()=>{h.value=null};let g=0,E=0,$=0,W=0,z=0,U=0;const He=c=>{c.button===0&&(B.value=!0,g=c.clientX,E=c.clientY,z=l.value.x,U=l.value.y,window.addEventListener("mousemove",G),window.addEventListener("mouseup",H))},G=c=>{if(!B.value)return;let n=z-(c.clientX-g),p=U-(c.clientY-E);const k=window.innerWidth-u.value.width,v=window.innerHeight-u.value.height;n<0&&(n=0),n>k&&(n=k),p<0&&(p=0),p>v&&(p=v),l.value={x:n,y:p}},R=(c,n)=>{c.preventDefault(),V.value=n,g=c.clientX,E=c.clientY,$=u.value.width,W=u.value.height,z=l.value.x,U=l.value.y,window.addEventListener("mousemove",A),window.addEventListener("mouseup",H)},A=c=>{if(!V.value)return;const n=g-c.clientX,p=E-c.clientY;if(V.value==="left"||V.value==="corner"){let k=$+n;const v=window.innerWidth-l.value.x;k>v&&(k=v),k>=320&&(u.value.width=k)}if(V.value==="top"||V.value==="corner"){let k=W+p;const v=window.innerHeight-l.value.y;k>v&&(k=v),k>=400&&(u.value.height=k)}},H=()=>{B.value=!1,V.value=null,window.removeEventListener("mousemove",G),window.removeEventListener("mousemove",A)},_=()=>{const c=window.innerWidth-u.value.width,n=window.innerHeight-u.value.height;l.value.x<0&&(l.value.x=0),l.value.x>c&&c>0?l.value.x=c:l.value.x>window.innerWidth&&(l.value.x=0),l.value.y<0&&(l.value.y=0),l.value.y>n&&n>0?l.value.y=n:l.value.y>window.innerHeight&&(l.value.y=0)},O=()=>{m.value.trim()&&(y("send",m.value),m.value="",w.value&&(w.value.style.height="auto"),D())},_e=()=>{w.value&&(w.value.style.height="auto",w.value.style.height=Math.min(w.value.scrollHeight,120)+"px")},D=async()=>{await e.nextTick(),C.value&&(C.value.scrollTop=C.value.scrollHeight)};return e.onMounted(()=>{D(),window.addEventListener("resize",_),_()}),e.onUnmounted(()=>{H(),window.removeEventListener("resize",_)}),(c,n)=>(e.openBlock(),e.createElementBlock("div",{class:"gig-chat-window",style:e.normalizeStyle({width:u.value.width+"px",height:u.value.height+"px",bottom:l.value.y+"px",right:l.value.x+"px",cursor:B.value?"grabbing":"auto"})},[e.createElementVNode("div",{class:"gig-resizer gig-resizer-l",onMousedown:n[0]||(n[0]=p=>R(p,"left"))},null,32),e.createElementVNode("div",{class:"gig-resizer gig-resizer-t",onMousedown:n[1]||(n[1]=p=>R(p,"top"))},null,32),e.createElementVNode("div",{class:"gig-resizer gig-resizer-tl",onMousedown:n[2]||(n[2]=p=>R(p,"corner"))},null,32),e.createElementVNode("div",{class:"gig-chat-header",onMousedown:He},[n[10]||(n[10]=e.createStaticVNode('<div class="gig-header-left"><div class="gig-header-icon"><svg viewBox="0 0 24 24" width="22" height="22" stroke="currentColor" fill="none" stroke-width="2"><path d="M3 18v-6a9 9 0 0 1 18 0v6"></path><path d="M21 19a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3zM3 19a2 2 0 0 0 2 2h1a2 2 0 0 0 2-2v-3a2 2 0 0 0-2-2H3z"></path></svg></div><div><h3 class="gig-header-title">Чат поддержки</h3><div class="gig-header-status"><div class="gig-status-dot"></div><span>Мы онлайн!</span></div></div></div>',1)),e.createElementVNode("button",{class:"gig-btn-icon",onClick:n[3]||(n[3]=e.withModifiers(p=>c.$emit("close"),["stop"])),style:{opacity:"0.8"}},[...n[9]||(n[9]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",width:"22",height:"22",stroke:"currentColor",fill:"none","stroke-width":"2.5"},[e.createElementVNode("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),e.createElementVNode("line",{x1:"6",y1:"6",x2:"18",y2:"18"})],-1)])])],32),e.createElementVNode("div",{ref_key:"messagesArea",ref:C,class:"gig-messages-area"},[o.messages.length===0?(e.openBlock(),e.createElementBlock("div",de," Здесь будет история переписки ")):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.messages,p=>(e.openBlock(),e.createBlock(ce,{key:p.id,message:p,"current-user-id":o.currentUserId,onReply:n[4]||(n[4]=k=>e.unref(a).replyingToMessage=k),onScrollTo:t,onOpenImage:d},null,8,["message","current-user-id"]))),128))],512),e.createVNode(e.Transition,{name:"gig-fade"},{default:e.withCtx(()=>[N.value?(e.openBlock(),e.createElementBlock("div",ge,[e.createElementVNode("div",me,[n[12]||(n[12]=e.createElementVNode("span",{style:{"font-size":"11px","font-weight":"700",color:"#94a3b8","text-transform":"uppercase"}},"Выберите стикер",-1)),e.createElementVNode("button",{class:"gig-btn-icon",style:{color:"#94a3b8",width:"24px",height:"24px"},onClick:n[5]||(n[5]=p=>N.value=!1)},[...n[11]||(n[11]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",width:"20",height:"20",stroke:"currentColor",fill:"none","stroke-width":"2.5"},[e.createElementVNode("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),e.createElementVNode("line",{x1:"6",y1:"6",x2:"18",y2:"18"})],-1)])])]),e.createElementVNode("div",pe,[e.unref(a).isLoadingStickers?(e.openBlock(),e.createElementBlock("div",ue," Загрузка... ")):e.unref(a).stickers.length===0?(e.openBlock(),e.createElementBlock("div",he," Стикеры не найдены ")):(e.openBlock(),e.createElementBlock("div",fe,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(a).stickers,p=>(e.openBlock(),e.createElementBlock("div",{key:p.id,class:"gig-sticker-item",onClick:k=>S(p.id)},[e.createElementVNode("img",{src:`data:${p.mimeType||"image/png"};base64,${p.base64}`,class:"gig-sticker-thumbnail",alt:p.name},null,8,ye)],8,ke))),128))]))])])):e.createCommentVNode("",!0)]),_:1}),e.createElementVNode("div",we,[e.createVNode(e.Transition,{name:"gig-fade"},{default:e.withCtx(()=>[e.unref(a).replyingToMessage?(e.openBlock(),e.createElementBlock("div",Ee,[n[14]||(n[14]=e.createElementVNode("div",{class:"gig-reply-icon"},[e.createElementVNode("svg",{viewBox:"0 0 24 24",width:"16",height:"16",fill:"none",stroke:"var(--gig-brand-dark-green)","stroke-width":"2.5"},[e.createElementVNode("polyline",{points:"9 17 4 12 9 7"}),e.createElementVNode("path",{d:"M20 18v-2a4 4 0 0 0-4-4H4"})])],-1)),e.createElementVNode("div",xe,[e.createElementVNode("div",Ve,e.toDisplayString(b(e.unref(a).replyingToMessage)),1),e.createElementVNode("div",Ne,e.toDisplayString(s(e.unref(a).replyingToMessage)),1)]),e.createElementVNode("button",{class:"gig-btn-icon gig-reply-close",style:{color:"#94a3b8",width:"20px",height:"20px","flex-shrink":"0"},onClick:n[6]||(n[6]=p=>e.unref(a).replyingToMessage=null)},[...n[13]||(n[13]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",width:"16",height:"16",stroke:"currentColor",fill:"none","stroke-width":"2.5"},[e.createElementVNode("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),e.createElementVNode("line",{x1:"6",y1:"6",x2:"18",y2:"18"})],-1)])])])):e.createCommentVNode("",!0)]),_:1}),e.createElementVNode("div",Ce,[e.createElementVNode("div",{class:"gig-input-star",onClick:M},[...n[15]||(n[15]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",width:"20",height:"20",fill:"none",stroke:"currentColor","stroke-width":"2"},[e.createElementVNode("polygon",{points:"12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"})],-1)])]),e.withDirectives(e.createElementVNode("textarea",{ref_key:"textareaRef",ref:w,"onUpdate:modelValue":n[7]||(n[7]=p=>m.value=p),placeholder:"Напишите сообщение...",class:"gig-textarea",rows:"1",onKeydown:e.withKeys(e.withModifiers(O,["exact","prevent"]),["enter"]),onInput:_e},null,40,Be),[[e.vModelText,m.value]]),e.createElementVNode("button",{class:e.normalizeClass(["gig-send-btn",{active:m.value.trim()}]),disabled:!m.value.trim(),onClick:O},[(e.openBlock(),e.createElementBlock("svg",Se,[...n[16]||(n[16]=[e.createElementVNode("path",{d:"M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z"},null,-1)])]))],10,ve)]),n[17]||(n[17]=e.createElementVNode("div",{class:"gig-footer"},[e.createElementVNode("div",{class:"gig-footer-line"}),e.createElementVNode("span",{class:"gig-footer-text"},"Работает на GigSupport"),e.createElementVNode("div",{class:"gig-footer-line"})],-1))]),e.createVNode(e.Transition,{name:"gig-fade"},{default:e.withCtx(()=>[h.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"gig-image-viewer",onClick:i},[e.createElementVNode("button",{class:"gig-btn-icon gig-image-viewer-close",onClick:e.withModifiers(i,["stop"])},[...n[18]||(n[18]=[e.createElementVNode("svg",{viewBox:"0 0 24 24",width:"28",height:"28",stroke:"currentColor",fill:"none","stroke-width":"2"},[e.createElementVNode("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),e.createElementVNode("line",{x1:"6",y1:"6",x2:"18",y2:"18"})],-1)])]),e.createElementVNode("img",{src:h.value,alt:"Просмотр",onClick:n[8]||(n[8]=e.withModifiers(()=>{},["stop"]))},null,8,Me)])):e.createCommentVNode("",!0)]),_:1})],4))}}),$e={class:"gig-chat-wrapper"},Te={key:0,class:"gig-chat-badge"},Ie={class:"gig-trigger-icon-wrapper"},ze={key:0,class:"gig-trigger-icon",viewBox:"0 0 24 24",width:"36",height:"36",fill:"none",stroke:"white","stroke-width":"2"},Ue={key:1,class:"gig-trigger-icon",viewBox:"0 0 24 24",width:"36",height:"36",fill:"none",stroke:"white","stroke-width":"2"},L=e.defineComponent({__name:"GigSupportChat",props:{config:{}},setup(o){const f=o,r=T();return e.onMounted(()=>{r.init(f.config),r.connect()}),e.onUnmounted(()=>{r.disconnect()}),(y,a)=>(e.openBlock(),e.createElementBlock("div",$e,[e.createVNode(e.Transition,{name:"gig-popup"},{default:e.withCtx(()=>[e.unref(r).isWidgetOpen?(e.openBlock(),e.createBlock(be,{key:0,messages:e.unref(r).messages,"is-connected":e.unref(r).isConnected,"current-user-id":e.unref(r).currentUserId,onSend:a[0]||(a[0]=m=>e.unref(r).sendMessage(m)),onClose:a[1]||(a[1]=m=>e.unref(r).toggleWidget())},null,8,["messages","is-connected","current-user-id"])):e.createCommentVNode("",!0)]),_:1}),e.createElementVNode("button",{class:e.normalizeClass(["gig-chat-trigger",{"is-open":e.unref(r).isWidgetOpen}]),onClick:a[2]||(a[2]=m=>e.unref(r).toggleWidget())},[e.unref(r).unreadCount>0?(e.openBlock(),e.createElementBlock("div",Te,e.toDisplayString(e.unref(r).unreadCount),1)):e.createCommentVNode("",!0),e.createElementVNode("div",Ie,[e.createVNode(e.Transition,{name:"gig-icon-spin"},{default:e.withCtx(()=>[e.unref(r).isWidgetOpen?(e.openBlock(),e.createElementBlock("svg",Ue,[...a[4]||(a[4]=[e.createElementVNode("line",{x1:"18",y1:"6",x2:"6",y2:"18"},null,-1),e.createElementVNode("line",{x1:"6",y1:"6",x2:"18",y2:"18"},null,-1)])])):(e.openBlock(),e.createElementBlock("svg",ze,[...a[3]||(a[3]=[e.createElementVNode("path",{d:"M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"},null,-1)])]))]),_:1})])],2)]))}}),Re={install:o=>{o.component("GigSupportChat",L)}};x.GigSupportChat=L,x.default=Re,x.useSupportChat=T,Object.defineProperties(x,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
package/dist/store/supportChat.d.ts CHANGED
@@ -14,7 +14,12 @@ export interface ChatMessage {
14
14
  base64: string;
15
15
  mimeType?: string;
16
16
  };
17
+ attachmentName?: string;
17
18
  attachmentMimeType?: string;
19
+ attachmentSize?: number;
20
+ attachmentBase64?: string;
21
+ attachmentUrl?: string;
22
+ attachment?: Record<string, any>;
18
23
  replyToMessageId?: number;
19
24
  replyToMessage?: ChatMessage;
20
25
  }
@@ -48,7 +53,12 @@ export declare const useSupportChat: import('pinia').StoreDefinition<"gigSupport
48
53
  base64: string;
49
54
  mimeType?: string | undefined;
50
55
  } | undefined;
56
+ attachmentName?: string | undefined;
51
57
  attachmentMimeType?: string | undefined;
58
+ attachmentSize?: number | undefined;
59
+ attachmentBase64?: string | undefined;
60
+ attachmentUrl?: string | undefined;
61
+ attachment?: Record<string, any> | undefined;
52
62
  replyToMessageId?: number | undefined;
53
63
  replyToMessage?: /*elided*/ any | undefined;
54
64
  }[], ChatMessage[] | {
@@ -67,7 +77,12 @@ export declare const useSupportChat: import('pinia').StoreDefinition<"gigSupport
67
77
  base64: string;
68
78
  mimeType?: string | undefined;
69
79
  } | undefined;
80
+ attachmentName?: string | undefined;
70
81
  attachmentMimeType?: string | undefined;
82
+ attachmentSize?: number | undefined;
83
+ attachmentBase64?: string | undefined;
84
+ attachmentUrl?: string | undefined;
85
+ attachment?: Record<string, any> | undefined;
71
86
  replyToMessageId?: number | undefined;
72
87
  replyToMessage?: /*elided*/ any | undefined;
73
88
  }[]>;
@@ -103,7 +118,12 @@ export declare const useSupportChat: import('pinia').StoreDefinition<"gigSupport
103
118
  base64: string;
104
119
  mimeType?: string | undefined;
105
120
  } | undefined;
121
+ attachmentName?: string | undefined;
106
122
  attachmentMimeType?: string | undefined;
123
+ attachmentSize?: number | undefined;
124
+ attachmentBase64?: string | undefined;
125
+ attachmentUrl?: string | undefined;
126
+ attachment?: Record<string, any> | undefined;
107
127
  replyToMessageId?: number | undefined;
108
128
  replyToMessage?: /*elided*/ any | undefined;
109
129
  } | null, ChatMessage | {
@@ -122,7 +142,12 @@ export declare const useSupportChat: import('pinia').StoreDefinition<"gigSupport
122
142
  base64: string;
123
143
  mimeType?: string | undefined;
124
144
  } | undefined;
145
+ attachmentName?: string | undefined;
125
146
  attachmentMimeType?: string | undefined;
147
+ attachmentSize?: number | undefined;
148
+ attachmentBase64?: string | undefined;
149
+ attachmentUrl?: string | undefined;
150
+ attachment?: Record<string, any> | undefined;
126
151
  replyToMessageId?: number | undefined;
127
152
  replyToMessage?: /*elided*/ any | undefined;
128
153
  } | null>;
@@ -153,7 +178,12 @@ export declare const useSupportChat: import('pinia').StoreDefinition<"gigSupport
153
178
  base64: string;
154
179
  mimeType?: string | undefined;
155
180
  } | undefined;
181
+ attachmentName?: string | undefined;
156
182
  attachmentMimeType?: string | undefined;
183
+ attachmentSize?: number | undefined;
184
+ attachmentBase64?: string | undefined;
185
+ attachmentUrl?: string | undefined;
186
+ attachment?: Record<string, any> | undefined;
157
187
  replyToMessageId?: number | undefined;
158
188
  replyToMessage?: /*elided*/ any | undefined;
159
189
  }[], ChatMessage[] | {
@@ -172,7 +202,12 @@ export declare const useSupportChat: import('pinia').StoreDefinition<"gigSupport
172
202
  base64: string;
173
203
  mimeType?: string | undefined;
174
204
  } | undefined;
205
+ attachmentName?: string | undefined;
175
206
  attachmentMimeType?: string | undefined;
207
+ attachmentSize?: number | undefined;
208
+ attachmentBase64?: string | undefined;
209
+ attachmentUrl?: string | undefined;
210
+ attachment?: Record<string, any> | undefined;
176
211
  replyToMessageId?: number | undefined;
177
212
  replyToMessage?: /*elided*/ any | undefined;
178
213
  }[]>;
@@ -208,7 +243,12 @@ export declare const useSupportChat: import('pinia').StoreDefinition<"gigSupport
208
243
  base64: string;
209
244
  mimeType?: string | undefined;
210
245
  } | undefined;
246
+ attachmentName?: string | undefined;
211
247
  attachmentMimeType?: string | undefined;
248
+ attachmentSize?: number | undefined;
249
+ attachmentBase64?: string | undefined;
250
+ attachmentUrl?: string | undefined;
251
+ attachment?: Record<string, any> | undefined;
212
252
  replyToMessageId?: number | undefined;
213
253
  replyToMessage?: /*elided*/ any | undefined;
214
254
  } | null, ChatMessage | {
@@ -227,7 +267,12 @@ export declare const useSupportChat: import('pinia').StoreDefinition<"gigSupport
227
267
  base64: string;
228
268
  mimeType?: string | undefined;
229
269
  } | undefined;
270
+ attachmentName?: string | undefined;
230
271
  attachmentMimeType?: string | undefined;
272
+ attachmentSize?: number | undefined;
273
+ attachmentBase64?: string | undefined;
274
+ attachmentUrl?: string | undefined;
275
+ attachment?: Record<string, any> | undefined;
231
276
  replyToMessageId?: number | undefined;
232
277
  replyToMessage?: /*elided*/ any | undefined;
233
278
  } | null>;
@@ -258,7 +303,12 @@ export declare const useSupportChat: import('pinia').StoreDefinition<"gigSupport
258
303
  base64: string;
259
304
  mimeType?: string | undefined;
260
305
  } | undefined;
306
+ attachmentName?: string | undefined;
261
307
  attachmentMimeType?: string | undefined;
308
+ attachmentSize?: number | undefined;
309
+ attachmentBase64?: string | undefined;
310
+ attachmentUrl?: string | undefined;
311
+ attachment?: Record<string, any> | undefined;
262
312
  replyToMessageId?: number | undefined;
263
313
  replyToMessage?: /*elided*/ any | undefined;
264
314
  }[], ChatMessage[] | {
@@ -277,7 +327,12 @@ export declare const useSupportChat: import('pinia').StoreDefinition<"gigSupport
277
327
  base64: string;
278
328
  mimeType?: string | undefined;
279
329
  } | undefined;
330
+ attachmentName?: string | undefined;
280
331
  attachmentMimeType?: string | undefined;
332
+ attachmentSize?: number | undefined;
333
+ attachmentBase64?: string | undefined;
334
+ attachmentUrl?: string | undefined;
335
+ attachment?: Record<string, any> | undefined;
281
336
  replyToMessageId?: number | undefined;
282
337
  replyToMessage?: /*elided*/ any | undefined;
283
338
  }[]>;
@@ -313,7 +368,12 @@ export declare const useSupportChat: import('pinia').StoreDefinition<"gigSupport
313
368
  base64: string;
314
369
  mimeType?: string | undefined;
315
370
  } | undefined;
371
+ attachmentName?: string | undefined;
316
372
  attachmentMimeType?: string | undefined;
373
+ attachmentSize?: number | undefined;
374
+ attachmentBase64?: string | undefined;
375
+ attachmentUrl?: string | undefined;
376
+ attachment?: Record<string, any> | undefined;
317
377
  replyToMessageId?: number | undefined;
318
378
  replyToMessage?: /*elided*/ any | undefined;
319
379
  } | null, ChatMessage | {
@@ -332,7 +392,12 @@ export declare const useSupportChat: import('pinia').StoreDefinition<"gigSupport
332
392
  base64: string;
333
393
  mimeType?: string | undefined;
334
394
  } | undefined;
395
+ attachmentName?: string | undefined;
335
396
  attachmentMimeType?: string | undefined;
397
+ attachmentSize?: number | undefined;
398
+ attachmentBase64?: string | undefined;
399
+ attachmentUrl?: string | undefined;
400
+ attachment?: Record<string, any> | undefined;
336
401
  replyToMessageId?: number | undefined;
337
402
  replyToMessage?: /*elided*/ any | undefined;
338
403
  } | null>;
package/dist/support-chat.css CHANGED
@@ -1 +1 @@
1
- .gig-message-reply-preview[data-v-ca90faac]{margin-bottom:8px;padding:6px 10px;border-radius:8px;background:#0000000d;border-left:3px solid var(--gig-brand-dark-green);font-size:12px;cursor:pointer}:root{--gig-brand-dark-green: #002F23;--gig-brand-light-green: #9FE46D;--gig-brand-mint: #D5F5E6;--gig-brand-yellow: #FED733;--gig-brand-orange: #F54E19;--gig-brand-gradient-primary: linear-gradient(135deg, #FED733 0%, #F54E19 100%);--gig-bg-gray: #f8fafc;--gig-border-gray: #e2e8f0;--gig-text-gray: #94a3b8}.gig-chat-wrapper{font-family:Inter,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}.gig-chat-trigger{position:fixed;bottom:24px;right:24px;width:60px;height:60px;border-radius:50%;background:var(--gig-brand-dark-green);color:#fff;border:none;cursor:pointer;box-shadow:0 4px 12px #00000026;display:flex;align-items:center;justify-content:center;z-index:9997;transition:transform .2s cubic-bezier(.175,.885,.32,1.275)}.gig-chat-trigger:hover{transform:scale(1.05)}.gig-chat-window{position:fixed;z-index:9998;display:flex;flex-direction:column;overflow:hidden;border-radius:20px;border:1px solid rgba(0,0,0,.05);box-shadow:0 20px 40px #0003;background:#fff;-webkit-user-select:none;user-select:none}.gig-chat-header{background:var(--gig-brand-dark-green);padding:20px 24px;color:#fff;display:flex;justify-content:space-between;align-items:center;cursor:grab}.gig-chat-header:active{cursor:grabbing}.gig-header-left{display:flex;align-items:center;gap:12px}.gig-header-icon{width:44px;height:44px;border-radius:50%;background:#ffffff1a;display:flex;align-items:center;justify-content:center}.gig-header-title{font-size:18px;font-weight:700;margin:0}.gig-header-status{display:flex;align-items:center;gap:6px;font-size:12px;color:#4ade80;margin-top:2px}.gig-status-dot{width:8px;height:8px;background:#22c55e;border-radius:50%}.gig-messages-area{flex:1;overflow-y:auto;padding:20px;background:#fff;display:flex;flex-direction:column;gap:20px}.gig-messages-area::-webkit-scrollbar{width:5px}.gig-messages-area::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:10px}.gig-input-area{padding:16px 20px 12px;background:#fff;border-top:1px solid #f1f5f9}.gig-input-box{background:#f1f5f9;border-radius:12px;padding:10px 12px;display:flex;align-items:center;gap:12px;border:1px solid transparent;transition:all .2s}.gig-input-box:focus-within{background:#fff;border-color:#e2e8f0;box-shadow:0 4px 6px -1px #0000000d}.gig-input-star{color:#94a3b8;cursor:pointer;flex-shrink:0}.gig-input-star:hover{color:var(--gig-brand-dark-green)}.gig-textarea{flex:1;background:transparent;border:none;outline:none;font-size:14px;color:#1e293b;resize:none;padding:4px 0;font-family:inherit;width:100%}.gig-send-btn{width:36px;height:36px;border-radius:8px;border:1px solid #e2e8f0;background:#fff;color:#94a3b8;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;flex-shrink:0}.gig-send-btn.active{background:var(--gig-brand-dark-green);color:#fff;border-color:var(--gig-brand-dark-green)}.gig-send-btn:disabled{opacity:.5;cursor:not-allowed}.gig-footer{padding:8px 0 16px;display:flex;align-items:center;justify-content:center;gap:12px;opacity:.4}.gig-footer-line{height:1px;width:60px;background:#cbd5e1}.gig-footer-text{font-size:9px;font-weight:800;letter-spacing:.1em;color:#475569;text-transform:uppercase}.gig-resizer{position:absolute;z-index:9999}.gig-resizer-l{top:0;left:0;width:6px;height:100%;cursor:w-resize}.gig-resizer-t{top:0;left:0;width:100%;height:6px;cursor:n-resize}.gig-resizer-tl{top:0;left:0;width:16px;height:16px;cursor:nw-resize}.gig-message-row{display:flex;width:100%}.gig-message-row.sent{justify-content:flex-end}.gig-message-row.received{justify-content:flex-start}.gig-message-bubble{max-width:85%;border-radius:16px;position:relative;transition:all .2s;box-shadow:0 1px 3px #0000000d}.gig-message-bubble:not(.is-sticker){padding:16px;font-size:14px}.sent .gig-message-bubble:not(.is-sticker){background:var(--gig-brand-dark-green);color:#fff;border-top-right-radius:0}.received .gig-message-bubble:not(.is-sticker){background:#fff;color:#1e293b;border-top-left-radius:0;border:1px solid #f1f5f9}.gig-message-author{font-size:11px;font-weight:700;color:#64748b;margin-bottom:6px;display:flex;align-items:center;gap:8px}.gig-author-avatar{width:20px;height:20px;border-radius:50%;background:var(--gig-brand-gradient-primary);color:#fff;font-size:8px;font-weight:900;display:flex;align-items:center;justify-content:center}.gig-message-time{font-size:10px;margin-top:8px;opacity:.5;font-weight:500}.sent .gig-message-time{text-align:right;color:#86efac}.received .gig-message-time{color:#94a3b8}.is-sticker{background:transparent!important;box-shadow:none!important;border:none!important}.gig-sticker-img{max-width:180px;max-height:180px;object-fit:contain;filter:drop-shadow(0 10px 8px rgba(0,0,0,.04));transition:transform .2s}.gig-sticker-img:hover{transform:scale(1.05)}
1
+ .gig-message-reply-preview[data-v-85f97065]{margin-bottom:8px;padding:6px 10px;border-radius:8px;background:#0000000d;border-left:3px solid var(--gig-brand-dark-green);font-size:12px;cursor:pointer}.gig-message-bubble:hover .gig-message-reply-btn[data-v-85f97065]{opacity:1}.gig-message-reply-btn[data-v-85f97065]{position:absolute;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;background:#fff;border:1px solid #e2e8f0;box-shadow:0 2px 4px #0000000d;display:flex;align-items:center;justify-content:center;color:#94a3b8;opacity:0;transition:all .2s;cursor:pointer;z-index:5}.gig-message-reply-btn[data-v-85f97065]:hover{color:var(--gig-brand-dark-green);border-color:var(--gig-brand-dark-green)}.gig-message-reply-btn.left-side[data-v-85f97065]{left:-36px}.gig-message-reply-btn.right-side[data-v-85f97065]{right:-36px}:root{--gig-brand-dark-green: #3b82f6;--gig-brand-light-green: #9FE46D;--gig-brand-mint: #D5F5E6;--gig-brand-yellow: #FED733;--gig-brand-orange: #F54E19;--gig-brand-gradient-primary: linear-gradient(135deg, #FED733 0%, #F54E19 100%);--gig-bg-gray: #f8fafc;--gig-border-gray: #e2e8f0;--gig-text-gray: #94a3b8}.gig-chat-wrapper{font-family:Inter,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}.gig-chat-trigger{position:fixed;bottom:52px;right:52px;width:68px;height:68px;border-radius:50%;background:var(--gig-brand-dark-green);color:#fff;border:none;cursor:pointer;box-shadow:0 4px 12px #00000026;display:flex;align-items:center;justify-content:center;z-index:9997;transition:transform .2s cubic-bezier(.175,.885,.32,1.275)}.gig-chat-trigger:hover{transform:scale(1.05)}.gig-chat-trigger:not(.is-open):before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:50%;box-shadow:0 0 0 0 var(--gig-brand-dark-green);animation:gig-pulse-ring 2.5s infinite;z-index:-1}@keyframes gig-pulse-ring{0%{transform:scale(.95);box-shadow:0 0 #3b82f6b3}70%{transform:scale(1);box-shadow:0 0 0 20px #3b82f600}to{transform:scale(.95);box-shadow:0 0 #3b82f600}}.gig-trigger-icon-wrapper{position:relative;width:36px;height:36px;display:flex;align-items:center;justify-content:center}.gig-trigger-icon{position:absolute}.gig-icon-spin-enter-active,.gig-icon-spin-leave-active{transition:all .4s cubic-bezier(.175,.885,.32,1.275)}.gig-icon-spin-enter-from{opacity:0;transform:rotate(-180deg) scale(.5)}.gig-icon-spin-leave-to{opacity:0;transform:rotate(180deg) scale(.5)}.gig-chat-badge{position:absolute;top:-6px;right:-6px;background:#ef4444;color:#fff;font-size:14px;font-weight:800;min-width:28px;height:28px;padding:0 8px;border-radius:14px;display:flex;align-items:center;justify-content:center;border:3px solid white;box-shadow:0 4px 8px #ef444466;z-index:2;box-sizing:border-box}.gig-popup-enter-active,.gig-popup-leave-active{transition:all .4s cubic-bezier(.16,1,.3,1)}.gig-popup-enter-from,.gig-popup-leave-to{opacity:0;transform:scale(.92) translateY(15px)}.gig-fade-enter-active,.gig-fade-leave-active{transition:opacity .2s ease}.gig-fade-enter-from,.gig-fade-leave-to{opacity:0}.gig-chat-window{position:fixed;z-index:9998;display:flex;flex-direction:column;overflow:hidden;border-radius:20px;border:1px solid rgba(0,0,0,.05);box-shadow:0 20px 40px #0003;background:#fff;-webkit-user-select:none;user-select:none}.gig-chat-header{background:var(--gig-brand-dark-green);padding:20px 24px;color:#fff;display:flex;justify-content:space-between;align-items:center;cursor:grab}.gig-chat-header:active{cursor:grabbing}.gig-header-left{display:flex;align-items:center;gap:12px}.gig-header-icon{width:44px;height:44px;border-radius:50%;background:#ffffff1a;display:flex;align-items:center;justify-content:center}.gig-header-title{font-size:18px;font-weight:700;margin:0}.gig-header-status{display:flex;align-items:center;gap:6px;font-size:12px;color:#4ade80;margin-top:2px}.gig-status-dot{width:8px;height:8px;background:#22c55e;border-radius:50%}.gig-btn-icon{width:32px;height:32px;padding:0;border:none;background:transparent;color:#fff;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s}.gig-btn-icon:hover{background:#ffffff26}.gig-btn-icon:active{background:#ffffff40}.gig-messages-area{flex:1;overflow-y:auto;padding:20px;background:#fff;display:flex;flex-direction:column;gap:20px}.gig-messages-area::-webkit-scrollbar{width:5px}.gig-messages-area::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:10px}.gig-reply-preview-container{display:flex;align-items:center;gap:12px;padding:10px 14px;margin-bottom:12px;background:#f8fafc;border-radius:12px;border-left:3px solid var(--gig-brand-dark-green);position:relative;border-top:1px solid #e2e8f0;border-right:1px solid #e2e8f0;border-bottom:1px solid #e2e8f0}.gig-reply-icon{display:flex;align-items:center;justify-content:center;width:28px;height:28px;background:#3b82f60d;border-radius:50%;flex-shrink:0}.gig-reply-content{flex:1;overflow:hidden}.gig-reply-author{font-size:11px;font-weight:700;color:var(--gig-brand-dark-green);margin-bottom:2px}.gig-reply-text{font-size:12px;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gig-reply-close:hover{background:#e2e8f0;color:#64748b!important}.gig-message-row.gig-highlighted .gig-message-bubble{animation:gig-highlight-anim 1.5s ease}@keyframes gig-highlight-anim{0%,50%{filter:brightness(.8);transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}to{filter:brightness(1);transform:translateY(0);box-shadow:0 1px 3px #0000000d}}.gig-input-area{padding:16px 20px 12px;background:#fff;border-top:1px solid #f1f5f9}.gig-input-box{background:#f1f5f9;border-radius:12px;padding:10px 12px;display:flex;align-items:center;gap:12px;border:1px solid transparent;transition:all .2s}.gig-input-box:focus-within{background:#fff;border-color:#e2e8f0;box-shadow:0 4px 6px -1px #0000000d}.gig-input-star{color:#94a3b8;cursor:pointer;flex-shrink:0}.gig-input-star:hover{color:var(--gig-brand-dark-green)}.gig-textarea{flex:1;background:transparent;border:none;outline:none;font-size:14px;color:#1e293b;resize:none;padding:4px 0;font-family:inherit;width:100%}.gig-send-btn{width:36px;height:36px;border-radius:8px;border:1px solid #e2e8f0;background:#fff;color:#94a3b8;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;flex-shrink:0}.gig-send-btn.active{background:var(--gig-brand-dark-green);color:#fff;border-color:var(--gig-brand-dark-green)}.gig-send-btn:disabled{opacity:.5;cursor:not-allowed}.gig-message-attachment-image{max-width:220px;border-radius:8px;overflow:hidden;cursor:zoom-in;margin-top:4px}.gig-message-attachment-image img{width:100%;height:auto;display:block;object-fit:cover}.gig-message-attachment-file{display:flex;align-items:center;gap:12px;background:#0000000d;padding:10px 14px;border-radius:8px;margin-top:4px;max-width:220px}.gig-message-bubble.is-mine .gig-message-attachment-file{background:#ffffff26}.gig-file-icon{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:#00000014;border-radius:8px;flex-shrink:0}.gig-message-bubble.is-mine .gig-file-icon{background:#fff3}.gig-file-info{flex:1;overflow:hidden}.gig-file-name{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gig-file-size{font-size:11px;opacity:.7;margin-top:2px}.gig-file-download{width:32px;height:32px;border-radius:50%;background:transparent;color:inherit;border:none;transition:background .2s;cursor:pointer;display:flex;align-items:center;justify-content:center}.gig-file-download:hover{background:#0000001a}.gig-message-bubble.is-mine .gig-file-download:hover{background:#fff3}.gig-footer{padding:20px 0;display:flex;align-items:center;justify-content:center;gap:12px;opacity:.4}.gig-footer-line{height:1px;width:60px;background:#cbd5e1}.gig-footer-text{font-size:9px;font-weight:800;letter-spacing:.1em;color:#475569;text-transform:uppercase}.gig-resizer{position:absolute;z-index:9999}.gig-resizer-l{top:0;left:0;width:6px;height:100%;cursor:w-resize}.gig-resizer-t{top:0;left:0;width:100%;height:6px;cursor:n-resize}.gig-resizer-tl{top:0;left:0;width:16px;height:16px;cursor:nw-resize}.gig-message-row{display:flex;width:100%}.gig-message-row.sent{justify-content:flex-end}.gig-message-row.received{justify-content:flex-start}.gig-message-group{display:flex;flex-direction:column;max-width:85%;position:relative}.gig-message-row.sent .gig-message-group{align-items:flex-end}.gig-message-row.received .gig-message-group{align-items:flex-start}.gig-message-bubble{max-width:100%;border-radius:16px;position:relative;transition:all .2s;box-shadow:0 1px 3px #0000000d}.gig-message-bubble:not(.is-sticker){padding:16px;font-size:14px}.sent .gig-message-bubble:not(.is-sticker){background:var(--gig-brand-dark-green);color:#fff;border-top-right-radius:0}.received .gig-message-bubble:not(.is-sticker){background:#fff;color:#1e293b;border-top-left-radius:0;border:1px solid #f1f5f9}.gig-message-author{font-size:11px;font-weight:700;color:#64748b;margin-bottom:6px;display:flex;align-items:center;gap:8px}.gig-author-avatar{width:20px;height:20px;border-radius:50%;background:var(--gig-brand-gradient-primary);color:#fff;font-size:8px;font-weight:900;display:flex;align-items:center;justify-content:center}.gig-message-meta-out{font-size:11px;font-weight:500;color:#94a3b8;margin-top:4px;display:flex;align-items:center;gap:4px;padding:0 4px}.sent .gig-message-meta-out{color:#64748b}.received .gig-message-meta-out{color:#94a3b8}.is-sticker{background:transparent!important;box-shadow:none!important;border:none!important}.gig-sticker-img{max-width:180px;max-height:180px;object-fit:contain;filter:drop-shadow(0 10px 8px rgba(0,0,0,.04));transition:transform .2s}.gig-sticker-img:hover{transform:scale(1.05)}.gig-sticker-picker{position:absolute;bottom:90px;left:20px;right:20px;background:#fff;border-radius:16px;box-shadow:0 10px 25px #00000026;border:1px solid rgba(0,0,0,.05);z-index:10001;display:flex;flex-direction:column;max-height:240px;overflow:hidden}.gig-sticker-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid #f1f5f9}.gig-sticker-body{flex:1;overflow-y:auto;padding:16px}.gig-sticker-body::-webkit-scrollbar{width:5px}.gig-sticker-body::-webkit-scrollbar-thumb{background:#e2e8f0;border-radius:10px}.gig-sticker-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.gig-sticker-item{aspect-ratio:1;display:flex;align-items:center;justify-content:center;padding:8px;border-radius:12px;cursor:pointer;transition:all .2s}.gig-sticker-item:hover{background:#f8fafc;transform:scale(1.1)}.gig-sticker-item:active{transform:scale(.95)}.gig-sticker-thumbnail{width:100%;height:100%;object-fit:contain}.gig-image-viewer{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000d9;z-index:10000;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);cursor:zoom-out}.gig-image-viewer img{max-width:90vw;max-height:90vh;object-fit:contain;border-radius:8px;box-shadow:0 4px 24px #00000080;cursor:default}.gig-image-viewer-close{position:absolute;top:24px;right:24px;color:#fff;background:#ffffff1a;width:48px;height:48px;border-radius:50%;cursor:pointer;transition:background .2s}.gig-image-viewer-close:hover{background:#fff3}
package/package.json CHANGED
@@ -1,13 +1,13 @@
1
1
  {
2
2
  "name": "@vunex/support-chat",
3
- "version": "1.0.6",
3
+ "version": "1.0.8",
4
4
  "private": false,
5
5
  "publishConfig": {
6
6
  "access": "public"
7
7
  },
8
8
  "type": "module",
9
9
  "scripts": {
10
- "dev": "vite",
10
+ "dev": "vite --port 5170",
11
11
  "build": "vue-tsc && vite build",
12
12
  "preview": "vite preview"
13
13
  },
@@ -16,9 +16,9 @@
16
16
  "types": "./dist/index.d.ts",
17
17
  "exports": {
18
18
  ".": {
19
+ "types": "./dist/index.d.ts",
19
20
  "import": "./dist/gig-support-chat.es.js",
20
- "require": "./dist/gig-support-chat.umd.js",
21
- "types": "./dist/index.d.ts"
21
+ "require": "./dist/gig-support-chat.umd.js"
22
22
  },
23
23
  "./style.css": "./dist/support-chat.css",
24
24
  "./dist/support-chat.css": "./dist/support-chat.css"