@vunex/support-chat 1.0.7 → 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 (4) hide show
  1. package/dist/gig-support-chat.es.js +297 -275
  2. package/dist/gig-support-chat.umd.js +1 -1
  3. package/dist/support-chat.css +1 -1
  4. package/package.json +1 -1
package/dist/gig-support-chat.es.js CHANGED
@@ -1,101 +1,114 @@
1
- import { ref as y, defineComponent as q, computed as j, openBlock as g, createElementBlock as c, normalizeClass as A, createElementVNode as e, toDisplayString as S, createTextVNode as re, createCommentVNode as T, Fragment as N, onMounted as ie, onUnmounted as ne, normalizeStyle as ue, createStaticVNode as ge, withModifiers as G, renderList as se, createBlock as oe, unref as w, createVNode as V, Transition as D, withCtx as _, withDirectives as de, withKeys as ce, vModelText as ve, nextTick as me } from "vue";
1
+ import { ref as w, defineComponent as q, computed as j, openBlock as c, createElementBlock as v, normalizeClass as L, createElementVNode as e, toDisplayString as T, createTextVNode as re, createCommentVNode as I, Fragment as N, onMounted as ie, onUnmounted as ne, normalizeStyle as ue, createStaticVNode as ge, withModifiers as D, renderList as se, createBlock as oe, unref as y, createVNode as _, Transition as G, withCtx as A, withDirectives as de, withKeys as ce, vModelText as ve, nextTick as me } from "vue";
2
2
  import { defineStore as he } from "pinia";
3
3
  import { io as pe } from "socket.io-client";
4
4
  const J = he("gigSupportChat", () => {
5
- const n = y(null), x = y([]), a = y(!1), b = y(!1), l = y(0), h = y(""), I = y([]), C = y(!1), o = y(null), m = y(null), U = (d) => {
6
- m.value = d;
7
- }, M = () => {
8
- var d;
9
- (d = n.value) != null && d.connected || !m.value || (n.value = pe(m.value.apiUrl, {
10
- path: m.value.path || "/ws",
5
+ const n = w(null), k = w([]), l = w(!1), C = w(!1), r = w(0), m = w(""), U = w([]), b = w(!1), a = w(null), p = w(null), z = (g) => {
6
+ p.value = g;
7
+ }, $ = () => {
8
+ var g;
9
+ (g = n.value) != null && g.connected || !p.value || (n.value = pe(p.value.apiUrl, {
10
+ path: p.value.path || "/ws",
11
11
  transports: ["websocket", "polling"],
12
12
  auth: {
13
- apiKey: m.value.apiKey,
14
- uuid: m.value.uuid,
15
- metaUser: m.value.metaUser
13
+ apiKey: p.value.apiKey,
14
+ uuid: p.value.uuid,
15
+ metaUser: p.value.metaUser
16
16
  }
17
17
  }), n.value.on("connect", () => {
18
- console.log("[GigSupportChat] Connected"), a.value = !0;
19
- }), n.value.on("connected", (u) => {
20
- console.log("[GigSupportChat] Registered as:", u.userId), h.value = u.userId, H();
18
+ console.log("[GigSupportChat] Connected"), l.value = !0;
19
+ }), n.value.on("connected", (o) => {
20
+ console.log("[GigSupportChat] Registered as:", o.userId), m.value = o.userId, R();
21
21
  }), n.value.on("disconnect", () => {
22
- console.log("[GigSupportChat] Disconnected"), a.value = !1;
23
- }), n.value.on("new_message", (u) => {
24
- u.status === "SUCCESS" && (x.value.find((p) => p.id === u.message.id) || (x.value.push(u.message), b.value || l.value++));
25
- }), n.value.on("message_sent", (u) => {
26
- u.status === "SUCCESS" && (x.value.find((p) => p.id === u.message.id) || x.value.push(u.message));
27
- }), n.value.on("history", (u) => {
28
- u.status === "SUCCESS" && (x.value = u.messages);
29
- }), n.value.on("error", (u) => {
30
- console.error("[GigSupportChat] Socket error:", u);
22
+ console.log("[GigSupportChat] Disconnected"), l.value = !1;
23
+ }), n.value.on("new_message", (o) => {
24
+ var d;
25
+ o.status === "SUCCESS" && (k.value.find((M) => M.id === o.message.id) || (k.value.push(o.message), C.value ? o.message.userId !== m.value && ((d = n.value) == null || d.emit("mark_read", { messageIds: [o.message.id] }), o.message.isRead = !0) : o.message.userId !== m.value && r.value++));
26
+ }), n.value.on("message_sent", (o) => {
27
+ o.status === "SUCCESS" && (k.value.find((d) => d.id === o.message.id) || k.value.push(o.message));
28
+ }), n.value.on("history", (o) => {
29
+ if (o.status === "SUCCESS" && (k.value = o.messages, !C.value)) {
30
+ const d = k.value.filter((M) => !M.isRead && M.userId !== m.value);
31
+ r.value = d.length;
32
+ }
33
+ }), n.value.on("error", (o) => {
34
+ console.error("[GigSupportChat] Socket error:", o);
31
35
  }));
32
- }, $ = () => {
33
- n.value && (n.value.disconnect(), n.value = null), a.value = !1, x.value = [], l.value = 0, h.value = "";
34
- }, R = (d) => {
35
- var u, p;
36
- !n.value || !a.value || (n.value.emit("send_message", {
37
- userId: h.value,
38
- text: d,
39
- replyToMessageId: (u = o.value) == null ? void 0 : u.id,
40
- metaUser: (p = m.value) == null ? void 0 : p.metaUser
41
- }), o.value = null);
42
- }, H = () => {
43
- !n.value || !h.value || n.value.emit("get_history", {
44
- userId: h.value,
36
+ }, S = () => {
37
+ n.value && (n.value.disconnect(), n.value = null), l.value = !1, k.value = [], r.value = 0, m.value = "";
38
+ }, H = (g) => {
39
+ var o, d;
40
+ !n.value || !l.value || (n.value.emit("send_message", {
41
+ userId: m.value,
42
+ text: g,
43
+ replyToMessageId: (o = a.value) == null ? void 0 : o.id,
44
+ metaUser: (d = p.value) == null ? void 0 : d.metaUser
45
+ }), a.value = null);
46
+ }, R = () => {
47
+ !n.value || !m.value || n.value.emit("get_history", {
48
+ userId: m.value,
45
49
  limit: 50,
46
50
  offset: 0
47
51
  });
48
52
  };
49
53
  return {
50
- messages: x,
51
- isConnected: a,
52
- isWidgetOpen: b,
53
- unreadCount: l,
54
- currentUserId: h,
55
- stickers: I,
56
- isLoadingStickers: C,
57
- replyingToMessage: o,
58
- init: U,
59
- connect: M,
60
- disconnect: $,
61
- sendMessage: R,
62
- sendSticker: (d) => {
63
- var u, p;
64
- !n.value || !a.value || (n.value.emit("send_message", {
65
- userId: h.value,
66
- stickerId: d,
54
+ messages: k,
55
+ isConnected: l,
56
+ isWidgetOpen: C,
57
+ unreadCount: r,
58
+ currentUserId: m,
59
+ stickers: U,
60
+ isLoadingStickers: b,
61
+ replyingToMessage: a,
62
+ init: z,
63
+ connect: $,
64
+ disconnect: S,
65
+ sendMessage: H,
66
+ sendSticker: (g) => {
67
+ var o, d;
68
+ !n.value || !l.value || (n.value.emit("send_message", {
69
+ userId: m.value,
70
+ stickerId: g,
67
71
  messageType: "sticker",
68
- replyToMessageId: (u = o.value) == null ? void 0 : u.id,
69
- metaUser: (p = m.value) == null ? void 0 : p.metaUser
70
- }), o.value = null);
72
+ replyToMessageId: (o = a.value) == null ? void 0 : o.id,
73
+ metaUser: (d = p.value) == null ? void 0 : d.metaUser
74
+ }), a.value = null);
71
75
  },
72
76
  fetchStickers: async () => {
73
- var d;
74
- if ((d = m.value) != null && d.apiUrl) {
75
- C.value = !0;
77
+ var g;
78
+ if ((g = p.value) != null && g.apiUrl) {
79
+ b.value = !0;
76
80
  try {
77
- const p = await (await fetch(`${m.value.apiUrl}/api/v1.0/stickers?activeOnly=true`, {
81
+ const d = await (await fetch(`${p.value.apiUrl}/api/v1.0/stickers?activeOnly=true`, {
78
82
  headers: {
79
- "x-api-key": m.value.apiKey || ""
83
+ "x-api-key": p.value.apiKey || ""
80
84
  }
81
85
  })).json();
82
- p.status === "SUCCESS" && (I.value = p.content);
83
- } catch (u) {
84
- console.error("[GigSupportChat] Error fetching stickers:", u);
86
+ d.status === "SUCCESS" && (U.value = d.content);
87
+ } catch (o) {
88
+ console.error("[GigSupportChat] Error fetching stickers:", o);
85
89
  } finally {
86
- C.value = !1;
90
+ b.value = !1;
87
91
  }
88
92
  }
89
93
  },
90
94
  toggleWidget: () => {
91
- b.value = !b.value, b.value && (l.value = 0);
95
+ if (C.value = !C.value, C.value) {
96
+ r.value = 0;
97
+ const g = k.value.filter((o) => !o.isRead && o.userId !== m.value);
98
+ if (g.length > 0 && n.value) {
99
+ const o = g.map((d) => d.id);
100
+ n.value.emit("mark_read", { messageIds: o }), k.value.forEach((d) => {
101
+ o.includes(d.id) && (d.isRead = !0);
102
+ });
103
+ }
104
+ }
92
105
  },
93
- loadHistory: H,
94
- startReply: (d) => {
95
- o.value = d;
106
+ loadHistory: R,
107
+ startReply: (g) => {
108
+ a.value = g;
96
109
  },
97
110
  cancelReply: () => {
98
- o.value = null;
111
+ a.value = null;
99
112
  }
100
113
  };
101
114
  }), fe = ["data-message-id"], ye = { class: "gig-message-group" }, we = {
@@ -104,7 +117,7 @@ const J = he("gigSupportChat", () => {
104
117
  }, ke = { class: "gig-author-avatar" }, xe = { style: { "font-size": "10px", "font-weight": "700", opacity: "0.7", "margin-bottom": "2px" } }, Ce = { style: { "font-size": "11px", opacity: "0.8", "white-space": "nowrap", overflow: "hidden", "text-overflow": "ellipsis", "max-width": "200px" } }, be = ["src", "alt"], Me = ["src", "alt"], $e = {
105
118
  key: 1,
106
119
  class: "gig-message-attachment-file"
107
- }, Se = { class: "gig-file-info" }, Te = ["title"], Ie = { class: "gig-file-size" }, Ue = ["innerHTML"], ze = ["innerHTML"], Be = { class: "gig-message-meta-out" }, He = {
120
+ }, Se = { class: "gig-file-info" }, Te = ["title"], Ie = { class: "gig-file-size" }, Ue = ["innerHTML"], ze = ["innerHTML"], Be = { class: "gig-message-meta-out" }, Re = {
108
121
  key: 0,
109
122
  viewBox: "0 0 24 24",
110
123
  width: "14",
@@ -112,7 +125,7 @@ const J = he("gigSupportChat", () => {
112
125
  fill: "none",
113
126
  stroke: "currentColor",
114
127
  "stroke-width": "2"
115
- }, Re = {
128
+ }, He = {
116
129
  key: 1,
117
130
  viewBox: "0 0 24 24",
118
131
  width: "14",
@@ -120,27 +133,27 @@ const J = he("gigSupportChat", () => {
120
133
  fill: "none",
121
134
  stroke: "currentColor",
122
135
  "stroke-width": "2"
123
- }, Le = /* @__PURE__ */ q({
136
+ }, We = /* @__PURE__ */ q({
124
137
  __name: "ChatMessage",
125
138
  props: {
126
139
  message: {},
127
140
  currentUserId: {}
128
141
  },
129
142
  emits: ["reply", "scroll-to", "open-image"],
130
- setup(n, { emit: x }) {
131
- const a = n, b = J(), l = j(() => a.message.userId === a.currentUserId), h = (i) => b.messages.find((t) => t.id === i), I = (i) => i.userId === a.currentUserId ? "Вы" : H(i.userName || "Support"), C = (i) => i.messageType === "sticker" ? "[Стикер]" : i.attachmentName || i.attachmentBase64 || i.attachmentUrl || i.attachment ? "[Вложение]" : i.text || "", o = j(() => {
132
- const i = a.message, t = i.attachment || i.Attachment || {}, f = a.message.attachmentName || t.name || t.attachmentName || t.attachment_name || "Вложение", d = a.message.attachmentMimeType || t.mimeType || t.mime_type || "application/octet-stream", u = a.message.attachmentSize || t.size || t.attachmentSize || t.attachment_size || 0, p = a.message.attachmentBase64 || t.base64 || t.attachmentBase64 || t.attachment_base64 || null, z = a.message.attachmentUrl || t.url || t.attachmentUrl || t.attachment_url || null;
133
- if (f !== "Вложение" || u > 0 || p || z) {
134
- let W = z;
135
- return p && (W = `data:${d};base64,${p}`), { name: f, mimeType: d, size: Number(u), base64: p, url: z, previewUrl: W };
143
+ setup(n, { emit: k }) {
144
+ const l = n, C = J(), r = j(() => l.message.userId === l.currentUserId), m = (i) => C.messages.find((t) => t.id === i), U = (i) => i.userId === l.currentUserId ? "Вы" : R(i.userName || "Support"), b = (i) => i.messageType === "sticker" ? "[Стикер]" : i.attachmentName || i.attachmentBase64 || i.attachmentUrl || i.attachment ? "[Вложение]" : i.text || "", a = j(() => {
145
+ const i = l.message, t = i.attachment || i.Attachment || {}, f = l.message.attachmentName || t.name || t.attachmentName || t.attachment_name || "Вложение", g = l.message.attachmentMimeType || t.mimeType || t.mime_type || "application/octet-stream", o = l.message.attachmentSize || t.size || t.attachmentSize || t.attachment_size || 0, d = l.message.attachmentBase64 || t.base64 || t.attachmentBase64 || t.attachment_base64 || null, M = l.message.attachmentUrl || t.url || t.attachmentUrl || t.attachment_url || null;
146
+ if (f !== "Вложение" || o > 0 || d || M) {
147
+ let E = M;
148
+ return d && (E = `data:${g};base64,${d}`), { name: f, mimeType: g, size: Number(o), base64: d, url: M, previewUrl: E };
136
149
  }
137
150
  return null;
138
- }), m = j(() => {
151
+ }), p = j(() => {
139
152
  var i;
140
- return ((i = o.value) == null ? void 0 : i.mimeType.startsWith("image/")) || !1;
141
- }), U = () => {
142
- if (!o.value) return;
143
- const i = o.value, t = document.createElement("a");
153
+ return ((i = a.value) == null ? void 0 : i.mimeType.startsWith("image/")) || !1;
154
+ }), z = () => {
155
+ if (!a.value) return;
156
+ const i = a.value, t = document.createElement("a");
144
157
  if (t.download = i.name, i.previewUrl)
145
158
  t.href = i.previewUrl;
146
159
  else if (i.url)
@@ -148,65 +161,65 @@ const J = he("gigSupportChat", () => {
148
161
  else
149
162
  return;
150
163
  document.body.appendChild(t), t.click(), document.body.removeChild(t);
151
- }, M = (i) => {
164
+ }, $ = (i) => {
152
165
  if (i === 0) return "0 B";
153
- const t = 1024, f = ["B", "KB", "MB", "GB"], d = Math.floor(Math.log(i) / Math.log(t));
154
- return parseFloat((i / Math.pow(t, d)).toFixed(1)) + " " + f[d];
155
- }, $ = (i, t = 22) => {
166
+ const t = 1024, f = ["B", "KB", "MB", "GB"], g = Math.floor(Math.log(i) / Math.log(t));
167
+ return parseFloat((i / Math.pow(t, g)).toFixed(1)) + " " + f[g];
168
+ }, S = (i, t = 22) => {
156
169
  if (!i || i.length <= t) return i;
157
170
  const f = i.lastIndexOf(".");
158
171
  if (f <= 0) return i.substring(0, t - 3) + "...";
159
- const d = i.substring(f), u = i.substring(0, f);
160
- return u.length + d.length <= t ? i : u.substring(0, t - d.length - 3) + "..." + d;
161
- }, R = (i) => i ? new Date(i).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) : "", H = (i) => {
172
+ const g = i.substring(f), o = i.substring(0, f);
173
+ return o.length + g.length <= t ? i : o.substring(0, t - g.length - 3) + "..." + g;
174
+ }, H = (i) => i ? new Date(i).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }) : "", R = (i) => {
162
175
  if (!i) return "Support";
163
176
  const t = i.trim().split(/\s+/);
164
177
  return t.length >= 2 ? `${t[0]} ${t[1][0]}.` : i;
165
- }, E = (i) => {
178
+ }, V = (i) => {
166
179
  if (i.toLowerCase() === "support") return "GP";
167
180
  const t = i.trim().split(/\s+/);
168
181
  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";
169
- }, L = (i) => {
182
+ }, W = (i) => {
170
183
  if (!i) return "";
171
184
  const t = i.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;"), f = /(https?:\/\/[^\s]+)/g;
172
- return t.replace(f, (d) => `<a href="${d}" target="_blank" style="color: inherit; text-decoration: underline;">${d}</a>`);
185
+ return t.replace(f, (g) => `<a href="${g}" target="_blank" style="color: inherit; text-decoration: underline;">${g}</a>`);
173
186
  };
174
- return (i, t) => (g(), c("div", {
175
- class: A(["gig-message-row", l.value ? "sent" : "received"]),
187
+ return (i, t) => (c(), v("div", {
188
+ class: L(["gig-message-row", r.value ? "sent" : "received"]),
176
189
  "data-message-id": n.message.id
177
190
  }, [
178
191
  e("div", ye, [
179
192
  e("div", {
180
- class: A(["gig-message-bubble", { "is-sticker": n.message.messageType === "sticker" }])
193
+ class: L(["gig-message-bubble", { "is-sticker": n.message.messageType === "sticker" }])
181
194
  }, [
182
- l.value ? T("", !0) : (g(), c("div", we, [
183
- e("div", ke, S(E(n.message.userName || "Support")), 1),
184
- re(" " + S(H(n.message.userName || "Support")), 1)
195
+ r.value ? I("", !0) : (c(), v("div", we, [
196
+ e("div", ke, T(V(n.message.userName || "Support")), 1),
197
+ re(" " + T(R(n.message.userName || "Support")), 1)
185
198
  ])),
186
- n.message.replyToMessageId && h(n.message.replyToMessageId) ? (g(), c("div", {
199
+ n.message.replyToMessageId && m(n.message.replyToMessageId) ? (c(), v("div", {
187
200
  key: 1,
188
201
  class: "gig-message-reply-preview",
189
202
  onClick: t[0] || (t[0] = (f) => i.$emit("scroll-to", n.message.replyToMessageId))
190
203
  }, [
191
- e("div", xe, S(I(h(n.message.replyToMessageId))), 1),
192
- e("div", Ce, S(C(h(n.message.replyToMessageId))), 1)
193
- ])) : T("", !0),
194
- n.message.messageType === "sticker" && n.message.sticker ? (g(), c("img", {
204
+ e("div", xe, T(U(m(n.message.replyToMessageId))), 1),
205
+ e("div", Ce, T(b(m(n.message.replyToMessageId))), 1)
206
+ ])) : I("", !0),
207
+ n.message.messageType === "sticker" && n.message.sticker ? (c(), v("img", {
195
208
  key: 2,
196
209
  src: `data:${n.message.sticker.mimeType || "image/png"};base64,${n.message.sticker.base64}`,
197
210
  class: "gig-sticker-img",
198
211
  alt: n.message.sticker.name
199
- }, null, 8, be)) : o.value ? (g(), c(N, { key: 3 }, [
200
- m.value ? (g(), c("div", {
212
+ }, null, 8, be)) : a.value ? (c(), v(N, { key: 3 }, [
213
+ p.value ? (c(), v("div", {
201
214
  key: 0,
202
215
  class: "gig-message-attachment-image",
203
- onClick: t[1] || (t[1] = (f) => i.$emit("open-image", o.value.previewUrl))
216
+ onClick: t[1] || (t[1] = (f) => i.$emit("open-image", a.value.previewUrl))
204
217
  }, [
205
218
  e("img", {
206
- src: o.value.previewUrl,
207
- alt: o.value.name
219
+ src: a.value.previewUrl,
220
+ alt: a.value.name
208
221
  }, null, 8, Me)
209
- ])) : (g(), c("div", $e, [
222
+ ])) : (c(), v("div", $e, [
210
223
  t[4] || (t[4] = e("div", { class: "gig-file-icon" }, [
211
224
  e("svg", {
212
225
  viewBox: "0 0 24 24",
@@ -223,13 +236,13 @@ const J = he("gigSupportChat", () => {
223
236
  e("div", Se, [
224
237
  e("div", {
225
238
  class: "gig-file-name",
226
- title: o.value.name
227
- }, S($(o.value.name)), 9, Te),
228
- e("div", Ie, S(M(o.value.size)), 1)
239
+ title: a.value.name
240
+ }, T(S(a.value.name)), 9, Te),
241
+ e("div", Ie, T($(a.value.size)), 1)
229
242
  ]),
230
243
  e("button", {
231
244
  class: "gig-btn-icon gig-file-download",
232
- onClick: U
245
+ onClick: z
233
246
  }, [...t[3] || (t[3] = [
234
247
  e("svg", {
235
248
  viewBox: "0 0 24 24",
@@ -250,17 +263,17 @@ const J = he("gigSupportChat", () => {
250
263
  ], -1)
251
264
  ])])
252
265
  ])),
253
- n.message.text ? (g(), c("div", {
266
+ n.message.text ? (c(), v("div", {
254
267
  key: 2,
255
- innerHTML: L(n.message.text),
268
+ innerHTML: W(n.message.text),
256
269
  style: { "margin-top": "8px" }
257
- }, null, 8, Ue)) : T("", !0)
258
- ], 64)) : (g(), c("div", {
270
+ }, null, 8, Ue)) : I("", !0)
271
+ ], 64)) : (c(), v("div", {
259
272
  key: 4,
260
- innerHTML: L(n.message.text || "")
273
+ innerHTML: W(n.message.text || "")
261
274
  }, null, 8, ze)),
262
275
  e("button", {
263
- class: A(["gig-message-reply-btn", l.value ? "left-side" : "right-side"]),
276
+ class: L(["gig-message-reply-btn", r.value ? "left-side" : "right-side"]),
264
277
  onClick: t[2] || (t[2] = (f) => i.$emit("reply", n.message))
265
278
  }, [...t[5] || (t[5] = [
266
279
  e("svg", {
@@ -277,40 +290,40 @@ const J = he("gigSupportChat", () => {
277
290
  ])], 2)
278
291
  ], 2),
279
292
  e("div", Be, [
280
- e("span", null, S(R(n.message.createdAt)), 1),
281
- l.value ? (g(), c(N, { key: 0 }, [
282
- n.message.isRead ? (g(), c("svg", He, [...t[6] || (t[6] = [
293
+ e("span", null, T(H(n.message.createdAt)), 1),
294
+ r.value ? (c(), v(N, { key: 0 }, [
295
+ n.message.isRead ? (c(), v("svg", Re, [...t[6] || (t[6] = [
283
296
  e("polyline", { points: "18 6 11 15 7 11" }, null, -1),
284
297
  e("polyline", { points: "22 6 15 15 13 13" }, null, -1)
285
- ])])) : (g(), c("svg", Re, [...t[7] || (t[7] = [
298
+ ])])) : (c(), v("svg", He, [...t[7] || (t[7] = [
286
299
  e("polyline", { points: "20 6 9 17 4 12" }, null, -1)
287
300
  ])]))
288
- ], 64)) : T("", !0)
301
+ ], 64)) : I("", !0)
289
302
  ])
290
303
  ])
291
304
  ], 10, fe));
292
305
  }
293
- }), We = (n, x) => {
294
- const a = n.__vccOpts || n;
295
- for (const [b, l] of x)
296
- a[b] = l;
297
- return a;
298
- }, Ee = /* @__PURE__ */ We(Le, [["__scopeId", "data-v-85f97065"]]), Ge = {
306
+ }), Ee = (n, k) => {
307
+ const l = n.__vccOpts || n;
308
+ for (const [C, r] of k)
309
+ l[C] = r;
310
+ return l;
311
+ }, Le = /* @__PURE__ */ Ee(We, [["__scopeId", "data-v-85f97065"]]), _e = {
299
312
  key: 0,
300
313
  style: { "text-align": "center", color: "#94a3b8", "padding-top": "40px" }
301
- }, Ae = {
314
+ }, Ge = {
302
315
  key: 0,
303
316
  class: "gig-sticker-picker"
304
- }, Ve = { class: "gig-sticker-header" }, De = { class: "gig-sticker-body" }, _e = {
317
+ }, Ae = { class: "gig-sticker-header" }, Ve = { class: "gig-sticker-body" }, De = {
305
318
  key: 0,
306
319
  style: { "text-align": "center", color: "#94a3b8", padding: "30px" }
307
320
  }, Ne = {
308
321
  key: 1,
309
322
  style: { "text-align": "center", color: "#94a3b8", padding: "30px" }
310
- }, Xe = {
323
+ }, Oe = {
311
324
  key: 2,
312
325
  class: "gig-sticker-grid"
313
- }, Ye = ["onClick"], Oe = ["src", "alt"], Ke = { class: "gig-input-area" }, Pe = {
326
+ }, Xe = ["onClick"], Ye = ["src", "alt"], Ke = { class: "gig-input-area" }, Pe = {
314
327
  key: 0,
315
328
  class: "gig-reply-preview-container"
316
329
  }, Fe = { class: "gig-reply-content" }, je = { class: "gig-reply-author" }, qe = { class: "gig-reply-text" }, Je = { class: "gig-input-box" }, Qe = ["onKeydown"], Ze = ["disabled"], et = {
@@ -328,82 +341,82 @@ const J = he("gigSupportChat", () => {
328
341
  currentUserId: {}
329
342
  },
330
343
  emits: ["close", "send"],
331
- setup(n, { emit: x }) {
332
- const a = n, b = x, l = J(), h = y(""), I = y(null), C = y(null), o = y({ x: 32, y: 112 }), m = y({ width: 440, height: 600 }), U = y(!1), M = y(null), $ = y(!1), R = () => {
333
- $.value = !$.value, $.value && l.stickers.length === 0 && l.fetchStickers();
334
- }, H = (r) => {
335
- l.sendSticker(r), $.value = !1, F();
336
- }, E = (r) => {
337
- const s = r.trim().split(/\s+/);
338
- return s.length >= 2 ? `${s[0]} ${s[1][0]}.` : r;
339
- }, L = (r) => r.userId === a.currentUserId ? "Вы" : E(r.userName || "Support"), i = (r) => r.messageType === "sticker" ? "[Стикер]" : r.text || "", t = (r) => {
340
- const s = document.querySelector(`.gig-message-row[data-message-id="${r}"]`);
344
+ setup(n, { emit: k }) {
345
+ const l = n, C = k, r = J(), m = w(""), U = w(null), b = w(null), a = w({ x: 32, y: 112 }), p = w({ width: 440, height: 600 }), z = w(!1), $ = w(null), S = w(!1), H = () => {
346
+ S.value = !S.value, S.value && r.stickers.length === 0 && r.fetchStickers();
347
+ }, R = (u) => {
348
+ r.sendSticker(u), S.value = !1, F();
349
+ }, V = (u) => {
350
+ const s = u.trim().split(/\s+/);
351
+ return s.length >= 2 ? `${s[0]} ${s[1][0]}.` : u;
352
+ }, W = (u) => u.userId === l.currentUserId ? "Вы" : V(u.userName || "Support"), i = (u) => u.messageType === "sticker" ? "[Стикер]" : u.text || "", t = (u) => {
353
+ const s = document.querySelector(`.gig-message-row[data-message-id="${u}"]`);
341
354
  s && (s.scrollIntoView({ behavior: "smooth", block: "center" }), s.classList.add("gig-highlighted"), setTimeout(() => s.classList.remove("gig-highlighted"), 1500));
342
- }, f = y(null), d = (r) => {
343
- f.value = r;
344
- }, u = () => {
355
+ }, f = w(null), g = (u) => {
356
+ f.value = u;
357
+ }, o = () => {
345
358
  f.value = null;
346
359
  };
347
- let p = 0, z = 0, W = 0, Q = 0, X = 0, Y = 0;
348
- const ae = (r) => {
349
- r.button === 0 && (U.value = !0, p = r.clientX, z = r.clientY, X = o.value.x, Y = o.value.y, window.addEventListener("mousemove", Z), window.addEventListener("mouseup", K));
350
- }, Z = (r) => {
351
- if (!U.value) return;
352
- let s = X - (r.clientX - p), v = Y - (r.clientY - z);
353
- const k = window.innerWidth - m.value.width, B = window.innerHeight - m.value.height;
354
- s < 0 && (s = 0), s > k && (s = k), v < 0 && (v = 0), v > B && (v = B), o.value = { x: s, y: v };
355
- }, O = (r, s) => {
356
- r.preventDefault(), M.value = s, p = r.clientX, z = r.clientY, W = m.value.width, Q = m.value.height, X = o.value.x, Y = o.value.y, window.addEventListener("mousemove", ee), window.addEventListener("mouseup", K);
357
- }, ee = (r) => {
358
- if (!M.value) return;
359
- const s = p - r.clientX, v = z - r.clientY;
360
- if (M.value === "left" || M.value === "corner") {
361
- let k = W + s;
362
- const B = window.innerWidth - o.value.x;
363
- k > B && (k = B), k >= 320 && (m.value.width = k);
360
+ let d = 0, M = 0, E = 0, Q = 0, O = 0, X = 0;
361
+ const ae = (u) => {
362
+ u.button === 0 && (z.value = !0, d = u.clientX, M = u.clientY, O = a.value.x, X = a.value.y, window.addEventListener("mousemove", Z), window.addEventListener("mouseup", K));
363
+ }, Z = (u) => {
364
+ if (!z.value) return;
365
+ let s = O - (u.clientX - d), h = X - (u.clientY - M);
366
+ const x = window.innerWidth - p.value.width, B = window.innerHeight - p.value.height;
367
+ s < 0 && (s = 0), s > x && (s = x), h < 0 && (h = 0), h > B && (h = B), a.value = { x: s, y: h };
368
+ }, Y = (u, s) => {
369
+ u.preventDefault(), $.value = s, d = u.clientX, M = u.clientY, E = p.value.width, Q = p.value.height, O = a.value.x, X = a.value.y, window.addEventListener("mousemove", ee), window.addEventListener("mouseup", K);
370
+ }, ee = (u) => {
371
+ if (!$.value) return;
372
+ const s = d - u.clientX, h = M - u.clientY;
373
+ if ($.value === "left" || $.value === "corner") {
374
+ let x = E + s;
375
+ const B = window.innerWidth - a.value.x;
376
+ x > B && (x = B), x >= 320 && (p.value.width = x);
364
377
  }
365
- if (M.value === "top" || M.value === "corner") {
366
- let k = Q + v;
367
- const B = window.innerHeight - o.value.y;
368
- k > B && (k = B), k >= 400 && (m.value.height = k);
378
+ if ($.value === "top" || $.value === "corner") {
379
+ let x = Q + h;
380
+ const B = window.innerHeight - a.value.y;
381
+ x > B && (x = B), x >= 400 && (p.value.height = x);
369
382
  }
370
383
  }, K = () => {
371
- U.value = !1, M.value = null, window.removeEventListener("mousemove", Z), window.removeEventListener("mousemove", ee);
384
+ z.value = !1, $.value = null, window.removeEventListener("mousemove", Z), window.removeEventListener("mousemove", ee);
372
385
  }, P = () => {
373
- const r = window.innerWidth - m.value.width, s = window.innerHeight - m.value.height;
374
- o.value.x < 0 && (o.value.x = 0), o.value.x > r && r > 0 ? o.value.x = r : o.value.x > window.innerWidth && (o.value.x = 0), o.value.y < 0 && (o.value.y = 0), o.value.y > s && s > 0 ? o.value.y = s : o.value.y > window.innerHeight && (o.value.y = 0);
386
+ const u = window.innerWidth - p.value.width, s = window.innerHeight - p.value.height;
387
+ a.value.x < 0 && (a.value.x = 0), a.value.x > u && u > 0 ? a.value.x = u : a.value.x > window.innerWidth && (a.value.x = 0), a.value.y < 0 && (a.value.y = 0), a.value.y > s && s > 0 ? a.value.y = s : a.value.y > window.innerHeight && (a.value.y = 0);
375
388
  }, te = () => {
376
- h.value.trim() && (b("send", h.value), h.value = "", C.value && (C.value.style.height = "auto"), F());
389
+ m.value.trim() && (C("send", m.value), m.value = "", b.value && (b.value.style.height = "auto"), F());
377
390
  }, le = () => {
378
- C.value && (C.value.style.height = "auto", C.value.style.height = Math.min(C.value.scrollHeight, 120) + "px");
391
+ b.value && (b.value.style.height = "auto", b.value.style.height = Math.min(b.value.scrollHeight, 120) + "px");
379
392
  }, F = async () => {
380
- await me(), I.value && (I.value.scrollTop = I.value.scrollHeight);
393
+ await me(), U.value && (U.value.scrollTop = U.value.scrollHeight);
381
394
  };
382
395
  return ie(() => {
383
396
  F(), window.addEventListener("resize", P), P();
384
397
  }), ne(() => {
385
398
  K(), window.removeEventListener("resize", P);
386
- }), (r, s) => (g(), c("div", {
399
+ }), (u, s) => (c(), v("div", {
387
400
  class: "gig-chat-window",
388
401
  style: ue({
389
- width: m.value.width + "px",
390
- height: m.value.height + "px",
391
- bottom: o.value.y + "px",
392
- right: o.value.x + "px",
393
- cursor: U.value ? "grabbing" : "auto"
402
+ width: p.value.width + "px",
403
+ height: p.value.height + "px",
404
+ bottom: a.value.y + "px",
405
+ right: a.value.x + "px",
406
+ cursor: z.value ? "grabbing" : "auto"
394
407
  })
395
408
  }, [
396
409
  e("div", {
397
410
  class: "gig-resizer gig-resizer-l",
398
- onMousedown: s[0] || (s[0] = (v) => O(v, "left"))
411
+ onMousedown: s[0] || (s[0] = (h) => Y(h, "left"))
399
412
  }, null, 32),
400
413
  e("div", {
401
414
  class: "gig-resizer gig-resizer-t",
402
- onMousedown: s[1] || (s[1] = (v) => O(v, "top"))
415
+ onMousedown: s[1] || (s[1] = (h) => Y(h, "top"))
403
416
  }, null, 32),
404
417
  e("div", {
405
418
  class: "gig-resizer gig-resizer-tl",
406
- onMousedown: s[2] || (s[2] = (v) => O(v, "corner"))
419
+ onMousedown: s[2] || (s[2] = (h) => Y(h, "corner"))
407
420
  }, null, 32),
408
421
  e("div", {
409
422
  class: "gig-chat-header",
@@ -412,7 +425,7 @@ const J = he("gigSupportChat", () => {
412
425
  s[10] || (s[10] = ge('<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)),
413
426
  e("button", {
414
427
  class: "gig-btn-icon",
415
- onClick: s[3] || (s[3] = G((v) => r.$emit("close"), ["stop"])),
428
+ onClick: s[3] || (s[3] = D((h) => u.$emit("close"), ["stop"])),
416
429
  style: { opacity: "0.8" }
417
430
  }, [...s[9] || (s[9] = [
418
431
  e("svg", {
@@ -440,28 +453,28 @@ const J = he("gigSupportChat", () => {
440
453
  ], 32),
441
454
  e("div", {
442
455
  ref_key: "messagesArea",
443
- ref: I,
456
+ ref: U,
444
457
  class: "gig-messages-area"
445
458
  }, [
446
- n.messages.length === 0 ? (g(), c("div", Ge, " Здесь будет история переписки ")) : T("", !0),
447
- (g(!0), c(N, null, se(n.messages, (v) => (g(), oe(Ee, {
448
- key: v.id,
449
- message: v,
459
+ n.messages.length === 0 ? (c(), v("div", _e, " Здесь будет история переписки ")) : I("", !0),
460
+ (c(!0), v(N, null, se(n.messages, (h) => (c(), oe(Le, {
461
+ key: h.id,
462
+ message: h,
450
463
  "current-user-id": n.currentUserId,
451
- onReply: s[4] || (s[4] = (k) => w(l).replyingToMessage = k),
464
+ onReply: s[4] || (s[4] = (x) => y(r).replyingToMessage = x),
452
465
  onScrollTo: t,
453
- onOpenImage: d
466
+ onOpenImage: g
454
467
  }, null, 8, ["message", "current-user-id"]))), 128))
455
468
  ], 512),
456
- V(D, { name: "gig-fade" }, {
457
- default: _(() => [
458
- $.value ? (g(), c("div", Ae, [
459
- e("div", Ve, [
469
+ _(G, { name: "gig-fade" }, {
470
+ default: A(() => [
471
+ S.value ? (c(), v("div", Ge, [
472
+ e("div", Ae, [
460
473
  s[12] || (s[12] = e("span", { style: { "font-size": "11px", "font-weight": "700", color: "#94a3b8", "text-transform": "uppercase" } }, "Выберите стикер", -1)),
461
474
  e("button", {
462
475
  class: "gig-btn-icon",
463
476
  style: { color: "#94a3b8", width: "24px", height: "24px" },
464
- onClick: s[5] || (s[5] = (v) => $.value = !1)
477
+ onClick: s[5] || (s[5] = (h) => S.value = !1)
465
478
  }, [...s[11] || (s[11] = [
466
479
  e("svg", {
467
480
  viewBox: "0 0 24 24",
@@ -486,29 +499,29 @@ const J = he("gigSupportChat", () => {
486
499
  ], -1)
487
500
  ])])
488
501
  ]),
489
- e("div", De, [
490
- w(l).isLoadingStickers ? (g(), c("div", _e, " Загрузка... ")) : w(l).stickers.length === 0 ? (g(), c("div", Ne, " Стикеры не найдены ")) : (g(), c("div", Xe, [
491
- (g(!0), c(N, null, se(w(l).stickers, (v) => (g(), c("div", {
492
- key: v.id,
502
+ e("div", Ve, [
503
+ y(r).isLoadingStickers ? (c(), v("div", De, " Загрузка... ")) : y(r).stickers.length === 0 ? (c(), v("div", Ne, " Стикеры не найдены ")) : (c(), v("div", Oe, [
504
+ (c(!0), v(N, null, se(y(r).stickers, (h) => (c(), v("div", {
505
+ key: h.id,
493
506
  class: "gig-sticker-item",
494
- onClick: (k) => H(v.id)
507
+ onClick: (x) => R(h.id)
495
508
  }, [
496
509
  e("img", {
497
- src: `data:${v.mimeType || "image/png"};base64,${v.base64}`,
510
+ src: `data:${h.mimeType || "image/png"};base64,${h.base64}`,
498
511
  class: "gig-sticker-thumbnail",
499
- alt: v.name
500
- }, null, 8, Oe)
501
- ], 8, Ye))), 128))
512
+ alt: h.name
513
+ }, null, 8, Ye)
514
+ ], 8, Xe))), 128))
502
515
  ]))
503
516
  ])
504
- ])) : T("", !0)
517
+ ])) : I("", !0)
505
518
  ]),
506
519
  _: 1
507
520
  }),
508
521
  e("div", Ke, [
509
- V(D, { name: "gig-fade" }, {
510
- default: _(() => [
511
- w(l).replyingToMessage ? (g(), c("div", Pe, [
522
+ _(G, { name: "gig-fade" }, {
523
+ default: A(() => [
524
+ y(r).replyingToMessage ? (c(), v("div", Pe, [
512
525
  s[14] || (s[14] = e("div", { class: "gig-reply-icon" }, [
513
526
  e("svg", {
514
527
  viewBox: "0 0 24 24",
@@ -523,13 +536,13 @@ const J = he("gigSupportChat", () => {
523
536
  ])
524
537
  ], -1)),
525
538
  e("div", Fe, [
526
- e("div", je, S(L(w(l).replyingToMessage)), 1),
527
- e("div", qe, S(i(w(l).replyingToMessage)), 1)
539
+ e("div", je, T(W(y(r).replyingToMessage)), 1),
540
+ e("div", qe, T(i(y(r).replyingToMessage)), 1)
528
541
  ]),
529
542
  e("button", {
530
543
  class: "gig-btn-icon gig-reply-close",
531
544
  style: { color: "#94a3b8", width: "20px", height: "20px", "flex-shrink": "0" },
532
- onClick: s[6] || (s[6] = (v) => w(l).replyingToMessage = null)
545
+ onClick: s[6] || (s[6] = (h) => y(r).replyingToMessage = null)
533
546
  }, [...s[13] || (s[13] = [
534
547
  e("svg", {
535
548
  viewBox: "0 0 24 24",
@@ -553,14 +566,14 @@ const J = he("gigSupportChat", () => {
553
566
  })
554
567
  ], -1)
555
568
  ])])
556
- ])) : T("", !0)
569
+ ])) : I("", !0)
557
570
  ]),
558
571
  _: 1
559
572
  }),
560
573
  e("div", Je, [
561
574
  e("div", {
562
575
  class: "gig-input-star",
563
- onClick: R
576
+ onClick: H
564
577
  }, [...s[15] || (s[15] = [
565
578
  e("svg", {
566
579
  viewBox: "0 0 24 24",
@@ -575,22 +588,22 @@ const J = he("gigSupportChat", () => {
575
588
  ])]),
576
589
  de(e("textarea", {
577
590
  ref_key: "textareaRef",
578
- ref: C,
579
- "onUpdate:modelValue": s[7] || (s[7] = (v) => h.value = v),
591
+ ref: b,
592
+ "onUpdate:modelValue": s[7] || (s[7] = (h) => m.value = h),
580
593
  placeholder: "Напишите сообщение...",
581
594
  class: "gig-textarea",
582
595
  rows: "1",
583
- onKeydown: ce(G(te, ["exact", "prevent"]), ["enter"]),
596
+ onKeydown: ce(D(te, ["exact", "prevent"]), ["enter"]),
584
597
  onInput: le
585
598
  }, null, 40, Qe), [
586
- [ve, h.value]
599
+ [ve, m.value]
587
600
  ]),
588
601
  e("button", {
589
- class: A(["gig-send-btn", { active: h.value.trim() }]),
590
- disabled: !h.value.trim(),
602
+ class: L(["gig-send-btn", { active: m.value.trim() }]),
603
+ disabled: !m.value.trim(),
591
604
  onClick: te
592
605
  }, [
593
- (g(), c("svg", et, [...s[16] || (s[16] = [
606
+ (c(), v("svg", et, [...s[16] || (s[16] = [
594
607
  e("path", { d: "M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z" }, null, -1)
595
608
  ])]))
596
609
  ], 10, Ze)
@@ -601,16 +614,16 @@ const J = he("gigSupportChat", () => {
601
614
  e("div", { class: "gig-footer-line" })
602
615
  ], -1))
603
616
  ]),
604
- V(D, { name: "gig-fade" }, {
605
- default: _(() => [
606
- f.value ? (g(), c("div", {
617
+ _(G, { name: "gig-fade" }, {
618
+ default: A(() => [
619
+ f.value ? (c(), v("div", {
607
620
  key: 0,
608
621
  class: "gig-image-viewer",
609
- onClick: u
622
+ onClick: o
610
623
  }, [
611
624
  e("button", {
612
625
  class: "gig-btn-icon gig-image-viewer-close",
613
- onClick: G(u, ["stop"])
626
+ onClick: D(o, ["stop"])
614
627
  }, [...s[18] || (s[18] = [
615
628
  e("svg", {
616
629
  viewBox: "0 0 24 24",
@@ -637,10 +650,10 @@ const J = he("gigSupportChat", () => {
637
650
  e("img", {
638
651
  src: f.value,
639
652
  alt: "Просмотр",
640
- onClick: s[8] || (s[8] = G(() => {
653
+ onClick: s[8] || (s[8] = D(() => {
641
654
  }, ["stop"]))
642
655
  }, null, 8, tt)
643
- ])) : T("", !0)
656
+ ])) : I("", !0)
644
657
  ]),
645
658
  _: 1
646
659
  })
@@ -649,78 +662,87 @@ const J = he("gigSupportChat", () => {
649
662
  }), it = { class: "gig-chat-wrapper" }, nt = {
650
663
  key: 0,
651
664
  class: "gig-chat-badge"
652
- }, ot = {
653
- key: 1,
665
+ }, ot = { class: "gig-trigger-icon-wrapper" }, at = {
666
+ key: 0,
667
+ class: "gig-trigger-icon",
654
668
  viewBox: "0 0 24 24",
655
- width: "32",
656
- height: "32",
669
+ width: "36",
670
+ height: "36",
657
671
  fill: "none",
658
672
  stroke: "white",
659
673
  "stroke-width": "2"
660
- }, at = {
661
- key: 2,
674
+ }, lt = {
675
+ key: 1,
676
+ class: "gig-trigger-icon",
662
677
  viewBox: "0 0 24 24",
663
- width: "32",
664
- height: "32",
678
+ width: "36",
679
+ height: "36",
665
680
  fill: "none",
666
681
  stroke: "white",
667
682
  "stroke-width": "2"
668
- }, lt = /* @__PURE__ */ q({
683
+ }, rt = /* @__PURE__ */ q({
669
684
  __name: "GigSupportChat",
670
685
  props: {
671
686
  config: {}
672
687
  },
673
688
  setup(n) {
674
- const x = n, a = J();
689
+ const k = n, l = J();
675
690
  return ie(() => {
676
- a.init(x.config), a.connect();
691
+ l.init(k.config), l.connect();
677
692
  }), ne(() => {
678
- a.disconnect();
679
- }), (b, l) => (g(), c("div", it, [
680
- V(D, { name: "gig-fade" }, {
681
- default: _(() => [
682
- w(a).isWidgetOpen ? (g(), oe(st, {
693
+ l.disconnect();
694
+ }), (C, r) => (c(), v("div", it, [
695
+ _(G, { name: "gig-popup" }, {
696
+ default: A(() => [
697
+ y(l).isWidgetOpen ? (c(), oe(st, {
683
698
  key: 0,
684
- messages: w(a).messages,
685
- "is-connected": w(a).isConnected,
686
- "current-user-id": w(a).currentUserId,
687
- onSend: l[0] || (l[0] = (h) => w(a).sendMessage(h)),
688
- onClose: l[1] || (l[1] = (h) => w(a).toggleWidget())
689
- }, null, 8, ["messages", "is-connected", "current-user-id"])) : T("", !0)
699
+ messages: y(l).messages,
700
+ "is-connected": y(l).isConnected,
701
+ "current-user-id": y(l).currentUserId,
702
+ onSend: r[0] || (r[0] = (m) => y(l).sendMessage(m)),
703
+ onClose: r[1] || (r[1] = (m) => y(l).toggleWidget())
704
+ }, null, 8, ["messages", "is-connected", "current-user-id"])) : I("", !0)
690
705
  ]),
691
706
  _: 1
692
707
  }),
693
708
  e("button", {
694
- class: "gig-chat-trigger",
695
- onClick: l[2] || (l[2] = (h) => w(a).toggleWidget())
709
+ class: L(["gig-chat-trigger", { "is-open": y(l).isWidgetOpen }]),
710
+ onClick: r[2] || (r[2] = (m) => y(l).toggleWidget())
696
711
  }, [
697
- w(a).unreadCount > 0 ? (g(), c("div", nt, S(w(a).unreadCount), 1)) : T("", !0),
698
- w(a).isWidgetOpen ? (g(), c("svg", at, [...l[4] || (l[4] = [
699
- e("line", {
700
- x1: "18",
701
- y1: "6",
702
- x2: "6",
703
- y2: "18"
704
- }, null, -1),
705
- e("line", {
706
- x1: "6",
707
- y1: "6",
708
- x2: "18",
709
- y2: "18"
710
- }, null, -1)
711
- ])])) : (g(), c("svg", ot, [...l[3] || (l[3] = [
712
- e("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)
713
- ])]))
714
- ])
712
+ y(l).unreadCount > 0 ? (c(), v("div", nt, T(y(l).unreadCount), 1)) : I("", !0),
713
+ e("div", ot, [
714
+ _(G, { name: "gig-icon-spin" }, {
715
+ default: A(() => [
716
+ y(l).isWidgetOpen ? (c(), v("svg", lt, [...r[4] || (r[4] = [
717
+ e("line", {
718
+ x1: "18",
719
+ y1: "6",
720
+ x2: "6",
721
+ y2: "18"
722
+ }, null, -1),
723
+ e("line", {
724
+ x1: "6",
725
+ y1: "6",
726
+ x2: "18",
727
+ y2: "18"
728
+ }, null, -1)
729
+ ])])) : (c(), v("svg", at, [...r[3] || (r[3] = [
730
+ e("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)
731
+ ])]))
732
+ ]),
733
+ _: 1
734
+ })
735
+ ])
736
+ ], 2)
715
737
  ]));
716
738
  }
717
- }), dt = {
739
+ }), ct = {
718
740
  install: (n) => {
719
- n.component("GigSupportChat", lt);
741
+ n.component("GigSupportChat", rt);
720
742
  }
721
743
  };
722
744
  export {
723
- lt as GigSupportChat,
724
- dt as default,
745
+ rt as GigSupportChat,
746
+ ct as default,
725
747
  J as useSupportChat
726
748
  };
package/dist/gig-support-chat.umd.js CHANGED
@@ -1 +1 @@
1
- (function(E,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):(E=typeof globalThis<"u"?globalThis:E||self,e(E.GigSupportChat={},E.Vue,E.Pinia,E.io))})(this,(function(E,e,X,Y){"use strict";const T=X.defineStore("gigSupportChat",()=>{const o=e.ref(null),k=e.ref([]),l=e.ref(!1),w=e.ref(!1),r=e.ref(0),p=e.ref(""),N=e.ref([]),y=e.ref(!1),i=e.ref(null),m=e.ref(null),B=d=>{m.value=d},x=()=>{var d;(d=o.value)!=null&&d.connected||!m.value||(o.value=Y.io(m.value.apiUrl,{path:m.value.path||"/ws",transports:["websocket","polling"],auth:{apiKey:m.value.apiKey,uuid:m.value.uuid,metaUser:m.value.metaUser}}),o.value.on("connect",()=>{console.log("[GigSupportChat] Connected"),l.value=!0}),o.value.on("connected",c=>{console.log("[GigSupportChat] Registered as:",c.userId),p.value=c.userId,S()}),o.value.on("disconnect",()=>{console.log("[GigSupportChat] Disconnected"),l.value=!1}),o.value.on("new_message",c=>{c.status==="SUCCESS"&&(k.value.find(h=>h.id===c.message.id)||(k.value.push(c.message),w.value||r.value++))}),o.value.on("message_sent",c=>{c.status==="SUCCESS"&&(k.value.find(h=>h.id===c.message.id)||k.value.push(c.message))}),o.value.on("history",c=>{c.status==="SUCCESS"&&(k.value=c.messages)}),o.value.on("error",c=>{console.error("[GigSupportChat] Socket error:",c)}))},V=()=>{o.value&&(o.value.disconnect(),o.value=null),l.value=!1,k.value=[],r.value=0,p.value=""},M=d=>{var c,h;!o.value||!l.value||(o.value.emit("send_message",{userId:p.value,text:d,replyToMessageId:(c=i.value)==null?void 0:c.id,metaUser:(h=m.value)==null?void 0:h.metaUser}),i.value=null)},S=()=>{!o.value||!p.value||o.value.emit("get_history",{userId:p.value,limit:50,offset:0})};return{messages:k,isConnected:l,isWidgetOpen:w,unreadCount:r,currentUserId:p,stickers:N,isLoadingStickers:y,replyingToMessage:i,init:B,connect:x,disconnect:V,sendMessage:M,sendSticker:d=>{var c,h;!o.value||!l.value||(o.value.emit("send_message",{userId:p.value,stickerId:d,messageType:"sticker",replyToMessageId:(c=i.value)==null?void 0:c.id,metaUser:(h=m.value)==null?void 0:h.metaUser}),i.value=null)},fetchStickers:async()=>{var d;if((d=m.value)!=null&&d.apiUrl){y.value=!0;try{const h=await(await fetch(`${m.value.apiUrl}/api/v1.0/stickers?activeOnly=true`,{headers:{"x-api-key":m.value.apiKey||""}})).json();h.status==="SUCCESS"&&(N.value=h.content)}catch(c){console.error("[GigSupportChat] Error fetching stickers:",c)}finally{y.value=!1}}},toggleWidget:()=>{w.value=!w.value,w.value&&(r.value=0)},loadHistory:S,startReply:d=>{i.value=d},cancelReply:()=>{i.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,k)=>{const l=o.__vccOpts||o;for(const[w,r]of k)l[w]=r;return l})(e.defineComponent({__name:"ChatMessage",props:{message:{},currentUserId:{}},emits:["reply","scroll-to","open-image"],setup(o,{emit:k}){const l=o,w=T(),r=e.computed(()=>l.message.userId===l.currentUserId),p=s=>w.messages.find(t=>t.id===s),N=s=>s.userId===l.currentUserId?"Вы":S(s.userName||"Support"),y=s=>s.messageType==="sticker"?"[Стикер]":s.attachmentName||s.attachmentBase64||s.attachmentUrl||s.attachment?"[Вложение]":s.text||"",i=e.computed(()=>{const s=l.message,t=s.attachment||s.Attachment||{},u=l.message.attachmentName||t.name||t.attachmentName||t.attachment_name||"Вложение",d=l.message.attachmentMimeType||t.mimeType||t.mime_type||"application/octet-stream",c=l.message.attachmentSize||t.size||t.attachmentSize||t.attachment_size||0,h=l.message.attachmentBase64||t.base64||t.attachmentBase64||t.attachment_base64||null,C=l.message.attachmentUrl||t.url||t.attachmentUrl||t.attachment_url||null;if(u!=="Вложение"||c>0||h||C){let $=C;return h&&($=`data:${d};base64,${h}`),{name:u,mimeType:d,size:Number(c),base64:h,url:C,previewUrl:$}}return null}),m=e.computed(()=>{var s;return((s=i.value)==null?void 0:s.mimeType.startsWith("image/"))||!1}),B=()=>{if(!i.value)return;const s=i.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)},x=s=>{if(s===0)return"0 B";const t=1024,u=["B","KB","MB","GB"],d=Math.floor(Math.log(s)/Math.log(t));return parseFloat((s/Math.pow(t,d)).toFixed(1))+" "+u[d]},V=(s,t=22)=>{if(!s||s.length<=t)return s;const u=s.lastIndexOf(".");if(u<=0)return s.substring(0,t-3)+"...";const d=s.substring(u),c=s.substring(0,u);return c.length+d.length<=t?s:c.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},U=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;"),u=/(https?:\/\/[^\s]+)/g;return t.replace(u,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",r.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"}])},[r.value?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",K,[e.createElementVNode("div",j,e.toDisplayString(U(o.message.userName||"Support")),1),e.createTextVNode(" "+e.toDisplayString(S(o.message.userName||"Support")),1)])),o.message.replyToMessageId&&p(o.message.replyToMessageId)?(e.openBlock(),e.createElementBlock("div",{key:1,class:"gig-message-reply-preview",onClick:t[0]||(t[0]=u=>s.$emit("scroll-to",o.message.replyToMessageId))},[e.createElementVNode("div",q,e.toDisplayString(N(p(o.message.replyToMessageId))),1),e.createElementVNode("div",J,e.toDisplayString(y(p(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)):i.value?(e.openBlock(),e.createElementBlock(e.Fragment,{key:3},[m.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"gig-message-attachment-image",onClick:t[1]||(t[1]=u=>s.$emit("open-image",i.value.previewUrl))},[e.createElementVNode("img",{src:i.value.previewUrl,alt:i.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:i.value.name},e.toDisplayString(V(i.value.name)),9,ne),e.createElementVNode("div",se,e.toDisplayString(x(i.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",r.value?"left-side":"right-side"]),onClick:t[2]||(t[2]=u=>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),r.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"},he={key:0,style:{"text-align":"center",color:"#94a3b8",padding:"30px"}},ue={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"},Be={class:"gig-input-box"},Ce=["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:k}){const l=o,w=k,r=T(),p=e.ref(""),N=e.ref(null),y=e.ref(null),i=e.ref({x:32,y:112}),m=e.ref({width:440,height:600}),B=e.ref(!1),x=e.ref(null),V=e.ref(!1),M=()=>{V.value=!V.value,V.value&&r.stickers.length===0&&r.fetchStickers()},S=a=>{r.sendSticker(a),V.value=!1,R()},U=a=>{const n=a.trim().split(/\s+/);return n.length>=2?`${n[0]} ${n[1][0]}.`:a},b=a=>a.userId===l.currentUserId?"Вы":U(a.userName||"Support"),s=a=>a.messageType==="sticker"?"[Стикер]":a.text||"",t=a=>{const n=document.querySelector(`.gig-message-row[data-message-id="${a}"]`);n&&(n.scrollIntoView({behavior:"smooth",block:"center"}),n.classList.add("gig-highlighted"),setTimeout(()=>n.classList.remove("gig-highlighted"),1500))},u=e.ref(null),d=a=>{u.value=a},c=()=>{u.value=null};let h=0,C=0,$=0,_=0,z=0,I=0;const He=a=>{a.button===0&&(B.value=!0,h=a.clientX,C=a.clientY,z=i.value.x,I=i.value.y,window.addEventListener("mousemove",G),window.addEventListener("mouseup",D))},G=a=>{if(!B.value)return;let n=z-(a.clientX-h),g=I-(a.clientY-C);const f=window.innerWidth-m.value.width,v=window.innerHeight-m.value.height;n<0&&(n=0),n>f&&(n=f),g<0&&(g=0),g>v&&(g=v),i.value={x:n,y:g}},H=(a,n)=>{a.preventDefault(),x.value=n,h=a.clientX,C=a.clientY,$=m.value.width,_=m.value.height,z=i.value.x,I=i.value.y,window.addEventListener("mousemove",A),window.addEventListener("mouseup",D)},A=a=>{if(!x.value)return;const n=h-a.clientX,g=C-a.clientY;if(x.value==="left"||x.value==="corner"){let f=$+n;const v=window.innerWidth-i.value.x;f>v&&(f=v),f>=320&&(m.value.width=f)}if(x.value==="top"||x.value==="corner"){let f=_+g;const v=window.innerHeight-i.value.y;f>v&&(f=v),f>=400&&(m.value.height=f)}},D=()=>{B.value=!1,x.value=null,window.removeEventListener("mousemove",G),window.removeEventListener("mousemove",A)},L=()=>{const a=window.innerWidth-m.value.width,n=window.innerHeight-m.value.height;i.value.x<0&&(i.value.x=0),i.value.x>a&&a>0?i.value.x=a:i.value.x>window.innerWidth&&(i.value.x=0),i.value.y<0&&(i.value.y=0),i.value.y>n&&n>0?i.value.y=n:i.value.y>window.innerHeight&&(i.value.y=0)},O=()=>{p.value.trim()&&(w("send",p.value),p.value="",y.value&&(y.value.style.height="auto"),R())},De=()=>{y.value&&(y.value.style.height="auto",y.value.style.height=Math.min(y.value.scrollHeight,120)+"px")},R=async()=>{await e.nextTick(),N.value&&(N.value.scrollTop=N.value.scrollHeight)};return e.onMounted(()=>{R(),window.addEventListener("resize",L),L()}),e.onUnmounted(()=>{D(),window.removeEventListener("resize",L)}),(a,n)=>(e.openBlock(),e.createElementBlock("div",{class:"gig-chat-window",style:e.normalizeStyle({width:m.value.width+"px",height:m.value.height+"px",bottom:i.value.y+"px",right:i.value.x+"px",cursor:B.value?"grabbing":"auto"})},[e.createElementVNode("div",{class:"gig-resizer gig-resizer-l",onMousedown:n[0]||(n[0]=g=>H(g,"left"))},null,32),e.createElementVNode("div",{class:"gig-resizer gig-resizer-t",onMousedown:n[1]||(n[1]=g=>H(g,"top"))},null,32),e.createElementVNode("div",{class:"gig-resizer gig-resizer-tl",onMousedown:n[2]||(n[2]=g=>H(g,"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(g=>a.$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:N,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,g=>(e.openBlock(),e.createBlock(ce,{key:g.id,message:g,"current-user-id":o.currentUserId,onReply:n[4]||(n[4]=f=>e.unref(r).replyingToMessage=f),onScrollTo:t,onOpenImage:d},null,8,["message","current-user-id"]))),128))],512),e.createVNode(e.Transition,{name:"gig-fade"},{default:e.withCtx(()=>[V.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]=g=>V.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(r).isLoadingStickers?(e.openBlock(),e.createElementBlock("div",he," Загрузка... ")):e.unref(r).stickers.length===0?(e.openBlock(),e.createElementBlock("div",ue," Стикеры не найдены ")):(e.openBlock(),e.createElementBlock("div",fe,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(r).stickers,g=>(e.openBlock(),e.createElementBlock("div",{key:g.id,class:"gig-sticker-item",onClick:f=>S(g.id)},[e.createElementVNode("img",{src:`data:${g.mimeType||"image/png"};base64,${g.base64}`,class:"gig-sticker-thumbnail",alt:g.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(r).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(r).replyingToMessage)),1),e.createElementVNode("div",Ne,e.toDisplayString(s(e.unref(r).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]=g=>e.unref(r).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",Be,[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:y,"onUpdate:modelValue":n[7]||(n[7]=g=>p.value=g),placeholder:"Напишите сообщение...",class:"gig-textarea",rows:"1",onKeydown:e.withKeys(e.withModifiers(O,["exact","prevent"]),["enter"]),onInput:De},null,40,Ce),[[e.vModelText,p.value]]),e.createElementVNode("button",{class:e.normalizeClass(["gig-send-btn",{active:p.value.trim()}]),disabled:!p.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(()=>[u.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"gig-image-viewer",onClick:c},[e.createElementVNode("button",{class:"gig-btn-icon gig-image-viewer-close",onClick:e.withModifiers(c,["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:u.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"},Ue={key:1,viewBox:"0 0 24 24",width:"32",height:"32",fill:"none",stroke:"white","stroke-width":"2"},ze={key:2,viewBox:"0 0 24 24",width:"32",height:"32",fill:"none",stroke:"white","stroke-width":"2"},W=e.defineComponent({__name:"GigSupportChat",props:{config:{}},setup(o){const k=o,l=T();return e.onMounted(()=>{l.init(k.config),l.connect()}),e.onUnmounted(()=>{l.disconnect()}),(w,r)=>(e.openBlock(),e.createElementBlock("div",$e,[e.createVNode(e.Transition,{name:"gig-fade"},{default:e.withCtx(()=>[e.unref(l).isWidgetOpen?(e.openBlock(),e.createBlock(be,{key:0,messages:e.unref(l).messages,"is-connected":e.unref(l).isConnected,"current-user-id":e.unref(l).currentUserId,onSend:r[0]||(r[0]=p=>e.unref(l).sendMessage(p)),onClose:r[1]||(r[1]=p=>e.unref(l).toggleWidget())},null,8,["messages","is-connected","current-user-id"])):e.createCommentVNode("",!0)]),_:1}),e.createElementVNode("button",{class:"gig-chat-trigger",onClick:r[2]||(r[2]=p=>e.unref(l).toggleWidget())},[e.unref(l).unreadCount>0?(e.openBlock(),e.createElementBlock("div",Te,e.toDisplayString(e.unref(l).unreadCount),1)):e.createCommentVNode("",!0),e.unref(l).isWidgetOpen?(e.openBlock(),e.createElementBlock("svg",ze,[...r[4]||(r[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",Ue,[...r[3]||(r[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)])]))])]))}}),Ie={install:o=>{o.component("GigSupportChat",W)}};E.GigSupportChat=W,E.default=Ie,E.useSupportChat=T,Object.defineProperties(E,{__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/support-chat.css CHANGED
@@ -1 +1 @@
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: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-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}
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,6 +1,6 @@
1
1
  {
2
2
  "name": "@vunex/support-chat",
3
- "version": "1.0.7",
3
+ "version": "1.0.8",
4
4
  "private": false,
5
5
  "publishConfig": {
6
6
  "access": "public"