@mobilon-dev/chotto 0.3.36 → 0.3.37
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.
- package/dist/chotto.css +1 -1
- package/dist/components/1_atoms/ContactContextMenu/ContactContextMenu.vue.js +2 -2
- package/dist/components/1_atoms/ContactContextMenu/ContactContextMenu.vue2.js +1 -1
- package/dist/components/2_chatinput_elements/StickerPicker/StickerPicker.vue.js +1 -1
- package/dist/components/2_chatinput_elements/StickerPicker/StickerPicker.vue2.js +176 -203
- package/dist/components/2_feed_elements/MessageStatusIndicator/MessageStatusIndicator.vue.js +1 -1
- package/dist/components/3_compounds/ChatInput/ChatInput.vue.js +2 -2
- package/dist/components/3_compounds/ChatInput/ChatInput.vue2.js +71 -65
- package/dist/components/3_compounds/ChatList/composables/useChatListFilter.js +14 -17
- package/dist/locale/en.js +4 -0
- package/dist/locale/ru.js +6 -2
- package/dist/themes/dark.css +1 -1
- package/dist/themes/default.css +1 -1
- package/dist/themes/glass.css +1 -1
- package/dist/themes/green.css +1 -1
- package/dist/themes/mobilon1.css +1 -1
- package/dist/types/components/2_chatlist_elements/ChatItem/styles/types.d.ts +8 -0
- package/dist/types/components/3_compounds/ChatList/composables/useChatListFilter.d.ts +3 -3
- package/dist/types/locale/en.d.ts +4 -0
- package/dist/types/locale/ru.d.ts +4 -0
- package/package.json +1 -1
|
@@ -1,19 +1,19 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { useImmediateDebouncedRef as
|
|
3
|
-
import { useMessageDraft as
|
|
1
|
+
import { defineComponent as N, inject as G, ref as y, computed as x, watch as p, nextTick as f, unref as r, onMounted as U, createElementBlock as _, openBlock as b, createElementVNode as u, withDirectives as J, createVNode as w, renderSlot as T, toDisplayString as Q, withKeys as X, vModelText as Z, normalizeClass as ee } from "vue";
|
|
2
|
+
import { useImmediateDebouncedRef as te } from "../../../hooks/useImmediateDebouncedRef.js";
|
|
3
|
+
import { useMessageDraft as ne } from "../../../hooks/useMessageDraft.js";
|
|
4
4
|
import "../../../hooks/useSearchModel.js";
|
|
5
5
|
import "../../../hooks/useTheme.js";
|
|
6
6
|
/* empty css */
|
|
7
7
|
/* empty css */
|
|
8
8
|
import "../../../node_modules/linkifyjs/dist/linkify.js";
|
|
9
9
|
import "../../../functions/parseMarkdown.js";
|
|
10
|
-
import { t as
|
|
11
|
-
import
|
|
12
|
-
import
|
|
13
|
-
const
|
|
10
|
+
import { t as c } from "../../../locale/useLocale.js";
|
|
11
|
+
import le from "./icons/SendIcon.vue.js";
|
|
12
|
+
import ie from "../../2_chatinput_elements/TextFormatToolbar/TextFormatToolbar.vue.js";
|
|
13
|
+
const se = { class: "chat-input__container" }, oe = ["id"], ae = ["id"], re = { class: "chat-input__inline-buttons" }, ue = {
|
|
14
14
|
key: 0,
|
|
15
15
|
class: "chat-input__input chat-input__disabled-placeholder"
|
|
16
|
-
},
|
|
16
|
+
}, ce = ["disabled", "placeholder"], de = ["disabled"], pe = { class: "" }, fe = { class: "chat-input__third-line" }, Ae = /* @__PURE__ */ N({
|
|
17
17
|
__name: "ChatInput",
|
|
18
18
|
props: {
|
|
19
19
|
state: {
|
|
@@ -42,64 +42,70 @@ const ie = { class: "chat-input__container" }, se = ["id"], oe = ["id"], ae = {
|
|
|
42
42
|
}
|
|
43
43
|
},
|
|
44
44
|
emits: ["send", "typing"],
|
|
45
|
-
setup(
|
|
46
|
-
const
|
|
45
|
+
setup(d, { emit: A }) {
|
|
46
|
+
const h = A, m = G("chatAppId"), { resetMessage: D, getMessage: i, setMessageText: v, setForceSendMessage: F } = ne(m), n = y(), E = te("", 2e3), M = y(), a = d, P = x(() => !!(a.state == "disabled" || i().text == "" && !i().file || i().isRecording)), R = x(() => {
|
|
47
47
|
var t;
|
|
48
|
-
if (
|
|
49
|
-
return
|
|
50
|
-
if (!((t =
|
|
48
|
+
if (a.inputButtonColor)
|
|
49
|
+
return a.inputButtonColor;
|
|
50
|
+
if (!((t = a.selectedChannel) != null && t.channelId))
|
|
51
51
|
return "#25D366";
|
|
52
|
-
const e =
|
|
52
|
+
const e = a.selectedChannel.channelId.toLowerCase();
|
|
53
53
|
return e.includes("whatsapp") || e.includes("waba") ? "#25D366" : e.includes("telegram") ? "#37AFE2" : e.includes("sms") ? "#6C757D" : e.includes("max") ? "#4B0082" : "#25D366";
|
|
54
|
+
}), k = x(() => {
|
|
55
|
+
var t;
|
|
56
|
+
if (!((t = a.selectedChannel) != null && t.channelId))
|
|
57
|
+
return c("component.ChatInput.InputPlaceholder");
|
|
58
|
+
const e = a.selectedChannel.channelId.toLowerCase();
|
|
59
|
+
return e.includes("whatsapp") || e.includes("waba") ? c("component.ChatInput.WhatsappInputPlaceholder") : e.includes("telegram") ? c("component.ChatInput.TelegramInputPlaceholder") : e.includes("sms") ? c("component.ChatInput.SmsInputPlaceholder") : e.includes("max") ? c("component.ChatInput.MaxInputPlaceholder") : c("component.ChatInput.InputPlaceholder");
|
|
54
60
|
});
|
|
55
|
-
|
|
56
|
-
() =>
|
|
61
|
+
p(
|
|
62
|
+
() => E.value,
|
|
57
63
|
() => {
|
|
58
|
-
|
|
64
|
+
h("typing");
|
|
59
65
|
}
|
|
60
|
-
),
|
|
61
|
-
() =>
|
|
66
|
+
), p(
|
|
67
|
+
() => a.focusOnInputArea,
|
|
62
68
|
() => {
|
|
63
|
-
|
|
64
|
-
const e =
|
|
69
|
+
a.focusOnInputArea && f(() => {
|
|
70
|
+
const e = r(n);
|
|
65
71
|
e == null || e.focus();
|
|
66
72
|
});
|
|
67
73
|
},
|
|
68
74
|
{ immediate: !0 }
|
|
69
|
-
),
|
|
75
|
+
), p(
|
|
70
76
|
() => i().text,
|
|
71
77
|
() => {
|
|
72
|
-
|
|
78
|
+
f(() => {
|
|
73
79
|
const e = n.value;
|
|
74
80
|
if (!e) return;
|
|
75
81
|
const t = e.scrollTop;
|
|
76
82
|
e.style.height = "auto";
|
|
77
|
-
const l = getComputedStyle(e), s = parseFloat(l.fontSize) || 16,
|
|
83
|
+
const l = getComputedStyle(e), s = parseFloat(l.fontSize) || 16, W = parseFloat(l.lineHeight) || s * 1.4, I = 40, C = W * 11, S = e.scrollHeight, O = i().text.split(`
|
|
78
84
|
`).length > 1, o = document.createElement("div");
|
|
79
85
|
o.style.position = "absolute", o.style.visibility = "hidden", o.style.whiteSpace = "nowrap", o.style.font = l.font, o.style.fontSize = l.fontSize, o.style.fontFamily = l.fontFamily, o.style.fontWeight = l.fontWeight, o.style.letterSpacing = l.letterSpacing, o.textContent = i().text, document.body.appendChild(o);
|
|
80
|
-
const
|
|
86
|
+
const Y = o.offsetWidth;
|
|
81
87
|
document.body.removeChild(o);
|
|
82
|
-
const
|
|
83
|
-
i().text.trim() &&
|
|
88
|
+
const q = parseFloat(l.paddingLeft) || 0, K = parseFloat(l.paddingRight) || 0, j = e.clientWidth - q - K, V = Y > j, $ = O || V;
|
|
89
|
+
i().text.trim() && $ ? S <= C ? (e.style.height = S + "px", e.style.overflowY = "hidden") : (e.style.height = C + "px", e.style.overflowY = "auto", e.scrollTop = t) : (e.style.height = I + "px", e.style.overflowY = "hidden");
|
|
84
90
|
});
|
|
85
91
|
},
|
|
86
92
|
{ immediate: !0 }
|
|
87
|
-
),
|
|
93
|
+
), p(
|
|
88
94
|
() => i().forceSend,
|
|
89
95
|
() => {
|
|
90
|
-
i().forceSend && (
|
|
96
|
+
i().forceSend && (g(), F(!1));
|
|
91
97
|
}
|
|
92
98
|
);
|
|
93
99
|
const z = (e) => {
|
|
94
100
|
const t = e.target;
|
|
95
|
-
|
|
101
|
+
h("typing", t.value);
|
|
96
102
|
}, B = () => {
|
|
97
|
-
|
|
103
|
+
f(() => {
|
|
98
104
|
const e = n.value;
|
|
99
105
|
e && (e.style.height = "40px", e.style.overflowY = "hidden");
|
|
100
106
|
});
|
|
101
107
|
};
|
|
102
|
-
|
|
108
|
+
U(() => {
|
|
103
109
|
B();
|
|
104
110
|
});
|
|
105
111
|
const H = (e) => {
|
|
@@ -107,30 +113,30 @@ const ie = { class: "chat-input__container" }, se = ["id"], oe = ["id"], ae = {
|
|
|
107
113
|
if (n.value instanceof HTMLTextAreaElement) {
|
|
108
114
|
let t = n.value.selectionStart;
|
|
109
115
|
t && (n.value.setRangeText(`
|
|
110
|
-
`, t, t, "end"),
|
|
116
|
+
`, t, t, "end"), v(n.value.value));
|
|
111
117
|
}
|
|
112
118
|
e.preventDefault();
|
|
113
119
|
} else if (e.ctrlKey) {
|
|
114
120
|
if (n.value instanceof HTMLTextAreaElement) {
|
|
115
121
|
let t = n.value.selectionStart;
|
|
116
122
|
t && (n.value.setRangeText(`
|
|
117
|
-
`, t, t, "end"),
|
|
123
|
+
`, t, t, "end"), v(n.value.value));
|
|
118
124
|
}
|
|
119
125
|
e.preventDefault();
|
|
120
126
|
} else
|
|
121
|
-
e.preventDefault(),
|
|
122
|
-
},
|
|
127
|
+
e.preventDefault(), g();
|
|
128
|
+
}, L = (e) => {
|
|
123
129
|
if (n.value) {
|
|
124
130
|
const t = n.value.value;
|
|
125
131
|
n.value.value = e.newText;
|
|
126
132
|
const l = e.newText.length - (t.length - (e.end - e.start)), s = e.start + l;
|
|
127
|
-
|
|
133
|
+
v(e.newText), f(() => {
|
|
128
134
|
n.value && (n.value.setSelectionRange(s, s), n.value.focus());
|
|
129
135
|
});
|
|
130
136
|
}
|
|
131
|
-
},
|
|
137
|
+
}, g = () => {
|
|
132
138
|
var t, l;
|
|
133
|
-
const e =
|
|
139
|
+
const e = y(i());
|
|
134
140
|
if (e.value.text != "" || e.value.file) {
|
|
135
141
|
const s = {
|
|
136
142
|
type: "",
|
|
@@ -140,53 +146,53 @@ const ie = { class: "chat-input__container" }, se = ["id"], oe = ["id"], ae = {
|
|
|
140
146
|
size: "",
|
|
141
147
|
reply: void 0
|
|
142
148
|
};
|
|
143
|
-
e.value.file ? (s.type = "message." + e.value.file.type, s.url = e.value.file.url, s.filename = e.value.file.name, s.size = (t = e.value.file.size) == null ? void 0 : t.toString(), s.text = (l = e == null ? void 0 : e.value) == null ? void 0 : l.text.trim()) : (s.type = "message.text", s.text = e.value.text.trim()), e.value.reply && (s.reply = e.value.reply),
|
|
149
|
+
e.value.file ? (s.type = "message." + e.value.file.type, s.url = e.value.file.url, s.filename = e.value.file.name, s.size = (t = e.value.file.size) == null ? void 0 : t.toString(), s.text = (l = e == null ? void 0 : e.value) == null ? void 0 : l.text.trim()) : (s.type = "message.text", s.text = e.value.text.trim()), e.value.reply && (s.reply = e.value.reply), h("send", s), D(), M.value = void 0, n.value && n.value.focus();
|
|
144
150
|
}
|
|
145
151
|
};
|
|
146
|
-
return (e, t) => (
|
|
152
|
+
return (e, t) => (b(), _("div", se, [
|
|
147
153
|
u("div", {
|
|
148
|
-
id: "chat-input-reply-line-" +
|
|
154
|
+
id: "chat-input-reply-line-" + r(m),
|
|
149
155
|
class: "chat-input__reply-line"
|
|
150
|
-
}, null, 8,
|
|
156
|
+
}, null, 8, oe),
|
|
151
157
|
u("div", {
|
|
152
|
-
id: "chat-input-file-line-" +
|
|
158
|
+
id: "chat-input-file-line-" + r(m),
|
|
153
159
|
class: "chat-input__file-line"
|
|
154
|
-
}, null, 8,
|
|
155
|
-
u("div",
|
|
156
|
-
|
|
160
|
+
}, null, 8, ae),
|
|
161
|
+
u("div", re, [
|
|
162
|
+
T(e.$slots, "inline-buttons", {}, void 0, !0)
|
|
157
163
|
]),
|
|
158
|
-
|
|
164
|
+
d.disabledPlaceholder && (d.state == "disabled" || r(i)().isRecording) ? (b(), _("div", ue, Q(d.disabledPlaceholder), 1)) : J((b(), _("textarea", {
|
|
159
165
|
key: 1,
|
|
160
166
|
ref_key: "refInput",
|
|
161
167
|
ref: n,
|
|
162
|
-
"onUpdate:modelValue": t[0] || (t[0] = (l) =>
|
|
163
|
-
disabled:
|
|
168
|
+
"onUpdate:modelValue": t[0] || (t[0] = (l) => r(i)().text = l),
|
|
169
|
+
disabled: d.state == "disabled" || r(i)().isRecording,
|
|
164
170
|
class: "chat-input__input",
|
|
165
|
-
placeholder:
|
|
166
|
-
onKeydown:
|
|
171
|
+
placeholder: k.value,
|
|
172
|
+
onKeydown: X(H, ["enter"]),
|
|
167
173
|
onInput: z
|
|
168
|
-
}, null, 40,
|
|
169
|
-
[
|
|
174
|
+
}, null, 40, ce)), [
|
|
175
|
+
[Z, r(i)().text]
|
|
170
176
|
]),
|
|
171
|
-
|
|
177
|
+
w(ie, {
|
|
172
178
|
textarea: n.value,
|
|
173
|
-
onFormatApplied:
|
|
179
|
+
onFormatApplied: L
|
|
174
180
|
}, null, 8, ["textarea"]),
|
|
175
181
|
u("button", {
|
|
176
|
-
class:
|
|
177
|
-
disabled:
|
|
178
|
-
onClick:
|
|
182
|
+
class: ee(["chat-input__button", { "chat-input__button-disabled": P.value }]),
|
|
183
|
+
disabled: r(i)().isRecording,
|
|
184
|
+
onClick: g
|
|
179
185
|
}, [
|
|
180
|
-
u("span",
|
|
181
|
-
|
|
186
|
+
u("span", pe, [
|
|
187
|
+
w(r(le), { color: R.value }, null, 8, ["color"])
|
|
182
188
|
])
|
|
183
|
-
], 10,
|
|
184
|
-
u("div",
|
|
185
|
-
|
|
189
|
+
], 10, de),
|
|
190
|
+
u("div", fe, [
|
|
191
|
+
T(e.$slots, "buttons", {}, void 0, !0)
|
|
186
192
|
])
|
|
187
193
|
]));
|
|
188
194
|
}
|
|
189
195
|
});
|
|
190
196
|
export {
|
|
191
|
-
|
|
197
|
+
Ae as default
|
|
192
198
|
};
|
|
@@ -1,27 +1,24 @@
|
|
|
1
|
-
import { ref as
|
|
2
|
-
function
|
|
3
|
-
const
|
|
1
|
+
import { ref as u } from "vue";
|
|
2
|
+
function h({ props: e, emit: l }) {
|
|
3
|
+
const r = u("");
|
|
4
4
|
return {
|
|
5
|
-
filter:
|
|
6
|
-
getSortedAndFilteredChats: () => !e.chats || e.chats.length === 0 ? [] : e.chats.slice().
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
const r = e.activeTabId || "all";
|
|
12
|
-
if (r !== "all") {
|
|
13
|
-
if (r === "countUnread") {
|
|
5
|
+
filter: r,
|
|
6
|
+
getSortedAndFilteredChats: () => !e.chats || e.chats.length === 0 ? [] : e.chats.slice().filter((t) => {
|
|
7
|
+
var n;
|
|
8
|
+
const i = e.activeTabId || "all";
|
|
9
|
+
if (i !== "all") {
|
|
10
|
+
if (i === "countUnread") {
|
|
14
11
|
if (t.countUnread <= 0) return !1;
|
|
15
|
-
} else if (
|
|
12
|
+
} else if (i.startsWith("tag_") && (!((n = t.contact) != null && n.tags) || !t.contact.tags.some((s) => s.tagId === i)))
|
|
16
13
|
return !1;
|
|
17
14
|
}
|
|
18
|
-
return e.searchQuery && e.searchQuery.trim() !== "" ? !0 : e.filterQuery ? t.name.includes(e.filterQuery) || t.metadata.includes(e.filterQuery) : t.name.includes(
|
|
15
|
+
return e.searchQuery && e.searchQuery.trim() !== "" ? !0 : e.filterQuery ? t.name.includes(e.filterQuery) || t.metadata.includes(e.filterQuery) : t.name.includes(r.value) || t.metadata.includes(r.value);
|
|
19
16
|
}),
|
|
20
|
-
getFilter: (
|
|
21
|
-
|
|
17
|
+
getFilter: (a) => {
|
|
18
|
+
r.value = a, a.trim() !== "" ? l("search", a) : l("clear-search");
|
|
22
19
|
}
|
|
23
20
|
};
|
|
24
21
|
}
|
|
25
22
|
export {
|
|
26
|
-
|
|
23
|
+
h as useChatListFilter
|
|
27
24
|
};
|
package/dist/locale/en.js
CHANGED
|
@@ -4,6 +4,10 @@ const e = {
|
|
|
4
4
|
"layout.ChatWrapper.noSelectedChat": "Choose contact to start conversation",
|
|
5
5
|
"component.ChatItem.typing": "typing",
|
|
6
6
|
"component.ChatInput.InputPlaceholder": "Type a message...",
|
|
7
|
+
"component.ChatInput.TelegramInputPlaceholder": "Type a message Telegram or change channel",
|
|
8
|
+
"component.ChatInput.WhatsappInputPlaceholder": "Type a message WhatsApp or change channel",
|
|
9
|
+
"component.ChatInput.SmsInputPlaceholder": "Type a message SMS or change channel",
|
|
10
|
+
"component.ChatInput.MaxInputPlaceholder": "Type a message Max or change channel",
|
|
7
11
|
"component.FeedFoundObjects.results": "Search results",
|
|
8
12
|
"component.FeedFoundObjects.notFound": "Messages not found",
|
|
9
13
|
"component.FeedFoundObjects.notSearched": "Message search in chat",
|
package/dist/locale/ru.js
CHANGED
|
@@ -1,9 +1,13 @@
|
|
|
1
|
-
const
|
|
1
|
+
const e = {
|
|
2
2
|
"component.ChatList.Title": "Mobilon One",
|
|
3
3
|
"component.ChatFilter.InputPlaceholder": "Поиск чата",
|
|
4
4
|
"layout.ChatWrapper.noSelectedChat": "Выберите контакт для начала общения",
|
|
5
5
|
"component.ChatItem.typing": "печатает",
|
|
6
6
|
"component.ChatInput.InputPlaceholder": "Введите сообщение",
|
|
7
|
+
"component.ChatInput.WhatsappInputPlaceholder": "Введите сообщение WhatsApp или смените канал",
|
|
8
|
+
"component.ChatInput.TelegramInputPlaceholder": "Введите сообщение Telegram или смените канал",
|
|
9
|
+
"component.ChatInput.SmsInputPlaceholder": "Введите сообщение SMS или смените канал",
|
|
10
|
+
"component.ChatInput.MaxInputPlaceholder": "Введите сообщение Max или смените канал",
|
|
7
11
|
"component.FeedFoundObjects.results": "Результаты поиска",
|
|
8
12
|
"component.FeedFoundObjects.notFound": "Сообщения не найдены",
|
|
9
13
|
"component.FeedFoundObjects.notSearched": "Поиск по сообщениям в чате",
|
|
@@ -18,5 +22,5 @@ const o = {
|
|
|
18
22
|
"component.TextFormatToolbar.Quote": "Цитата"
|
|
19
23
|
};
|
|
20
24
|
export {
|
|
21
|
-
|
|
25
|
+
e as ru
|
|
22
26
|
};
|