@convokitapp/vue-ui 0.1.0
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/LICENSE +21 -0
- package/PARITY.md +33 -0
- package/README.md +87 -0
- package/dist/index.cjs +1405 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.css +476 -0
- package/dist/index.css.map +1 -0
- package/dist/index.d.cts +1613 -0
- package/dist/index.d.ts +1613 -0
- package/dist/index.js +1409 -0
- package/dist/index.js.map +1 -0
- package/package.json +93 -0
package/dist/index.d.cts
ADDED
|
@@ -0,0 +1,1613 @@
|
|
|
1
|
+
import { Conversation as Conversation$1, Message, MessageMedia, RealtimeSubscription, ReadEvent, TypingEvent, ConvoKitClient } from '@convokitapp/sdk';
|
|
2
|
+
import * as vue from 'vue';
|
|
3
|
+
import { CSSProperties, HTMLAttributes, Ref, VNodeChild, PropType, MaybeRefOrGetter, TextareaHTMLAttributes } from 'vue';
|
|
4
|
+
|
|
5
|
+
interface ConvoKitUiClient {
|
|
6
|
+
readonly currentUserId: string;
|
|
7
|
+
getConversations(options: {
|
|
8
|
+
limit: number;
|
|
9
|
+
offset: number;
|
|
10
|
+
archived: boolean;
|
|
11
|
+
}): Promise<Conversation$1[]>;
|
|
12
|
+
getConversation(conversationId: string): Promise<Conversation$1>;
|
|
13
|
+
getMessages(options: {
|
|
14
|
+
conversationId: string;
|
|
15
|
+
limit: number;
|
|
16
|
+
offset: number;
|
|
17
|
+
}): Promise<Message[]>;
|
|
18
|
+
sendMessage(input: {
|
|
19
|
+
conversationId: string;
|
|
20
|
+
text?: string;
|
|
21
|
+
media?: MessageMedia[];
|
|
22
|
+
}): Promise<Message>;
|
|
23
|
+
markConversationRead(conversationId: string): Promise<void>;
|
|
24
|
+
sendTyping(input: {
|
|
25
|
+
conversationId: string;
|
|
26
|
+
isTyping: boolean;
|
|
27
|
+
}): Promise<void>;
|
|
28
|
+
onMessage(conversationId: string, handler: (message: Message) => void, onError?: (error: Error) => void): RealtimeSubscription;
|
|
29
|
+
onReadReceipt(conversationId: string, handler: (event: ReadEvent) => void, onError?: (error: Error) => void): RealtimeSubscription;
|
|
30
|
+
onTyping(conversationId: string, handler: (event: TypingEvent) => void, onError?: (error: Error) => void): RealtimeSubscription;
|
|
31
|
+
}
|
|
32
|
+
interface ConversationFilter {
|
|
33
|
+
query?: string;
|
|
34
|
+
archived?: boolean;
|
|
35
|
+
participantIds?: ReadonlySet<string> | readonly string[];
|
|
36
|
+
requireAllParticipants?: boolean;
|
|
37
|
+
predicate?: (conversation: Conversation$1) => boolean;
|
|
38
|
+
comparator?: (left: Conversation$1, right: Conversation$1) => number;
|
|
39
|
+
}
|
|
40
|
+
interface ConversationPageRequest {
|
|
41
|
+
limit: number;
|
|
42
|
+
offset: number;
|
|
43
|
+
filter: ConversationFilter;
|
|
44
|
+
}
|
|
45
|
+
type ConversationPageLoader = (request: ConversationPageRequest) => Promise<Conversation$1[]>;
|
|
46
|
+
interface ConversationListState {
|
|
47
|
+
conversations: Readonly<Ref<Conversation$1[]>>;
|
|
48
|
+
filter: Readonly<Ref<ConversationFilter>>;
|
|
49
|
+
isInitialLoading: Readonly<Ref<boolean>>;
|
|
50
|
+
isLoadingMore: Readonly<Ref<boolean>>;
|
|
51
|
+
hasMore: Readonly<Ref<boolean>>;
|
|
52
|
+
hasLoaded: Readonly<Ref<boolean>>;
|
|
53
|
+
error: Readonly<Ref<unknown>>;
|
|
54
|
+
}
|
|
55
|
+
interface ConversationState {
|
|
56
|
+
conversation: Readonly<Ref<Conversation$1 | null>>;
|
|
57
|
+
messages: Readonly<Ref<Message[]>>;
|
|
58
|
+
typingUserIds: Readonly<Ref<ReadonlySet<string>>>;
|
|
59
|
+
readAtByUserId: Readonly<Ref<ReadonlyMap<string, Date>>>;
|
|
60
|
+
isInitialLoading: Readonly<Ref<boolean>>;
|
|
61
|
+
isLoadingOlder: Readonly<Ref<boolean>>;
|
|
62
|
+
isSending: Readonly<Ref<boolean>>;
|
|
63
|
+
hasOlderMessages: Readonly<Ref<boolean>>;
|
|
64
|
+
hasLoaded: Readonly<Ref<boolean>>;
|
|
65
|
+
error: Readonly<Ref<unknown>>;
|
|
66
|
+
currentUserId: Readonly<Ref<string>>;
|
|
67
|
+
readerIdsFor(message: Message): ReadonlySet<string>;
|
|
68
|
+
}
|
|
69
|
+
type ConvoKitUiDensity = 'comfortable' | 'compact';
|
|
70
|
+
type ConvoKitUiPart = 'root' | 'list' | 'listItem' | 'avatar' | 'header' | 'messages' | 'message' | 'incomingMessage' | 'outgoingMessage' | 'media' | 'receipt' | 'typing' | 'composer' | 'input' | 'button' | 'empty' | 'loading' | 'error';
|
|
71
|
+
interface ConvoKitAppearanceProps {
|
|
72
|
+
classNames?: Partial<Record<ConvoKitUiPart, string>>;
|
|
73
|
+
styles?: Partial<Record<ConvoKitUiPart, CSSProperties>>;
|
|
74
|
+
density?: ConvoKitUiDensity;
|
|
75
|
+
unstyled?: boolean;
|
|
76
|
+
}
|
|
77
|
+
interface ConversationItemSlotProps {
|
|
78
|
+
conversation: Conversation$1;
|
|
79
|
+
index: number;
|
|
80
|
+
selected: boolean;
|
|
81
|
+
select: () => void;
|
|
82
|
+
}
|
|
83
|
+
interface MessageSlotProps {
|
|
84
|
+
message: Message;
|
|
85
|
+
chronologicalIndex: number;
|
|
86
|
+
isCurrentUser: boolean;
|
|
87
|
+
sender: Conversation$1['participants'][number] | undefined;
|
|
88
|
+
readerIds: ReadonlySet<string>;
|
|
89
|
+
}
|
|
90
|
+
interface MediaSlotProps {
|
|
91
|
+
media: MessageMedia;
|
|
92
|
+
message: Message;
|
|
93
|
+
isCurrentUser: boolean;
|
|
94
|
+
open?: () => void;
|
|
95
|
+
}
|
|
96
|
+
interface ComposerSlotProps {
|
|
97
|
+
value: string;
|
|
98
|
+
setValue: (value: string) => void;
|
|
99
|
+
isSending: boolean;
|
|
100
|
+
send: () => void;
|
|
101
|
+
addAttachment?: () => void;
|
|
102
|
+
}
|
|
103
|
+
interface TypingSlotProps {
|
|
104
|
+
userIds: ReadonlySet<string>;
|
|
105
|
+
displayNameForUser: (userId: string) => string;
|
|
106
|
+
}
|
|
107
|
+
interface ReadReceiptSlotProps {
|
|
108
|
+
message: Message;
|
|
109
|
+
readerIds: ReadonlySet<string>;
|
|
110
|
+
}
|
|
111
|
+
interface ErrorSlotProps {
|
|
112
|
+
error: unknown;
|
|
113
|
+
retry?: () => void;
|
|
114
|
+
}
|
|
115
|
+
interface BaseViewProps extends ConvoKitAppearanceProps {
|
|
116
|
+
class?: HTMLAttributes['class'];
|
|
117
|
+
style?: HTMLAttributes['style'];
|
|
118
|
+
}
|
|
119
|
+
interface ScrollOptions {
|
|
120
|
+
scrollElement?: Ref<HTMLElement | null>;
|
|
121
|
+
paginationThreshold?: number;
|
|
122
|
+
}
|
|
123
|
+
type StateSlot = () => VNodeChild;
|
|
124
|
+
type ErrorSlot = (props: ErrorSlotProps) => VNodeChild;
|
|
125
|
+
|
|
126
|
+
/** Adapts a connected `@convokitapp/sdk` client to the replaceable UI boundary. */
|
|
127
|
+
declare function createConvoKitUiClient(client: ConvoKitClient): ConvoKitUiClient;
|
|
128
|
+
|
|
129
|
+
/** Accessible avatar built on Reka UI, the primitive layer used by shadcn-vue. */
|
|
130
|
+
declare const ConvoKitAvatar: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
131
|
+
name: {
|
|
132
|
+
type: StringConstructor;
|
|
133
|
+
required: true;
|
|
134
|
+
};
|
|
135
|
+
src: {
|
|
136
|
+
type: PropType<string | null>;
|
|
137
|
+
default: null;
|
|
138
|
+
};
|
|
139
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
140
|
+
[key: string]: any;
|
|
141
|
+
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
142
|
+
name: {
|
|
143
|
+
type: StringConstructor;
|
|
144
|
+
required: true;
|
|
145
|
+
};
|
|
146
|
+
src: {
|
|
147
|
+
type: PropType<string | null>;
|
|
148
|
+
default: null;
|
|
149
|
+
};
|
|
150
|
+
}>> & Readonly<{}>, {
|
|
151
|
+
src: string | null;
|
|
152
|
+
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
153
|
+
|
|
154
|
+
interface UseConversationOptions {
|
|
155
|
+
client: MaybeRefOrGetter<ConvoKitUiClient>;
|
|
156
|
+
conversationId: MaybeRefOrGetter<string>;
|
|
157
|
+
messagePageSize?: number;
|
|
158
|
+
markReadOnLoad?: boolean;
|
|
159
|
+
markReadOnReceive?: boolean;
|
|
160
|
+
typingTimeoutMs?: number;
|
|
161
|
+
autoLoad?: boolean;
|
|
162
|
+
}
|
|
163
|
+
interface ConversationController extends ConversationState {
|
|
164
|
+
loadInitial(): Promise<void>;
|
|
165
|
+
refresh(): Promise<void>;
|
|
166
|
+
loadOlderMessages(): Promise<void>;
|
|
167
|
+
sendMessage(input: {
|
|
168
|
+
text?: string;
|
|
169
|
+
media?: MessageMedia[];
|
|
170
|
+
}): Promise<Message | null>;
|
|
171
|
+
markRead(): Promise<void>;
|
|
172
|
+
updateTyping(isTyping: boolean): Promise<void>;
|
|
173
|
+
dispose(): Promise<void>;
|
|
174
|
+
}
|
|
175
|
+
/** Owns one conversation's history, realtime state, sending, and read positions. */
|
|
176
|
+
declare function useConversation(options: UseConversationOptions): ConversationController;
|
|
177
|
+
|
|
178
|
+
interface ConversationViewProps extends ConvoKitAppearanceProps {
|
|
179
|
+
conversation: Conversation$1;
|
|
180
|
+
messages: readonly Message[];
|
|
181
|
+
currentUserId: string;
|
|
182
|
+
onSendMessage: (text: string) => boolean | void | Promise<boolean | void>;
|
|
183
|
+
typingUserIds?: ReadonlySet<string>;
|
|
184
|
+
readAtByUserId?: ReadonlyMap<string, Date>;
|
|
185
|
+
readersResolver?: (message: Message) => ReadonlySet<string>;
|
|
186
|
+
onBack?: () => void;
|
|
187
|
+
onRefresh?: () => void | Promise<void>;
|
|
188
|
+
onLoadOlder?: () => void | Promise<void>;
|
|
189
|
+
onTypingChange?: (isTyping: boolean) => void | Promise<void>;
|
|
190
|
+
onAddAttachment?: () => void;
|
|
191
|
+
onAttachmentClick?: (media: MessageMedia, message: Message) => void;
|
|
192
|
+
isInitialLoading?: boolean;
|
|
193
|
+
isLoadingOlder?: boolean;
|
|
194
|
+
isSending?: boolean;
|
|
195
|
+
hasOlderMessages?: boolean;
|
|
196
|
+
error?: unknown;
|
|
197
|
+
messageError?: unknown;
|
|
198
|
+
displayNameForUser?: (userId: string) => string | null | undefined;
|
|
199
|
+
reverseMessages?: boolean;
|
|
200
|
+
stickToBottom?: boolean;
|
|
201
|
+
paginationThreshold?: number;
|
|
202
|
+
formatTime?: (date: Date) => string;
|
|
203
|
+
imageLoading?: 'eager' | 'lazy';
|
|
204
|
+
composerPlaceholder?: string;
|
|
205
|
+
composerAriaLabel?: string;
|
|
206
|
+
composerProps?: Omit<TextareaHTMLAttributes, 'value' | 'disabled'>;
|
|
207
|
+
modelValue?: string;
|
|
208
|
+
defaultDraft?: string;
|
|
209
|
+
onDraftChange?: (value: string) => void;
|
|
210
|
+
class?: unknown;
|
|
211
|
+
style?: unknown;
|
|
212
|
+
}
|
|
213
|
+
/** Controlled, complete selected-conversation surface. */
|
|
214
|
+
declare const ConversationView: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
215
|
+
readonly conversation: {
|
|
216
|
+
readonly type: PropType<Conversation$1>;
|
|
217
|
+
readonly required: true;
|
|
218
|
+
};
|
|
219
|
+
readonly messages: {
|
|
220
|
+
readonly type: PropType<readonly Message[]>;
|
|
221
|
+
readonly required: true;
|
|
222
|
+
};
|
|
223
|
+
readonly currentUserId: {
|
|
224
|
+
readonly type: StringConstructor;
|
|
225
|
+
readonly required: true;
|
|
226
|
+
};
|
|
227
|
+
readonly onSendMessage: {
|
|
228
|
+
readonly type: PropType<(text: string) => boolean | void | Promise<boolean | void>>;
|
|
229
|
+
readonly required: true;
|
|
230
|
+
};
|
|
231
|
+
readonly typingUserIds: {
|
|
232
|
+
readonly type: PropType<ReadonlySet<string>>;
|
|
233
|
+
readonly default: () => Set<unknown>;
|
|
234
|
+
};
|
|
235
|
+
readonly readAtByUserId: {
|
|
236
|
+
readonly type: PropType<ReadonlyMap<string, Date>>;
|
|
237
|
+
readonly default: () => Map<any, any>;
|
|
238
|
+
};
|
|
239
|
+
readonly readersResolver: {
|
|
240
|
+
readonly type: PropType<(message: Message) => ReadonlySet<string>>;
|
|
241
|
+
readonly default: undefined;
|
|
242
|
+
};
|
|
243
|
+
readonly onBack: {
|
|
244
|
+
readonly type: PropType<() => void>;
|
|
245
|
+
readonly default: undefined;
|
|
246
|
+
};
|
|
247
|
+
readonly onRefresh: {
|
|
248
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
249
|
+
readonly default: undefined;
|
|
250
|
+
};
|
|
251
|
+
readonly onLoadOlder: {
|
|
252
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
253
|
+
readonly default: undefined;
|
|
254
|
+
};
|
|
255
|
+
readonly onTypingChange: {
|
|
256
|
+
readonly type: PropType<(isTyping: boolean) => void | Promise<void>>;
|
|
257
|
+
readonly default: undefined;
|
|
258
|
+
};
|
|
259
|
+
readonly onAddAttachment: {
|
|
260
|
+
readonly type: PropType<() => void>;
|
|
261
|
+
readonly default: undefined;
|
|
262
|
+
};
|
|
263
|
+
readonly onAttachmentClick: {
|
|
264
|
+
readonly type: PropType<(media: MessageMedia, message: Message) => void>;
|
|
265
|
+
readonly default: undefined;
|
|
266
|
+
};
|
|
267
|
+
readonly isInitialLoading: {
|
|
268
|
+
readonly type: BooleanConstructor;
|
|
269
|
+
readonly default: false;
|
|
270
|
+
};
|
|
271
|
+
readonly isLoadingOlder: {
|
|
272
|
+
readonly type: BooleanConstructor;
|
|
273
|
+
readonly default: false;
|
|
274
|
+
};
|
|
275
|
+
readonly isSending: {
|
|
276
|
+
readonly type: BooleanConstructor;
|
|
277
|
+
readonly default: false;
|
|
278
|
+
};
|
|
279
|
+
readonly hasOlderMessages: {
|
|
280
|
+
readonly type: BooleanConstructor;
|
|
281
|
+
readonly default: false;
|
|
282
|
+
};
|
|
283
|
+
readonly error: {
|
|
284
|
+
readonly type: PropType<unknown>;
|
|
285
|
+
readonly required: false;
|
|
286
|
+
};
|
|
287
|
+
readonly messageError: {
|
|
288
|
+
readonly type: PropType<unknown>;
|
|
289
|
+
readonly required: false;
|
|
290
|
+
};
|
|
291
|
+
readonly displayNameForUser: {
|
|
292
|
+
readonly type: PropType<(userId: string) => string | null | undefined>;
|
|
293
|
+
readonly default: undefined;
|
|
294
|
+
};
|
|
295
|
+
readonly reverseMessages: {
|
|
296
|
+
readonly type: BooleanConstructor;
|
|
297
|
+
readonly default: true;
|
|
298
|
+
};
|
|
299
|
+
readonly stickToBottom: {
|
|
300
|
+
readonly type: BooleanConstructor;
|
|
301
|
+
readonly default: true;
|
|
302
|
+
};
|
|
303
|
+
readonly paginationThreshold: {
|
|
304
|
+
readonly type: NumberConstructor;
|
|
305
|
+
readonly default: 240;
|
|
306
|
+
};
|
|
307
|
+
readonly formatTime: {
|
|
308
|
+
readonly type: PropType<(date: Date) => string>;
|
|
309
|
+
readonly default: undefined;
|
|
310
|
+
};
|
|
311
|
+
readonly imageLoading: {
|
|
312
|
+
readonly type: PropType<"eager" | "lazy">;
|
|
313
|
+
readonly default: "lazy";
|
|
314
|
+
};
|
|
315
|
+
readonly composerPlaceholder: {
|
|
316
|
+
readonly type: StringConstructor;
|
|
317
|
+
readonly default: "Write a message";
|
|
318
|
+
};
|
|
319
|
+
readonly composerAriaLabel: {
|
|
320
|
+
readonly type: StringConstructor;
|
|
321
|
+
readonly default: "Message";
|
|
322
|
+
};
|
|
323
|
+
readonly composerProps: {
|
|
324
|
+
readonly type: PropType<Omit<TextareaHTMLAttributes, "value" | "disabled">>;
|
|
325
|
+
readonly default: undefined;
|
|
326
|
+
};
|
|
327
|
+
readonly modelValue: {
|
|
328
|
+
readonly type: StringConstructor;
|
|
329
|
+
readonly default: undefined;
|
|
330
|
+
};
|
|
331
|
+
readonly defaultDraft: {
|
|
332
|
+
readonly type: StringConstructor;
|
|
333
|
+
readonly default: "";
|
|
334
|
+
};
|
|
335
|
+
readonly onDraftChange: {
|
|
336
|
+
readonly type: PropType<(value: string) => void>;
|
|
337
|
+
readonly default: undefined;
|
|
338
|
+
};
|
|
339
|
+
readonly classNames: {
|
|
340
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, string>>>;
|
|
341
|
+
readonly default: undefined;
|
|
342
|
+
};
|
|
343
|
+
readonly styles: {
|
|
344
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, CSSProperties>>>;
|
|
345
|
+
readonly default: undefined;
|
|
346
|
+
};
|
|
347
|
+
readonly density: {
|
|
348
|
+
readonly type: PropType<ConvoKitUiDensity>;
|
|
349
|
+
readonly default: "comfortable";
|
|
350
|
+
};
|
|
351
|
+
readonly unstyled: {
|
|
352
|
+
readonly type: BooleanConstructor;
|
|
353
|
+
readonly default: false;
|
|
354
|
+
};
|
|
355
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
356
|
+
[key: string]: any;
|
|
357
|
+
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("load-older" | "attachment-click" | "send-message" | "typing-change" | "back" | "refresh" | "add-attachment" | "update:modelValue")[], "load-older" | "attachment-click" | "send-message" | "typing-change" | "back" | "refresh" | "add-attachment" | "update:modelValue", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
358
|
+
readonly conversation: {
|
|
359
|
+
readonly type: PropType<Conversation$1>;
|
|
360
|
+
readonly required: true;
|
|
361
|
+
};
|
|
362
|
+
readonly messages: {
|
|
363
|
+
readonly type: PropType<readonly Message[]>;
|
|
364
|
+
readonly required: true;
|
|
365
|
+
};
|
|
366
|
+
readonly currentUserId: {
|
|
367
|
+
readonly type: StringConstructor;
|
|
368
|
+
readonly required: true;
|
|
369
|
+
};
|
|
370
|
+
readonly onSendMessage: {
|
|
371
|
+
readonly type: PropType<(text: string) => boolean | void | Promise<boolean | void>>;
|
|
372
|
+
readonly required: true;
|
|
373
|
+
};
|
|
374
|
+
readonly typingUserIds: {
|
|
375
|
+
readonly type: PropType<ReadonlySet<string>>;
|
|
376
|
+
readonly default: () => Set<unknown>;
|
|
377
|
+
};
|
|
378
|
+
readonly readAtByUserId: {
|
|
379
|
+
readonly type: PropType<ReadonlyMap<string, Date>>;
|
|
380
|
+
readonly default: () => Map<any, any>;
|
|
381
|
+
};
|
|
382
|
+
readonly readersResolver: {
|
|
383
|
+
readonly type: PropType<(message: Message) => ReadonlySet<string>>;
|
|
384
|
+
readonly default: undefined;
|
|
385
|
+
};
|
|
386
|
+
readonly onBack: {
|
|
387
|
+
readonly type: PropType<() => void>;
|
|
388
|
+
readonly default: undefined;
|
|
389
|
+
};
|
|
390
|
+
readonly onRefresh: {
|
|
391
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
392
|
+
readonly default: undefined;
|
|
393
|
+
};
|
|
394
|
+
readonly onLoadOlder: {
|
|
395
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
396
|
+
readonly default: undefined;
|
|
397
|
+
};
|
|
398
|
+
readonly onTypingChange: {
|
|
399
|
+
readonly type: PropType<(isTyping: boolean) => void | Promise<void>>;
|
|
400
|
+
readonly default: undefined;
|
|
401
|
+
};
|
|
402
|
+
readonly onAddAttachment: {
|
|
403
|
+
readonly type: PropType<() => void>;
|
|
404
|
+
readonly default: undefined;
|
|
405
|
+
};
|
|
406
|
+
readonly onAttachmentClick: {
|
|
407
|
+
readonly type: PropType<(media: MessageMedia, message: Message) => void>;
|
|
408
|
+
readonly default: undefined;
|
|
409
|
+
};
|
|
410
|
+
readonly isInitialLoading: {
|
|
411
|
+
readonly type: BooleanConstructor;
|
|
412
|
+
readonly default: false;
|
|
413
|
+
};
|
|
414
|
+
readonly isLoadingOlder: {
|
|
415
|
+
readonly type: BooleanConstructor;
|
|
416
|
+
readonly default: false;
|
|
417
|
+
};
|
|
418
|
+
readonly isSending: {
|
|
419
|
+
readonly type: BooleanConstructor;
|
|
420
|
+
readonly default: false;
|
|
421
|
+
};
|
|
422
|
+
readonly hasOlderMessages: {
|
|
423
|
+
readonly type: BooleanConstructor;
|
|
424
|
+
readonly default: false;
|
|
425
|
+
};
|
|
426
|
+
readonly error: {
|
|
427
|
+
readonly type: PropType<unknown>;
|
|
428
|
+
readonly required: false;
|
|
429
|
+
};
|
|
430
|
+
readonly messageError: {
|
|
431
|
+
readonly type: PropType<unknown>;
|
|
432
|
+
readonly required: false;
|
|
433
|
+
};
|
|
434
|
+
readonly displayNameForUser: {
|
|
435
|
+
readonly type: PropType<(userId: string) => string | null | undefined>;
|
|
436
|
+
readonly default: undefined;
|
|
437
|
+
};
|
|
438
|
+
readonly reverseMessages: {
|
|
439
|
+
readonly type: BooleanConstructor;
|
|
440
|
+
readonly default: true;
|
|
441
|
+
};
|
|
442
|
+
readonly stickToBottom: {
|
|
443
|
+
readonly type: BooleanConstructor;
|
|
444
|
+
readonly default: true;
|
|
445
|
+
};
|
|
446
|
+
readonly paginationThreshold: {
|
|
447
|
+
readonly type: NumberConstructor;
|
|
448
|
+
readonly default: 240;
|
|
449
|
+
};
|
|
450
|
+
readonly formatTime: {
|
|
451
|
+
readonly type: PropType<(date: Date) => string>;
|
|
452
|
+
readonly default: undefined;
|
|
453
|
+
};
|
|
454
|
+
readonly imageLoading: {
|
|
455
|
+
readonly type: PropType<"eager" | "lazy">;
|
|
456
|
+
readonly default: "lazy";
|
|
457
|
+
};
|
|
458
|
+
readonly composerPlaceholder: {
|
|
459
|
+
readonly type: StringConstructor;
|
|
460
|
+
readonly default: "Write a message";
|
|
461
|
+
};
|
|
462
|
+
readonly composerAriaLabel: {
|
|
463
|
+
readonly type: StringConstructor;
|
|
464
|
+
readonly default: "Message";
|
|
465
|
+
};
|
|
466
|
+
readonly composerProps: {
|
|
467
|
+
readonly type: PropType<Omit<TextareaHTMLAttributes, "value" | "disabled">>;
|
|
468
|
+
readonly default: undefined;
|
|
469
|
+
};
|
|
470
|
+
readonly modelValue: {
|
|
471
|
+
readonly type: StringConstructor;
|
|
472
|
+
readonly default: undefined;
|
|
473
|
+
};
|
|
474
|
+
readonly defaultDraft: {
|
|
475
|
+
readonly type: StringConstructor;
|
|
476
|
+
readonly default: "";
|
|
477
|
+
};
|
|
478
|
+
readonly onDraftChange: {
|
|
479
|
+
readonly type: PropType<(value: string) => void>;
|
|
480
|
+
readonly default: undefined;
|
|
481
|
+
};
|
|
482
|
+
readonly classNames: {
|
|
483
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, string>>>;
|
|
484
|
+
readonly default: undefined;
|
|
485
|
+
};
|
|
486
|
+
readonly styles: {
|
|
487
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, CSSProperties>>>;
|
|
488
|
+
readonly default: undefined;
|
|
489
|
+
};
|
|
490
|
+
readonly density: {
|
|
491
|
+
readonly type: PropType<ConvoKitUiDensity>;
|
|
492
|
+
readonly default: "comfortable";
|
|
493
|
+
};
|
|
494
|
+
readonly unstyled: {
|
|
495
|
+
readonly type: BooleanConstructor;
|
|
496
|
+
readonly default: false;
|
|
497
|
+
};
|
|
498
|
+
}>> & Readonly<{
|
|
499
|
+
"onLoad-older"?: (...args: any[]) => any;
|
|
500
|
+
"onAttachment-click"?: (...args: any[]) => any;
|
|
501
|
+
onBack?: (...args: any[]) => any;
|
|
502
|
+
onRefresh?: (...args: any[]) => any;
|
|
503
|
+
"onSend-message"?: (...args: any[]) => any;
|
|
504
|
+
"onTyping-change"?: (...args: any[]) => any;
|
|
505
|
+
"onAdd-attachment"?: (...args: any[]) => any;
|
|
506
|
+
"onUpdate:modelValue"?: (...args: any[]) => any;
|
|
507
|
+
}>, {
|
|
508
|
+
readonly readAtByUserId: ReadonlyMap<string, Date>;
|
|
509
|
+
readonly readersResolver: (message: Message) => ReadonlySet<string>;
|
|
510
|
+
readonly onLoadOlder: () => void | Promise<void>;
|
|
511
|
+
readonly hasOlderMessages: boolean;
|
|
512
|
+
readonly isLoadingOlder: boolean;
|
|
513
|
+
readonly onAttachmentClick: (media: MessageMedia, message: Message) => void;
|
|
514
|
+
readonly paginationThreshold: number;
|
|
515
|
+
readonly stickToBottom: boolean;
|
|
516
|
+
readonly formatTime: (date: Date) => string;
|
|
517
|
+
readonly imageLoading: "eager" | "lazy";
|
|
518
|
+
readonly classNames: Partial<Record<ConvoKitUiPart, string>>;
|
|
519
|
+
readonly styles: Partial<Record<ConvoKitUiPart, CSSProperties>>;
|
|
520
|
+
readonly density: ConvoKitUiDensity;
|
|
521
|
+
readonly unstyled: boolean;
|
|
522
|
+
readonly typingUserIds: ReadonlySet<string>;
|
|
523
|
+
readonly onBack: () => void;
|
|
524
|
+
readonly onRefresh: () => void | Promise<void>;
|
|
525
|
+
readonly onTypingChange: (isTyping: boolean) => void | Promise<void>;
|
|
526
|
+
readonly onAddAttachment: () => void;
|
|
527
|
+
readonly isInitialLoading: boolean;
|
|
528
|
+
readonly isSending: boolean;
|
|
529
|
+
readonly displayNameForUser: (userId: string) => string | null | undefined;
|
|
530
|
+
readonly reverseMessages: boolean;
|
|
531
|
+
readonly composerPlaceholder: string;
|
|
532
|
+
readonly composerAriaLabel: string;
|
|
533
|
+
readonly composerProps: Omit<TextareaHTMLAttributes, "value" | "disabled">;
|
|
534
|
+
readonly modelValue: string;
|
|
535
|
+
readonly defaultDraft: string;
|
|
536
|
+
readonly onDraftChange: (value: string) => void;
|
|
537
|
+
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
538
|
+
interface ConversationProps extends Omit<ConversationViewProps, 'conversation' | 'messages' | 'currentUserId' | 'onSendMessage' | 'typingUserIds' | 'readAtByUserId' | 'onRefresh' | 'onLoadOlder' | 'onTypingChange' | 'isInitialLoading' | 'isLoadingOlder' | 'isSending' | 'hasOlderMessages' | 'error'>, Omit<UseConversationOptions, 'client' | 'conversationId'> {
|
|
539
|
+
client: ConvoKitUiClient;
|
|
540
|
+
conversationId: string;
|
|
541
|
+
onControllerChange?: (controller: ConversationController) => void;
|
|
542
|
+
}
|
|
543
|
+
/** Plug-and-play SDK-backed UI for one conversation. */
|
|
544
|
+
declare const Conversation: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
545
|
+
conversation: {
|
|
546
|
+
type: PropType<Conversation$1>;
|
|
547
|
+
default: undefined;
|
|
548
|
+
};
|
|
549
|
+
messages: {
|
|
550
|
+
type: PropType<readonly Message[]>;
|
|
551
|
+
default: () => never[];
|
|
552
|
+
};
|
|
553
|
+
currentUserId: {
|
|
554
|
+
type: StringConstructor;
|
|
555
|
+
default: string;
|
|
556
|
+
};
|
|
557
|
+
onSendMessage: {
|
|
558
|
+
type: PropType<(text: string) => boolean | void | Promise<boolean | void>>;
|
|
559
|
+
default: undefined;
|
|
560
|
+
};
|
|
561
|
+
client: {
|
|
562
|
+
type: PropType<ConvoKitUiClient>;
|
|
563
|
+
required: true;
|
|
564
|
+
};
|
|
565
|
+
conversationId: {
|
|
566
|
+
type: StringConstructor;
|
|
567
|
+
required: true;
|
|
568
|
+
};
|
|
569
|
+
messagePageSize: {
|
|
570
|
+
type: NumberConstructor;
|
|
571
|
+
default: number;
|
|
572
|
+
};
|
|
573
|
+
markReadOnLoad: {
|
|
574
|
+
type: BooleanConstructor;
|
|
575
|
+
default: boolean;
|
|
576
|
+
};
|
|
577
|
+
markReadOnReceive: {
|
|
578
|
+
type: BooleanConstructor;
|
|
579
|
+
default: boolean;
|
|
580
|
+
};
|
|
581
|
+
typingTimeoutMs: {
|
|
582
|
+
type: NumberConstructor;
|
|
583
|
+
default: number;
|
|
584
|
+
};
|
|
585
|
+
autoLoad: {
|
|
586
|
+
type: BooleanConstructor;
|
|
587
|
+
default: boolean;
|
|
588
|
+
};
|
|
589
|
+
onControllerChange: {
|
|
590
|
+
type: PropType<(controller: ConversationController) => void>;
|
|
591
|
+
default: undefined;
|
|
592
|
+
};
|
|
593
|
+
typingUserIds: {
|
|
594
|
+
readonly type: PropType<ReadonlySet<string>>;
|
|
595
|
+
readonly default: () => Set<unknown>;
|
|
596
|
+
};
|
|
597
|
+
readAtByUserId: {
|
|
598
|
+
readonly type: PropType<ReadonlyMap<string, Date>>;
|
|
599
|
+
readonly default: () => Map<any, any>;
|
|
600
|
+
};
|
|
601
|
+
readersResolver: {
|
|
602
|
+
readonly type: PropType<(message: Message) => ReadonlySet<string>>;
|
|
603
|
+
readonly default: undefined;
|
|
604
|
+
};
|
|
605
|
+
onBack: {
|
|
606
|
+
readonly type: PropType<() => void>;
|
|
607
|
+
readonly default: undefined;
|
|
608
|
+
};
|
|
609
|
+
onRefresh: {
|
|
610
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
611
|
+
readonly default: undefined;
|
|
612
|
+
};
|
|
613
|
+
onLoadOlder: {
|
|
614
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
615
|
+
readonly default: undefined;
|
|
616
|
+
};
|
|
617
|
+
onTypingChange: {
|
|
618
|
+
readonly type: PropType<(isTyping: boolean) => void | Promise<void>>;
|
|
619
|
+
readonly default: undefined;
|
|
620
|
+
};
|
|
621
|
+
onAddAttachment: {
|
|
622
|
+
readonly type: PropType<() => void>;
|
|
623
|
+
readonly default: undefined;
|
|
624
|
+
};
|
|
625
|
+
onAttachmentClick: {
|
|
626
|
+
readonly type: PropType<(media: MessageMedia, message: Message) => void>;
|
|
627
|
+
readonly default: undefined;
|
|
628
|
+
};
|
|
629
|
+
isInitialLoading: {
|
|
630
|
+
readonly type: BooleanConstructor;
|
|
631
|
+
readonly default: false;
|
|
632
|
+
};
|
|
633
|
+
isLoadingOlder: {
|
|
634
|
+
readonly type: BooleanConstructor;
|
|
635
|
+
readonly default: false;
|
|
636
|
+
};
|
|
637
|
+
isSending: {
|
|
638
|
+
readonly type: BooleanConstructor;
|
|
639
|
+
readonly default: false;
|
|
640
|
+
};
|
|
641
|
+
hasOlderMessages: {
|
|
642
|
+
readonly type: BooleanConstructor;
|
|
643
|
+
readonly default: false;
|
|
644
|
+
};
|
|
645
|
+
error: {
|
|
646
|
+
readonly type: PropType<unknown>;
|
|
647
|
+
readonly required: false;
|
|
648
|
+
};
|
|
649
|
+
messageError: {
|
|
650
|
+
readonly type: PropType<unknown>;
|
|
651
|
+
readonly required: false;
|
|
652
|
+
};
|
|
653
|
+
displayNameForUser: {
|
|
654
|
+
readonly type: PropType<(userId: string) => string | null | undefined>;
|
|
655
|
+
readonly default: undefined;
|
|
656
|
+
};
|
|
657
|
+
reverseMessages: {
|
|
658
|
+
readonly type: BooleanConstructor;
|
|
659
|
+
readonly default: true;
|
|
660
|
+
};
|
|
661
|
+
stickToBottom: {
|
|
662
|
+
readonly type: BooleanConstructor;
|
|
663
|
+
readonly default: true;
|
|
664
|
+
};
|
|
665
|
+
paginationThreshold: {
|
|
666
|
+
readonly type: NumberConstructor;
|
|
667
|
+
readonly default: 240;
|
|
668
|
+
};
|
|
669
|
+
formatTime: {
|
|
670
|
+
readonly type: PropType<(date: Date) => string>;
|
|
671
|
+
readonly default: undefined;
|
|
672
|
+
};
|
|
673
|
+
imageLoading: {
|
|
674
|
+
readonly type: PropType<"eager" | "lazy">;
|
|
675
|
+
readonly default: "lazy";
|
|
676
|
+
};
|
|
677
|
+
composerPlaceholder: {
|
|
678
|
+
readonly type: StringConstructor;
|
|
679
|
+
readonly default: "Write a message";
|
|
680
|
+
};
|
|
681
|
+
composerAriaLabel: {
|
|
682
|
+
readonly type: StringConstructor;
|
|
683
|
+
readonly default: "Message";
|
|
684
|
+
};
|
|
685
|
+
composerProps: {
|
|
686
|
+
readonly type: PropType<Omit<TextareaHTMLAttributes, "value" | "disabled">>;
|
|
687
|
+
readonly default: undefined;
|
|
688
|
+
};
|
|
689
|
+
modelValue: {
|
|
690
|
+
readonly type: StringConstructor;
|
|
691
|
+
readonly default: undefined;
|
|
692
|
+
};
|
|
693
|
+
defaultDraft: {
|
|
694
|
+
readonly type: StringConstructor;
|
|
695
|
+
readonly default: "";
|
|
696
|
+
};
|
|
697
|
+
onDraftChange: {
|
|
698
|
+
readonly type: PropType<(value: string) => void>;
|
|
699
|
+
readonly default: undefined;
|
|
700
|
+
};
|
|
701
|
+
classNames: {
|
|
702
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, string>>>;
|
|
703
|
+
readonly default: undefined;
|
|
704
|
+
};
|
|
705
|
+
styles: {
|
|
706
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, CSSProperties>>>;
|
|
707
|
+
readonly default: undefined;
|
|
708
|
+
};
|
|
709
|
+
density: {
|
|
710
|
+
readonly type: PropType<ConvoKitUiDensity>;
|
|
711
|
+
readonly default: "comfortable";
|
|
712
|
+
};
|
|
713
|
+
unstyled: {
|
|
714
|
+
readonly type: BooleanConstructor;
|
|
715
|
+
readonly default: false;
|
|
716
|
+
};
|
|
717
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
718
|
+
[key: string]: any;
|
|
719
|
+
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("load-older" | "attachment-click" | "send-message" | "typing-change" | "back" | "refresh" | "add-attachment" | "update:modelValue" | "controller-change")[], "load-older" | "attachment-click" | "send-message" | "typing-change" | "back" | "refresh" | "add-attachment" | "update:modelValue" | "controller-change", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
720
|
+
conversation: {
|
|
721
|
+
type: PropType<Conversation$1>;
|
|
722
|
+
default: undefined;
|
|
723
|
+
};
|
|
724
|
+
messages: {
|
|
725
|
+
type: PropType<readonly Message[]>;
|
|
726
|
+
default: () => never[];
|
|
727
|
+
};
|
|
728
|
+
currentUserId: {
|
|
729
|
+
type: StringConstructor;
|
|
730
|
+
default: string;
|
|
731
|
+
};
|
|
732
|
+
onSendMessage: {
|
|
733
|
+
type: PropType<(text: string) => boolean | void | Promise<boolean | void>>;
|
|
734
|
+
default: undefined;
|
|
735
|
+
};
|
|
736
|
+
client: {
|
|
737
|
+
type: PropType<ConvoKitUiClient>;
|
|
738
|
+
required: true;
|
|
739
|
+
};
|
|
740
|
+
conversationId: {
|
|
741
|
+
type: StringConstructor;
|
|
742
|
+
required: true;
|
|
743
|
+
};
|
|
744
|
+
messagePageSize: {
|
|
745
|
+
type: NumberConstructor;
|
|
746
|
+
default: number;
|
|
747
|
+
};
|
|
748
|
+
markReadOnLoad: {
|
|
749
|
+
type: BooleanConstructor;
|
|
750
|
+
default: boolean;
|
|
751
|
+
};
|
|
752
|
+
markReadOnReceive: {
|
|
753
|
+
type: BooleanConstructor;
|
|
754
|
+
default: boolean;
|
|
755
|
+
};
|
|
756
|
+
typingTimeoutMs: {
|
|
757
|
+
type: NumberConstructor;
|
|
758
|
+
default: number;
|
|
759
|
+
};
|
|
760
|
+
autoLoad: {
|
|
761
|
+
type: BooleanConstructor;
|
|
762
|
+
default: boolean;
|
|
763
|
+
};
|
|
764
|
+
onControllerChange: {
|
|
765
|
+
type: PropType<(controller: ConversationController) => void>;
|
|
766
|
+
default: undefined;
|
|
767
|
+
};
|
|
768
|
+
typingUserIds: {
|
|
769
|
+
readonly type: PropType<ReadonlySet<string>>;
|
|
770
|
+
readonly default: () => Set<unknown>;
|
|
771
|
+
};
|
|
772
|
+
readAtByUserId: {
|
|
773
|
+
readonly type: PropType<ReadonlyMap<string, Date>>;
|
|
774
|
+
readonly default: () => Map<any, any>;
|
|
775
|
+
};
|
|
776
|
+
readersResolver: {
|
|
777
|
+
readonly type: PropType<(message: Message) => ReadonlySet<string>>;
|
|
778
|
+
readonly default: undefined;
|
|
779
|
+
};
|
|
780
|
+
onBack: {
|
|
781
|
+
readonly type: PropType<() => void>;
|
|
782
|
+
readonly default: undefined;
|
|
783
|
+
};
|
|
784
|
+
onRefresh: {
|
|
785
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
786
|
+
readonly default: undefined;
|
|
787
|
+
};
|
|
788
|
+
onLoadOlder: {
|
|
789
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
790
|
+
readonly default: undefined;
|
|
791
|
+
};
|
|
792
|
+
onTypingChange: {
|
|
793
|
+
readonly type: PropType<(isTyping: boolean) => void | Promise<void>>;
|
|
794
|
+
readonly default: undefined;
|
|
795
|
+
};
|
|
796
|
+
onAddAttachment: {
|
|
797
|
+
readonly type: PropType<() => void>;
|
|
798
|
+
readonly default: undefined;
|
|
799
|
+
};
|
|
800
|
+
onAttachmentClick: {
|
|
801
|
+
readonly type: PropType<(media: MessageMedia, message: Message) => void>;
|
|
802
|
+
readonly default: undefined;
|
|
803
|
+
};
|
|
804
|
+
isInitialLoading: {
|
|
805
|
+
readonly type: BooleanConstructor;
|
|
806
|
+
readonly default: false;
|
|
807
|
+
};
|
|
808
|
+
isLoadingOlder: {
|
|
809
|
+
readonly type: BooleanConstructor;
|
|
810
|
+
readonly default: false;
|
|
811
|
+
};
|
|
812
|
+
isSending: {
|
|
813
|
+
readonly type: BooleanConstructor;
|
|
814
|
+
readonly default: false;
|
|
815
|
+
};
|
|
816
|
+
hasOlderMessages: {
|
|
817
|
+
readonly type: BooleanConstructor;
|
|
818
|
+
readonly default: false;
|
|
819
|
+
};
|
|
820
|
+
error: {
|
|
821
|
+
readonly type: PropType<unknown>;
|
|
822
|
+
readonly required: false;
|
|
823
|
+
};
|
|
824
|
+
messageError: {
|
|
825
|
+
readonly type: PropType<unknown>;
|
|
826
|
+
readonly required: false;
|
|
827
|
+
};
|
|
828
|
+
displayNameForUser: {
|
|
829
|
+
readonly type: PropType<(userId: string) => string | null | undefined>;
|
|
830
|
+
readonly default: undefined;
|
|
831
|
+
};
|
|
832
|
+
reverseMessages: {
|
|
833
|
+
readonly type: BooleanConstructor;
|
|
834
|
+
readonly default: true;
|
|
835
|
+
};
|
|
836
|
+
stickToBottom: {
|
|
837
|
+
readonly type: BooleanConstructor;
|
|
838
|
+
readonly default: true;
|
|
839
|
+
};
|
|
840
|
+
paginationThreshold: {
|
|
841
|
+
readonly type: NumberConstructor;
|
|
842
|
+
readonly default: 240;
|
|
843
|
+
};
|
|
844
|
+
formatTime: {
|
|
845
|
+
readonly type: PropType<(date: Date) => string>;
|
|
846
|
+
readonly default: undefined;
|
|
847
|
+
};
|
|
848
|
+
imageLoading: {
|
|
849
|
+
readonly type: PropType<"eager" | "lazy">;
|
|
850
|
+
readonly default: "lazy";
|
|
851
|
+
};
|
|
852
|
+
composerPlaceholder: {
|
|
853
|
+
readonly type: StringConstructor;
|
|
854
|
+
readonly default: "Write a message";
|
|
855
|
+
};
|
|
856
|
+
composerAriaLabel: {
|
|
857
|
+
readonly type: StringConstructor;
|
|
858
|
+
readonly default: "Message";
|
|
859
|
+
};
|
|
860
|
+
composerProps: {
|
|
861
|
+
readonly type: PropType<Omit<TextareaHTMLAttributes, "value" | "disabled">>;
|
|
862
|
+
readonly default: undefined;
|
|
863
|
+
};
|
|
864
|
+
modelValue: {
|
|
865
|
+
readonly type: StringConstructor;
|
|
866
|
+
readonly default: undefined;
|
|
867
|
+
};
|
|
868
|
+
defaultDraft: {
|
|
869
|
+
readonly type: StringConstructor;
|
|
870
|
+
readonly default: "";
|
|
871
|
+
};
|
|
872
|
+
onDraftChange: {
|
|
873
|
+
readonly type: PropType<(value: string) => void>;
|
|
874
|
+
readonly default: undefined;
|
|
875
|
+
};
|
|
876
|
+
classNames: {
|
|
877
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, string>>>;
|
|
878
|
+
readonly default: undefined;
|
|
879
|
+
};
|
|
880
|
+
styles: {
|
|
881
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, CSSProperties>>>;
|
|
882
|
+
readonly default: undefined;
|
|
883
|
+
};
|
|
884
|
+
density: {
|
|
885
|
+
readonly type: PropType<ConvoKitUiDensity>;
|
|
886
|
+
readonly default: "comfortable";
|
|
887
|
+
};
|
|
888
|
+
unstyled: {
|
|
889
|
+
readonly type: BooleanConstructor;
|
|
890
|
+
readonly default: false;
|
|
891
|
+
};
|
|
892
|
+
}>> & Readonly<{
|
|
893
|
+
"onLoad-older"?: (...args: any[]) => any;
|
|
894
|
+
"onAttachment-click"?: (...args: any[]) => any;
|
|
895
|
+
onBack?: (...args: any[]) => any;
|
|
896
|
+
onRefresh?: (...args: any[]) => any;
|
|
897
|
+
"onSend-message"?: (...args: any[]) => any;
|
|
898
|
+
"onTyping-change"?: (...args: any[]) => any;
|
|
899
|
+
"onAdd-attachment"?: (...args: any[]) => any;
|
|
900
|
+
"onUpdate:modelValue"?: (...args: any[]) => any;
|
|
901
|
+
"onController-change"?: (...args: any[]) => any;
|
|
902
|
+
}>, {
|
|
903
|
+
messages: readonly Message[];
|
|
904
|
+
conversation: Conversation$1;
|
|
905
|
+
currentUserId: string;
|
|
906
|
+
readAtByUserId: ReadonlyMap<string, Date>;
|
|
907
|
+
readersResolver: (message: Message) => ReadonlySet<string>;
|
|
908
|
+
onLoadOlder: () => void | Promise<void>;
|
|
909
|
+
hasOlderMessages: boolean;
|
|
910
|
+
isLoadingOlder: boolean;
|
|
911
|
+
onAttachmentClick: (media: MessageMedia, message: Message) => void;
|
|
912
|
+
paginationThreshold: number;
|
|
913
|
+
stickToBottom: boolean;
|
|
914
|
+
formatTime: (date: Date) => string;
|
|
915
|
+
imageLoading: "eager" | "lazy";
|
|
916
|
+
classNames: Partial<Record<ConvoKitUiPart, string>>;
|
|
917
|
+
styles: Partial<Record<ConvoKitUiPart, CSSProperties>>;
|
|
918
|
+
density: ConvoKitUiDensity;
|
|
919
|
+
unstyled: boolean;
|
|
920
|
+
onSendMessage: (text: string) => boolean | void | Promise<boolean | void>;
|
|
921
|
+
typingUserIds: ReadonlySet<string>;
|
|
922
|
+
onBack: () => void;
|
|
923
|
+
onRefresh: () => void | Promise<void>;
|
|
924
|
+
onTypingChange: (isTyping: boolean) => void | Promise<void>;
|
|
925
|
+
onAddAttachment: () => void;
|
|
926
|
+
isInitialLoading: boolean;
|
|
927
|
+
isSending: boolean;
|
|
928
|
+
displayNameForUser: (userId: string) => string | null | undefined;
|
|
929
|
+
reverseMessages: boolean;
|
|
930
|
+
composerPlaceholder: string;
|
|
931
|
+
composerAriaLabel: string;
|
|
932
|
+
composerProps: Omit<TextareaHTMLAttributes, "value" | "disabled">;
|
|
933
|
+
modelValue: string;
|
|
934
|
+
defaultDraft: string;
|
|
935
|
+
onDraftChange: (value: string) => void;
|
|
936
|
+
messagePageSize: number;
|
|
937
|
+
markReadOnLoad: boolean;
|
|
938
|
+
markReadOnReceive: boolean;
|
|
939
|
+
typingTimeoutMs: number;
|
|
940
|
+
autoLoad: boolean;
|
|
941
|
+
onControllerChange: (controller: ConversationController) => void;
|
|
942
|
+
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
943
|
+
|
|
944
|
+
interface UseConversationListOptions {
|
|
945
|
+
client: MaybeRefOrGetter<ConvoKitUiClient>;
|
|
946
|
+
pageLoader?: ConversationPageLoader;
|
|
947
|
+
initialFilter?: ConversationFilter;
|
|
948
|
+
pageSize?: number;
|
|
949
|
+
autoLoad?: boolean;
|
|
950
|
+
}
|
|
951
|
+
interface ConversationListController extends ConversationListState {
|
|
952
|
+
loadInitial(): Promise<void>;
|
|
953
|
+
refresh(): Promise<void>;
|
|
954
|
+
loadMore(): Promise<void>;
|
|
955
|
+
setFilter(filter: ConversationFilter): Promise<void>;
|
|
956
|
+
setQuery(query: string): Promise<void>;
|
|
957
|
+
dispose(): Promise<void>;
|
|
958
|
+
}
|
|
959
|
+
/** Loads, de-duplicates, filters, and paginates conversations. */
|
|
960
|
+
declare function useConversationList(options: UseConversationListOptions): ConversationListController;
|
|
961
|
+
|
|
962
|
+
interface ConversationListViewProps extends ConvoKitAppearanceProps {
|
|
963
|
+
conversations: readonly Conversation$1[];
|
|
964
|
+
selectedConversationId?: string;
|
|
965
|
+
onConversationSelect?: (conversation: Conversation$1) => void;
|
|
966
|
+
onRefresh?: () => void | Promise<void>;
|
|
967
|
+
onLoadMore?: () => void | Promise<void>;
|
|
968
|
+
isInitialLoading?: boolean;
|
|
969
|
+
isLoadingMore?: boolean;
|
|
970
|
+
hasMore?: boolean;
|
|
971
|
+
error?: unknown;
|
|
972
|
+
scrollElement?: Ref<HTMLElement | null>;
|
|
973
|
+
paginationThreshold?: number;
|
|
974
|
+
ariaLabel?: string;
|
|
975
|
+
class?: unknown;
|
|
976
|
+
style?: unknown;
|
|
977
|
+
}
|
|
978
|
+
/** Controlled conversation list. It can be used with any state-management layer. */
|
|
979
|
+
declare const ConversationListView: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
980
|
+
readonly conversations: {
|
|
981
|
+
readonly type: PropType<readonly Conversation$1[]>;
|
|
982
|
+
readonly required: true;
|
|
983
|
+
};
|
|
984
|
+
readonly selectedConversationId: {
|
|
985
|
+
readonly type: StringConstructor;
|
|
986
|
+
readonly default: undefined;
|
|
987
|
+
};
|
|
988
|
+
readonly onConversationSelect: {
|
|
989
|
+
readonly type: PropType<(conversation: Conversation$1) => void>;
|
|
990
|
+
readonly default: undefined;
|
|
991
|
+
};
|
|
992
|
+
readonly onRefresh: {
|
|
993
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
994
|
+
readonly default: undefined;
|
|
995
|
+
};
|
|
996
|
+
readonly onLoadMore: {
|
|
997
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
998
|
+
readonly default: undefined;
|
|
999
|
+
};
|
|
1000
|
+
readonly isInitialLoading: {
|
|
1001
|
+
readonly type: BooleanConstructor;
|
|
1002
|
+
readonly default: false;
|
|
1003
|
+
};
|
|
1004
|
+
readonly isLoadingMore: {
|
|
1005
|
+
readonly type: BooleanConstructor;
|
|
1006
|
+
readonly default: false;
|
|
1007
|
+
};
|
|
1008
|
+
readonly hasMore: {
|
|
1009
|
+
readonly type: BooleanConstructor;
|
|
1010
|
+
readonly default: false;
|
|
1011
|
+
};
|
|
1012
|
+
readonly error: {
|
|
1013
|
+
readonly type: PropType<unknown>;
|
|
1014
|
+
readonly required: false;
|
|
1015
|
+
};
|
|
1016
|
+
readonly scrollElement: {
|
|
1017
|
+
readonly type: PropType<Ref<HTMLElement | null>>;
|
|
1018
|
+
readonly default: undefined;
|
|
1019
|
+
};
|
|
1020
|
+
readonly paginationThreshold: {
|
|
1021
|
+
readonly type: NumberConstructor;
|
|
1022
|
+
readonly default: 240;
|
|
1023
|
+
};
|
|
1024
|
+
readonly ariaLabel: {
|
|
1025
|
+
readonly type: StringConstructor;
|
|
1026
|
+
readonly default: "Conversations";
|
|
1027
|
+
};
|
|
1028
|
+
readonly classNames: {
|
|
1029
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, string>>>;
|
|
1030
|
+
readonly default: undefined;
|
|
1031
|
+
};
|
|
1032
|
+
readonly styles: {
|
|
1033
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, CSSProperties>>>;
|
|
1034
|
+
readonly default: undefined;
|
|
1035
|
+
};
|
|
1036
|
+
readonly density: {
|
|
1037
|
+
readonly type: PropType<ConvoKitUiDensity>;
|
|
1038
|
+
readonly default: "comfortable";
|
|
1039
|
+
};
|
|
1040
|
+
readonly unstyled: {
|
|
1041
|
+
readonly type: BooleanConstructor;
|
|
1042
|
+
readonly default: false;
|
|
1043
|
+
};
|
|
1044
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
1045
|
+
[key: string]: any;
|
|
1046
|
+
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
|
|
1047
|
+
'conversation-select': (_conversation: Conversation$1) => true;
|
|
1048
|
+
refresh: () => true;
|
|
1049
|
+
'load-more': () => true;
|
|
1050
|
+
}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
1051
|
+
readonly conversations: {
|
|
1052
|
+
readonly type: PropType<readonly Conversation$1[]>;
|
|
1053
|
+
readonly required: true;
|
|
1054
|
+
};
|
|
1055
|
+
readonly selectedConversationId: {
|
|
1056
|
+
readonly type: StringConstructor;
|
|
1057
|
+
readonly default: undefined;
|
|
1058
|
+
};
|
|
1059
|
+
readonly onConversationSelect: {
|
|
1060
|
+
readonly type: PropType<(conversation: Conversation$1) => void>;
|
|
1061
|
+
readonly default: undefined;
|
|
1062
|
+
};
|
|
1063
|
+
readonly onRefresh: {
|
|
1064
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
1065
|
+
readonly default: undefined;
|
|
1066
|
+
};
|
|
1067
|
+
readonly onLoadMore: {
|
|
1068
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
1069
|
+
readonly default: undefined;
|
|
1070
|
+
};
|
|
1071
|
+
readonly isInitialLoading: {
|
|
1072
|
+
readonly type: BooleanConstructor;
|
|
1073
|
+
readonly default: false;
|
|
1074
|
+
};
|
|
1075
|
+
readonly isLoadingMore: {
|
|
1076
|
+
readonly type: BooleanConstructor;
|
|
1077
|
+
readonly default: false;
|
|
1078
|
+
};
|
|
1079
|
+
readonly hasMore: {
|
|
1080
|
+
readonly type: BooleanConstructor;
|
|
1081
|
+
readonly default: false;
|
|
1082
|
+
};
|
|
1083
|
+
readonly error: {
|
|
1084
|
+
readonly type: PropType<unknown>;
|
|
1085
|
+
readonly required: false;
|
|
1086
|
+
};
|
|
1087
|
+
readonly scrollElement: {
|
|
1088
|
+
readonly type: PropType<Ref<HTMLElement | null>>;
|
|
1089
|
+
readonly default: undefined;
|
|
1090
|
+
};
|
|
1091
|
+
readonly paginationThreshold: {
|
|
1092
|
+
readonly type: NumberConstructor;
|
|
1093
|
+
readonly default: 240;
|
|
1094
|
+
};
|
|
1095
|
+
readonly ariaLabel: {
|
|
1096
|
+
readonly type: StringConstructor;
|
|
1097
|
+
readonly default: "Conversations";
|
|
1098
|
+
};
|
|
1099
|
+
readonly classNames: {
|
|
1100
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, string>>>;
|
|
1101
|
+
readonly default: undefined;
|
|
1102
|
+
};
|
|
1103
|
+
readonly styles: {
|
|
1104
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, CSSProperties>>>;
|
|
1105
|
+
readonly default: undefined;
|
|
1106
|
+
};
|
|
1107
|
+
readonly density: {
|
|
1108
|
+
readonly type: PropType<ConvoKitUiDensity>;
|
|
1109
|
+
readonly default: "comfortable";
|
|
1110
|
+
};
|
|
1111
|
+
readonly unstyled: {
|
|
1112
|
+
readonly type: BooleanConstructor;
|
|
1113
|
+
readonly default: false;
|
|
1114
|
+
};
|
|
1115
|
+
}>> & Readonly<{
|
|
1116
|
+
onRefresh?: () => any;
|
|
1117
|
+
"onConversation-select"?: (_conversation: Conversation$1) => any;
|
|
1118
|
+
"onLoad-more"?: () => any;
|
|
1119
|
+
}>, {
|
|
1120
|
+
readonly scrollElement: Ref<HTMLElement | null, HTMLElement | null>;
|
|
1121
|
+
readonly paginationThreshold: number;
|
|
1122
|
+
readonly classNames: Partial<Record<ConvoKitUiPart, string>>;
|
|
1123
|
+
readonly styles: Partial<Record<ConvoKitUiPart, CSSProperties>>;
|
|
1124
|
+
readonly density: ConvoKitUiDensity;
|
|
1125
|
+
readonly unstyled: boolean;
|
|
1126
|
+
readonly onRefresh: () => void | Promise<void>;
|
|
1127
|
+
readonly isInitialLoading: boolean;
|
|
1128
|
+
readonly selectedConversationId: string;
|
|
1129
|
+
readonly onConversationSelect: (conversation: Conversation$1) => void;
|
|
1130
|
+
readonly onLoadMore: () => void | Promise<void>;
|
|
1131
|
+
readonly isLoadingMore: boolean;
|
|
1132
|
+
readonly hasMore: boolean;
|
|
1133
|
+
readonly ariaLabel: string;
|
|
1134
|
+
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
1135
|
+
interface ConversationListProps extends Omit<ConversationListViewProps, 'conversations' | 'onRefresh' | 'onLoadMore' | 'isInitialLoading' | 'isLoadingMore' | 'hasMore' | 'error'>, Omit<UseConversationListOptions, 'client'> {
|
|
1136
|
+
client: ConvoKitUiClient;
|
|
1137
|
+
onControllerChange?: (controller: ConversationListController) => void;
|
|
1138
|
+
}
|
|
1139
|
+
/** Plug-and-play SDK-backed conversation list. */
|
|
1140
|
+
declare const ConversationList: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
1141
|
+
conversations: {
|
|
1142
|
+
type: PropType<readonly Conversation$1[]>;
|
|
1143
|
+
default: () => never[];
|
|
1144
|
+
};
|
|
1145
|
+
client: {
|
|
1146
|
+
type: PropType<ConvoKitUiClient>;
|
|
1147
|
+
required: true;
|
|
1148
|
+
};
|
|
1149
|
+
pageLoader: {
|
|
1150
|
+
type: PropType<ConversationPageLoader>;
|
|
1151
|
+
default: undefined;
|
|
1152
|
+
};
|
|
1153
|
+
initialFilter: {
|
|
1154
|
+
type: PropType<ConversationFilter>;
|
|
1155
|
+
default: undefined;
|
|
1156
|
+
};
|
|
1157
|
+
pageSize: {
|
|
1158
|
+
type: NumberConstructor;
|
|
1159
|
+
default: number;
|
|
1160
|
+
};
|
|
1161
|
+
autoLoad: {
|
|
1162
|
+
type: BooleanConstructor;
|
|
1163
|
+
default: boolean;
|
|
1164
|
+
};
|
|
1165
|
+
onControllerChange: {
|
|
1166
|
+
type: PropType<(controller: ConversationListController) => void>;
|
|
1167
|
+
default: undefined;
|
|
1168
|
+
};
|
|
1169
|
+
selectedConversationId: {
|
|
1170
|
+
readonly type: StringConstructor;
|
|
1171
|
+
readonly default: undefined;
|
|
1172
|
+
};
|
|
1173
|
+
onConversationSelect: {
|
|
1174
|
+
readonly type: PropType<(conversation: Conversation$1) => void>;
|
|
1175
|
+
readonly default: undefined;
|
|
1176
|
+
};
|
|
1177
|
+
onRefresh: {
|
|
1178
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
1179
|
+
readonly default: undefined;
|
|
1180
|
+
};
|
|
1181
|
+
onLoadMore: {
|
|
1182
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
1183
|
+
readonly default: undefined;
|
|
1184
|
+
};
|
|
1185
|
+
isInitialLoading: {
|
|
1186
|
+
readonly type: BooleanConstructor;
|
|
1187
|
+
readonly default: false;
|
|
1188
|
+
};
|
|
1189
|
+
isLoadingMore: {
|
|
1190
|
+
readonly type: BooleanConstructor;
|
|
1191
|
+
readonly default: false;
|
|
1192
|
+
};
|
|
1193
|
+
hasMore: {
|
|
1194
|
+
readonly type: BooleanConstructor;
|
|
1195
|
+
readonly default: false;
|
|
1196
|
+
};
|
|
1197
|
+
error: {
|
|
1198
|
+
readonly type: PropType<unknown>;
|
|
1199
|
+
readonly required: false;
|
|
1200
|
+
};
|
|
1201
|
+
scrollElement: {
|
|
1202
|
+
readonly type: PropType<Ref<HTMLElement | null>>;
|
|
1203
|
+
readonly default: undefined;
|
|
1204
|
+
};
|
|
1205
|
+
paginationThreshold: {
|
|
1206
|
+
readonly type: NumberConstructor;
|
|
1207
|
+
readonly default: 240;
|
|
1208
|
+
};
|
|
1209
|
+
ariaLabel: {
|
|
1210
|
+
readonly type: StringConstructor;
|
|
1211
|
+
readonly default: "Conversations";
|
|
1212
|
+
};
|
|
1213
|
+
classNames: {
|
|
1214
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, string>>>;
|
|
1215
|
+
readonly default: undefined;
|
|
1216
|
+
};
|
|
1217
|
+
styles: {
|
|
1218
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, CSSProperties>>>;
|
|
1219
|
+
readonly default: undefined;
|
|
1220
|
+
};
|
|
1221
|
+
density: {
|
|
1222
|
+
readonly type: PropType<ConvoKitUiDensity>;
|
|
1223
|
+
readonly default: "comfortable";
|
|
1224
|
+
};
|
|
1225
|
+
unstyled: {
|
|
1226
|
+
readonly type: BooleanConstructor;
|
|
1227
|
+
readonly default: false;
|
|
1228
|
+
};
|
|
1229
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
1230
|
+
[key: string]: any;
|
|
1231
|
+
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("controller-change" | "conversation-select")[], "controller-change" | "conversation-select", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
1232
|
+
conversations: {
|
|
1233
|
+
type: PropType<readonly Conversation$1[]>;
|
|
1234
|
+
default: () => never[];
|
|
1235
|
+
};
|
|
1236
|
+
client: {
|
|
1237
|
+
type: PropType<ConvoKitUiClient>;
|
|
1238
|
+
required: true;
|
|
1239
|
+
};
|
|
1240
|
+
pageLoader: {
|
|
1241
|
+
type: PropType<ConversationPageLoader>;
|
|
1242
|
+
default: undefined;
|
|
1243
|
+
};
|
|
1244
|
+
initialFilter: {
|
|
1245
|
+
type: PropType<ConversationFilter>;
|
|
1246
|
+
default: undefined;
|
|
1247
|
+
};
|
|
1248
|
+
pageSize: {
|
|
1249
|
+
type: NumberConstructor;
|
|
1250
|
+
default: number;
|
|
1251
|
+
};
|
|
1252
|
+
autoLoad: {
|
|
1253
|
+
type: BooleanConstructor;
|
|
1254
|
+
default: boolean;
|
|
1255
|
+
};
|
|
1256
|
+
onControllerChange: {
|
|
1257
|
+
type: PropType<(controller: ConversationListController) => void>;
|
|
1258
|
+
default: undefined;
|
|
1259
|
+
};
|
|
1260
|
+
selectedConversationId: {
|
|
1261
|
+
readonly type: StringConstructor;
|
|
1262
|
+
readonly default: undefined;
|
|
1263
|
+
};
|
|
1264
|
+
onConversationSelect: {
|
|
1265
|
+
readonly type: PropType<(conversation: Conversation$1) => void>;
|
|
1266
|
+
readonly default: undefined;
|
|
1267
|
+
};
|
|
1268
|
+
onRefresh: {
|
|
1269
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
1270
|
+
readonly default: undefined;
|
|
1271
|
+
};
|
|
1272
|
+
onLoadMore: {
|
|
1273
|
+
readonly type: PropType<() => void | Promise<void>>;
|
|
1274
|
+
readonly default: undefined;
|
|
1275
|
+
};
|
|
1276
|
+
isInitialLoading: {
|
|
1277
|
+
readonly type: BooleanConstructor;
|
|
1278
|
+
readonly default: false;
|
|
1279
|
+
};
|
|
1280
|
+
isLoadingMore: {
|
|
1281
|
+
readonly type: BooleanConstructor;
|
|
1282
|
+
readonly default: false;
|
|
1283
|
+
};
|
|
1284
|
+
hasMore: {
|
|
1285
|
+
readonly type: BooleanConstructor;
|
|
1286
|
+
readonly default: false;
|
|
1287
|
+
};
|
|
1288
|
+
error: {
|
|
1289
|
+
readonly type: PropType<unknown>;
|
|
1290
|
+
readonly required: false;
|
|
1291
|
+
};
|
|
1292
|
+
scrollElement: {
|
|
1293
|
+
readonly type: PropType<Ref<HTMLElement | null>>;
|
|
1294
|
+
readonly default: undefined;
|
|
1295
|
+
};
|
|
1296
|
+
paginationThreshold: {
|
|
1297
|
+
readonly type: NumberConstructor;
|
|
1298
|
+
readonly default: 240;
|
|
1299
|
+
};
|
|
1300
|
+
ariaLabel: {
|
|
1301
|
+
readonly type: StringConstructor;
|
|
1302
|
+
readonly default: "Conversations";
|
|
1303
|
+
};
|
|
1304
|
+
classNames: {
|
|
1305
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, string>>>;
|
|
1306
|
+
readonly default: undefined;
|
|
1307
|
+
};
|
|
1308
|
+
styles: {
|
|
1309
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, CSSProperties>>>;
|
|
1310
|
+
readonly default: undefined;
|
|
1311
|
+
};
|
|
1312
|
+
density: {
|
|
1313
|
+
readonly type: PropType<ConvoKitUiDensity>;
|
|
1314
|
+
readonly default: "comfortable";
|
|
1315
|
+
};
|
|
1316
|
+
unstyled: {
|
|
1317
|
+
readonly type: BooleanConstructor;
|
|
1318
|
+
readonly default: false;
|
|
1319
|
+
};
|
|
1320
|
+
}>> & Readonly<{
|
|
1321
|
+
"onController-change"?: (...args: any[]) => any;
|
|
1322
|
+
"onConversation-select"?: (...args: any[]) => any;
|
|
1323
|
+
}>, {
|
|
1324
|
+
scrollElement: Ref<HTMLElement | null, HTMLElement | null>;
|
|
1325
|
+
paginationThreshold: number;
|
|
1326
|
+
classNames: Partial<Record<ConvoKitUiPart, string>>;
|
|
1327
|
+
styles: Partial<Record<ConvoKitUiPart, CSSProperties>>;
|
|
1328
|
+
density: ConvoKitUiDensity;
|
|
1329
|
+
unstyled: boolean;
|
|
1330
|
+
onRefresh: () => void | Promise<void>;
|
|
1331
|
+
isInitialLoading: boolean;
|
|
1332
|
+
autoLoad: boolean;
|
|
1333
|
+
onControllerChange: (controller: ConversationListController) => void;
|
|
1334
|
+
conversations: readonly Conversation$1[];
|
|
1335
|
+
selectedConversationId: string;
|
|
1336
|
+
onConversationSelect: (conversation: Conversation$1) => void;
|
|
1337
|
+
onLoadMore: () => void | Promise<void>;
|
|
1338
|
+
isLoadingMore: boolean;
|
|
1339
|
+
hasMore: boolean;
|
|
1340
|
+
ariaLabel: string;
|
|
1341
|
+
pageLoader: ConversationPageLoader;
|
|
1342
|
+
initialFilter: ConversationFilter;
|
|
1343
|
+
pageSize: number;
|
|
1344
|
+
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
1345
|
+
|
|
1346
|
+
interface MessageListViewProps extends ConvoKitAppearanceProps {
|
|
1347
|
+
conversation: Conversation$1;
|
|
1348
|
+
messages: readonly Message[];
|
|
1349
|
+
currentUserId: string;
|
|
1350
|
+
readAtByUserId?: ReadonlyMap<string, Date>;
|
|
1351
|
+
readersResolver?: (message: Message) => ReadonlySet<string>;
|
|
1352
|
+
onLoadOlder?: () => void | Promise<void>;
|
|
1353
|
+
hasOlderMessages?: boolean;
|
|
1354
|
+
isLoadingOlder?: boolean;
|
|
1355
|
+
error?: unknown;
|
|
1356
|
+
onAttachmentClick?: (media: MessageMedia, message: Message) => void;
|
|
1357
|
+
scrollElement?: Ref<HTMLElement | null>;
|
|
1358
|
+
paginationThreshold?: number;
|
|
1359
|
+
reverse?: boolean;
|
|
1360
|
+
stickToBottom?: boolean;
|
|
1361
|
+
formatTime?: (date: Date) => string;
|
|
1362
|
+
imageLoading?: 'eager' | 'lazy';
|
|
1363
|
+
class?: unknown;
|
|
1364
|
+
style?: unknown;
|
|
1365
|
+
}
|
|
1366
|
+
declare function defaultFormatTime(date: Date): string;
|
|
1367
|
+
/** Controlled message history with read receipts, structured media, and older-page loading. */
|
|
1368
|
+
declare const MessageListView: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
1369
|
+
conversation: {
|
|
1370
|
+
type: PropType<Conversation$1>;
|
|
1371
|
+
required: true;
|
|
1372
|
+
};
|
|
1373
|
+
messages: {
|
|
1374
|
+
type: PropType<readonly Message[]>;
|
|
1375
|
+
required: true;
|
|
1376
|
+
};
|
|
1377
|
+
currentUserId: {
|
|
1378
|
+
type: StringConstructor;
|
|
1379
|
+
required: true;
|
|
1380
|
+
};
|
|
1381
|
+
readAtByUserId: {
|
|
1382
|
+
type: PropType<ReadonlyMap<string, Date>>;
|
|
1383
|
+
default: () => Map<any, any>;
|
|
1384
|
+
};
|
|
1385
|
+
readersResolver: {
|
|
1386
|
+
type: PropType<(message: Message) => ReadonlySet<string>>;
|
|
1387
|
+
default: undefined;
|
|
1388
|
+
};
|
|
1389
|
+
onLoadOlder: {
|
|
1390
|
+
type: PropType<() => void | Promise<void>>;
|
|
1391
|
+
default: undefined;
|
|
1392
|
+
};
|
|
1393
|
+
hasOlderMessages: {
|
|
1394
|
+
type: BooleanConstructor;
|
|
1395
|
+
default: boolean;
|
|
1396
|
+
};
|
|
1397
|
+
isLoadingOlder: {
|
|
1398
|
+
type: BooleanConstructor;
|
|
1399
|
+
default: boolean;
|
|
1400
|
+
};
|
|
1401
|
+
error: {
|
|
1402
|
+
type: PropType<unknown>;
|
|
1403
|
+
required: false;
|
|
1404
|
+
};
|
|
1405
|
+
onAttachmentClick: {
|
|
1406
|
+
type: PropType<(media: MessageMedia, message: Message) => void>;
|
|
1407
|
+
default: undefined;
|
|
1408
|
+
};
|
|
1409
|
+
scrollElement: {
|
|
1410
|
+
type: PropType<Ref<HTMLElement | null>>;
|
|
1411
|
+
default: undefined;
|
|
1412
|
+
};
|
|
1413
|
+
paginationThreshold: {
|
|
1414
|
+
type: NumberConstructor;
|
|
1415
|
+
default: number;
|
|
1416
|
+
};
|
|
1417
|
+
reverse: {
|
|
1418
|
+
type: BooleanConstructor;
|
|
1419
|
+
default: boolean;
|
|
1420
|
+
};
|
|
1421
|
+
stickToBottom: {
|
|
1422
|
+
type: BooleanConstructor;
|
|
1423
|
+
default: boolean;
|
|
1424
|
+
};
|
|
1425
|
+
formatTime: {
|
|
1426
|
+
type: PropType<(date: Date) => string>;
|
|
1427
|
+
default: typeof defaultFormatTime;
|
|
1428
|
+
};
|
|
1429
|
+
imageLoading: {
|
|
1430
|
+
type: PropType<"eager" | "lazy">;
|
|
1431
|
+
default: string;
|
|
1432
|
+
};
|
|
1433
|
+
classNames: {
|
|
1434
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, string>>>;
|
|
1435
|
+
readonly default: undefined;
|
|
1436
|
+
};
|
|
1437
|
+
styles: {
|
|
1438
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, CSSProperties>>>;
|
|
1439
|
+
readonly default: undefined;
|
|
1440
|
+
};
|
|
1441
|
+
density: {
|
|
1442
|
+
readonly type: PropType<ConvoKitUiDensity>;
|
|
1443
|
+
readonly default: "comfortable";
|
|
1444
|
+
};
|
|
1445
|
+
unstyled: {
|
|
1446
|
+
readonly type: BooleanConstructor;
|
|
1447
|
+
readonly default: false;
|
|
1448
|
+
};
|
|
1449
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
1450
|
+
[key: string]: any;
|
|
1451
|
+
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, ("load-older" | "attachment-click")[], "load-older" | "attachment-click", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
1452
|
+
conversation: {
|
|
1453
|
+
type: PropType<Conversation$1>;
|
|
1454
|
+
required: true;
|
|
1455
|
+
};
|
|
1456
|
+
messages: {
|
|
1457
|
+
type: PropType<readonly Message[]>;
|
|
1458
|
+
required: true;
|
|
1459
|
+
};
|
|
1460
|
+
currentUserId: {
|
|
1461
|
+
type: StringConstructor;
|
|
1462
|
+
required: true;
|
|
1463
|
+
};
|
|
1464
|
+
readAtByUserId: {
|
|
1465
|
+
type: PropType<ReadonlyMap<string, Date>>;
|
|
1466
|
+
default: () => Map<any, any>;
|
|
1467
|
+
};
|
|
1468
|
+
readersResolver: {
|
|
1469
|
+
type: PropType<(message: Message) => ReadonlySet<string>>;
|
|
1470
|
+
default: undefined;
|
|
1471
|
+
};
|
|
1472
|
+
onLoadOlder: {
|
|
1473
|
+
type: PropType<() => void | Promise<void>>;
|
|
1474
|
+
default: undefined;
|
|
1475
|
+
};
|
|
1476
|
+
hasOlderMessages: {
|
|
1477
|
+
type: BooleanConstructor;
|
|
1478
|
+
default: boolean;
|
|
1479
|
+
};
|
|
1480
|
+
isLoadingOlder: {
|
|
1481
|
+
type: BooleanConstructor;
|
|
1482
|
+
default: boolean;
|
|
1483
|
+
};
|
|
1484
|
+
error: {
|
|
1485
|
+
type: PropType<unknown>;
|
|
1486
|
+
required: false;
|
|
1487
|
+
};
|
|
1488
|
+
onAttachmentClick: {
|
|
1489
|
+
type: PropType<(media: MessageMedia, message: Message) => void>;
|
|
1490
|
+
default: undefined;
|
|
1491
|
+
};
|
|
1492
|
+
scrollElement: {
|
|
1493
|
+
type: PropType<Ref<HTMLElement | null>>;
|
|
1494
|
+
default: undefined;
|
|
1495
|
+
};
|
|
1496
|
+
paginationThreshold: {
|
|
1497
|
+
type: NumberConstructor;
|
|
1498
|
+
default: number;
|
|
1499
|
+
};
|
|
1500
|
+
reverse: {
|
|
1501
|
+
type: BooleanConstructor;
|
|
1502
|
+
default: boolean;
|
|
1503
|
+
};
|
|
1504
|
+
stickToBottom: {
|
|
1505
|
+
type: BooleanConstructor;
|
|
1506
|
+
default: boolean;
|
|
1507
|
+
};
|
|
1508
|
+
formatTime: {
|
|
1509
|
+
type: PropType<(date: Date) => string>;
|
|
1510
|
+
default: typeof defaultFormatTime;
|
|
1511
|
+
};
|
|
1512
|
+
imageLoading: {
|
|
1513
|
+
type: PropType<"eager" | "lazy">;
|
|
1514
|
+
default: string;
|
|
1515
|
+
};
|
|
1516
|
+
classNames: {
|
|
1517
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, string>>>;
|
|
1518
|
+
readonly default: undefined;
|
|
1519
|
+
};
|
|
1520
|
+
styles: {
|
|
1521
|
+
readonly type: PropType<Partial<Record<ConvoKitUiPart, CSSProperties>>>;
|
|
1522
|
+
readonly default: undefined;
|
|
1523
|
+
};
|
|
1524
|
+
density: {
|
|
1525
|
+
readonly type: PropType<ConvoKitUiDensity>;
|
|
1526
|
+
readonly default: "comfortable";
|
|
1527
|
+
};
|
|
1528
|
+
unstyled: {
|
|
1529
|
+
readonly type: BooleanConstructor;
|
|
1530
|
+
readonly default: false;
|
|
1531
|
+
};
|
|
1532
|
+
}>> & Readonly<{
|
|
1533
|
+
"onLoad-older"?: (...args: any[]) => any;
|
|
1534
|
+
"onAttachment-click"?: (...args: any[]) => any;
|
|
1535
|
+
}>, {
|
|
1536
|
+
reverse: boolean;
|
|
1537
|
+
readAtByUserId: ReadonlyMap<string, Date>;
|
|
1538
|
+
readersResolver: (message: Message) => ReadonlySet<string>;
|
|
1539
|
+
onLoadOlder: () => void | Promise<void>;
|
|
1540
|
+
hasOlderMessages: boolean;
|
|
1541
|
+
isLoadingOlder: boolean;
|
|
1542
|
+
onAttachmentClick: (media: MessageMedia, message: Message) => void;
|
|
1543
|
+
scrollElement: Ref<HTMLElement | null, HTMLElement | null>;
|
|
1544
|
+
paginationThreshold: number;
|
|
1545
|
+
stickToBottom: boolean;
|
|
1546
|
+
formatTime: (date: Date) => string;
|
|
1547
|
+
imageLoading: "eager" | "lazy";
|
|
1548
|
+
classNames: Partial<Record<ConvoKitUiPart, string>>;
|
|
1549
|
+
styles: Partial<Record<ConvoKitUiPart, CSSProperties>>;
|
|
1550
|
+
density: ConvoKitUiDensity;
|
|
1551
|
+
unstyled: boolean;
|
|
1552
|
+
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
1553
|
+
declare function defaultReadersResolver(readAtByUserId: ReadonlyMap<string, Date>): (message: Message) => ReadonlySet<string>;
|
|
1554
|
+
|
|
1555
|
+
interface ConvoKitTheme {
|
|
1556
|
+
background: string;
|
|
1557
|
+
surface: string;
|
|
1558
|
+
primary: string;
|
|
1559
|
+
text: string;
|
|
1560
|
+
mutedText: string;
|
|
1561
|
+
border: string;
|
|
1562
|
+
error: string;
|
|
1563
|
+
incomingBubble: string;
|
|
1564
|
+
outgoingBubble: string;
|
|
1565
|
+
outgoingText: string;
|
|
1566
|
+
radius: string;
|
|
1567
|
+
avatarSize: string;
|
|
1568
|
+
fontFamily: string;
|
|
1569
|
+
}
|
|
1570
|
+
declare const defaultConvoKitTheme: ConvoKitTheme;
|
|
1571
|
+
declare const ConvoKitThemeProvider: vue.DefineComponent<vue.ExtractPropTypes<{
|
|
1572
|
+
theme: {
|
|
1573
|
+
type: PropType<Partial<ConvoKitTheme>>;
|
|
1574
|
+
default: () => {};
|
|
1575
|
+
};
|
|
1576
|
+
class: {
|
|
1577
|
+
type: PropType<unknown>;
|
|
1578
|
+
default: undefined;
|
|
1579
|
+
};
|
|
1580
|
+
style: {
|
|
1581
|
+
type: PropType<unknown>;
|
|
1582
|
+
default: undefined;
|
|
1583
|
+
};
|
|
1584
|
+
}>, () => vue.VNode<vue.RendererNode, vue.RendererElement, {
|
|
1585
|
+
[key: string]: any;
|
|
1586
|
+
}>, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
|
|
1587
|
+
theme: {
|
|
1588
|
+
type: PropType<Partial<ConvoKitTheme>>;
|
|
1589
|
+
default: () => {};
|
|
1590
|
+
};
|
|
1591
|
+
class: {
|
|
1592
|
+
type: PropType<unknown>;
|
|
1593
|
+
default: undefined;
|
|
1594
|
+
};
|
|
1595
|
+
style: {
|
|
1596
|
+
type: PropType<unknown>;
|
|
1597
|
+
default: undefined;
|
|
1598
|
+
};
|
|
1599
|
+
}>> & Readonly<{}>, {
|
|
1600
|
+
class: undefined;
|
|
1601
|
+
style: undefined;
|
|
1602
|
+
theme: Partial<ConvoKitTheme>;
|
|
1603
|
+
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
|
|
1604
|
+
declare function useConvoKitTheme(): Readonly<Ref<ConvoKitTheme>>;
|
|
1605
|
+
|
|
1606
|
+
declare function matchesConversation(conversation: Conversation$1, filter: ConversationFilter): boolean;
|
|
1607
|
+
declare function applyConversationFilter(conversations: readonly Conversation$1[], filter: ConversationFilter): Conversation$1[];
|
|
1608
|
+
declare function mergeConversations(current: readonly Conversation$1[], incoming: readonly Conversation$1[]): Conversation$1[];
|
|
1609
|
+
declare function mergeMessages(current: readonly Message[], incoming: readonly Message[]): Message[];
|
|
1610
|
+
declare function readerIdsFor(message: Message, readAtByUserId: ReadonlyMap<string, Date>): ReadonlySet<string>;
|
|
1611
|
+
declare function formatFileSize(size: number | undefined): string | null;
|
|
1612
|
+
|
|
1613
|
+
export { type BaseViewProps, type ComposerSlotProps, Conversation, type ConversationController, type ConversationFilter, type ConversationItemSlotProps, ConversationList, type ConversationListController, type ConversationListProps, type ConversationListState, ConversationListView, type ConversationListViewProps, type ConversationPageLoader, type ConversationPageRequest, type ConversationProps, type ConversationState, ConversationView, type ConversationViewProps, type ConvoKitAppearanceProps, ConvoKitAvatar, type ConvoKitTheme, ConvoKitThemeProvider, type ConvoKitUiClient, type ConvoKitUiDensity, type ConvoKitUiPart, type ErrorSlot, type ErrorSlotProps, type MediaSlotProps, MessageListView, type MessageListViewProps, type MessageSlotProps, type ReadReceiptSlotProps, type ScrollOptions, type StateSlot, type TypingSlotProps, type UseConversationListOptions, type UseConversationOptions, applyConversationFilter, createConvoKitUiClient, defaultConvoKitTheme, defaultReadersResolver, formatFileSize, matchesConversation, mergeConversations, mergeMessages, readerIdsFor, useConversation, useConversationList, useConvoKitTheme };
|