react-optimistic-chat 1.2.1 → 2.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.
Files changed (7) hide show
  1. package/LICENSE +23 -0
  2. package/README.md +845 -0
  3. package/dist/index.d.mts +54 -45
  4. package/dist/index.d.ts +54 -45
  5. package/dist/index.js +173 -74
  6. package/dist/index.mjs +173 -74
  7. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -1,5 +1,7 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import React$1 from 'react';
3
+ import * as _tanstack_query_core from '@tanstack/query-core';
4
+ import { InfiniteData } from '@tanstack/react-query';
3
5
 
4
6
  type ChatRole = "AI" | "USER";
5
7
  type BaseMessage = {
@@ -8,11 +10,21 @@ type BaseMessage = {
8
10
  content: string;
9
11
  isLoading?: boolean;
10
12
  };
11
- type Message<T = {}> = BaseMessage & T;
13
+ type MessageCore = Pick<BaseMessage, "id" | "role" | "content">;
14
+ type Message<TCustom = unknown> = BaseMessage & {
15
+ custom?: TCustom;
16
+ };
17
+
18
+ type VoiceRecognition = {
19
+ start: () => void;
20
+ stop: () => void;
21
+ isRecording: boolean;
22
+ onTranscript?: (text: string) => void;
23
+ };
12
24
 
13
25
  type Size$1 = 'xs' | 'sm' | 'md' | 'lg';
14
26
  type Props$5 = {
15
- size: Size$1;
27
+ size?: Size$1;
16
28
  };
17
29
  declare function LoadingSpinner({ size }: Props$5): react_jsx_runtime.JSX.Element;
18
30
 
@@ -35,28 +47,22 @@ type Props$3 = Message & {
35
47
  };
36
48
  declare function ChatMessage({ id, role, content, isLoading, wrapperClassName, icon, aiIconWrapperClassName, aiIconColor, bubbleClassName, aiBubbleClassName, userBubbleClassName, position, loadingRenderer, }: Props$3): react_jsx_runtime.JSX.Element;
37
49
 
38
- type MessagePatch = Partial<BaseMessage> & Record<string, unknown>;
39
- type Props$2<T extends Message = Message> = {
40
- messages: T[];
41
- messageMapper?: (msg: T) => MessagePatch;
42
- messageRenderer?: (msg: T) => React$1.ReactNode;
50
+ type Props$2<Raw> = {
51
+ messages: Raw[];
52
+ messageMapper?: (msg: Raw) => Message;
53
+ messageRenderer?: (msg: Message) => React$1.ReactNode;
43
54
  className?: string;
44
55
  loadingRenderer?: React$1.ReactNode;
45
56
  };
46
- declare function ChatList<T extends Message>({ messages, messageMapper, messageRenderer, className, loadingRenderer, }: Props$2<T>): react_jsx_runtime.JSX.Element;
57
+ declare function ChatList<Raw>({ messages, messageMapper, messageRenderer, className, loadingRenderer, }: Props$2<Raw>): react_jsx_runtime.JSX.Element;
47
58
 
48
- type VoiceRecognitionController$1 = {
49
- start: () => void;
50
- stop: () => void;
51
- isRecording: boolean;
52
- };
53
59
  type ButtonConfig = {
54
60
  className?: string;
55
61
  icon?: React.ReactNode;
56
62
  };
57
63
  type Props$1 = {
58
64
  onSend: (value: string) => void | Promise<void>;
59
- voice?: boolean | VoiceRecognitionController$1;
65
+ voice?: boolean | VoiceRecognition;
60
66
  placeholder?: string;
61
67
  className?: string;
62
68
  inputClassName?: string;
@@ -76,9 +82,9 @@ type MessageProps = {
76
82
  messages: Message[];
77
83
  messageMapper?: never;
78
84
  };
79
- type RawProps<T> = {
80
- messages: T[];
81
- messageMapper: (msg: T) => Message;
85
+ type RawProps<Raw> = {
86
+ messages: Raw[];
87
+ messageMapper: (msg: Raw) => Message;
82
88
  };
83
89
  type CommonProps = {
84
90
  messageRenderer?: (msg: Message) => React.ReactNode;
@@ -89,28 +95,34 @@ type CommonProps = {
89
95
  disableVoice?: boolean;
90
96
  placeholder?: string;
91
97
  inputClassName?: string;
98
+ fetchNextPage?: () => void;
99
+ hasNextPage?: boolean;
100
+ isFetchingNextPage?: boolean;
92
101
  className?: string;
93
102
  };
94
- type Props<T> = CommonProps & (MessageProps | RawProps<T>);
95
- declare function ChatContainer<T>(props: Props<T>): react_jsx_runtime.JSX.Element;
103
+ type Props<Raw> = CommonProps & (MessageProps | RawProps<Raw>);
104
+ declare function ChatContainer<Raw>(props: Props<Raw>): react_jsx_runtime.JSX.Element;
96
105
 
97
- type ExtraFromRaw$1<TRaw> = Omit<TRaw, keyof BaseMessage>;
98
- type MessageMapperResult$1 = Pick<BaseMessage, "id" | "role" | "content">;
99
- type MessageMapper$1<TRaw> = Message<ExtraFromRaw$1<TRaw>>;
100
- type Options$2<TRaw> = {
106
+ type ExtractCustom$1<Raw> = Omit<Raw, keyof BaseMessage>;
107
+ type Options$2<Raw> = {
101
108
  queryKey: readonly unknown[];
102
- queryFn: () => Promise<TRaw[]>;
103
- mutationFn: (content: string) => Promise<TRaw>;
104
- map: (raw: TRaw) => MessageMapperResult$1;
109
+ queryFn: (pageParam: unknown) => Promise<Raw[]>;
110
+ initialPageParam: unknown;
111
+ getNextPageParam: (lastPage: Message<ExtractCustom$1<Raw>>[], allPages: Message<ExtractCustom$1<Raw>>[][]) => unknown;
112
+ mutationFn: (content: string) => Promise<Raw>;
113
+ map: (raw: Raw) => MessageCore;
105
114
  onError?: (error: unknown) => void;
106
115
  staleTime?: number;
107
116
  gcTime?: number;
108
117
  };
109
- declare function useOptimisticChat<TRaw>({ queryKey, queryFn, mutationFn, map, onError, staleTime, gcTime, }: Options$2<TRaw>): {
110
- messages: MessageMapper$1<TRaw>[];
118
+ declare function useChat<Raw extends object>({ queryKey, queryFn, initialPageParam, getNextPageParam, mutationFn, map, onError, staleTime, gcTime, }: Options$2<Raw>): {
119
+ messages: Message<ExtractCustom$1<Raw>>[];
111
120
  sendUserMessage: (content: string) => void;
112
121
  isPending: boolean;
113
122
  isInitialLoading: boolean;
123
+ fetchNextPage: (options?: _tanstack_query_core.FetchNextPageOptions) => Promise<_tanstack_query_core.InfiniteQueryObserverResult<InfiniteData<Message<ExtractCustom$1<Raw>>[], unknown>, Error>>;
124
+ hasNextPage: boolean;
125
+ isFetchingNextPage: boolean;
114
126
  };
115
127
 
116
128
  interface SpeechGrammar {
@@ -183,31 +195,28 @@ declare function useBrowserSpeechRecognition({ lang, onStart, onEnd, onError, }?
183
195
  onTranscript: (text: string) => void;
184
196
  };
185
197
 
186
- type VoiceRecognitionController = {
187
- start: () => void;
188
- stop: () => void;
189
- isRecording: boolean;
190
- onTranscript: (text: string) => void;
191
- };
192
- type ExtraFromRaw<TRaw> = Omit<TRaw, keyof BaseMessage>;
193
- type MessageMapperResult = Pick<BaseMessage, "id" | "role" | "content">;
194
- type MessageMapper<TRaw> = Message<ExtraFromRaw<TRaw>>;
195
- type Options<TRaw> = {
198
+ type ExtractCustom<Raw> = Omit<Raw, keyof BaseMessage>;
199
+ type Options<Raw> = {
196
200
  queryKey: readonly unknown[];
197
- queryFn: () => Promise<TRaw[]>;
198
- mutationFn: (content: string) => Promise<TRaw>;
199
- map: (raw: TRaw) => MessageMapperResult;
200
- voice: VoiceRecognitionController;
201
+ queryFn: (pageParam: unknown) => Promise<Raw[]>;
202
+ initialPageParam: unknown;
203
+ getNextPageParam: (lastPage: Message<ExtractCustom<Raw>>[], allPages: Message<ExtractCustom<Raw>>[][]) => unknown;
204
+ mutationFn: (content: string) => Promise<Raw>;
205
+ map: (raw: Raw) => MessageCore;
206
+ voice: VoiceRecognition;
201
207
  onError?: (error: unknown) => void;
202
208
  staleTime?: number;
203
209
  gcTime?: number;
204
210
  };
205
- declare function useVoiceOptimisticChat<TRaw>({ queryKey, queryFn, mutationFn, map, voice, onError, staleTime, gcTime, }: Options<TRaw>): {
206
- messages: MessageMapper<TRaw>[];
211
+ declare function useVoiceChat<Raw extends object>({ queryKey, queryFn, initialPageParam, getNextPageParam, mutationFn, map, voice, onError, staleTime, gcTime, }: Options<Raw>): {
212
+ messages: Message<ExtractCustom<Raw>>[];
207
213
  isPending: boolean;
208
214
  isInitialLoading: boolean;
209
215
  startRecording: () => Promise<void>;
210
216
  stopRecording: () => void;
217
+ fetchNextPage: (options?: _tanstack_query_core.FetchNextPageOptions) => Promise<_tanstack_query_core.InfiniteQueryObserverResult<InfiniteData<Message<ExtractCustom<Raw>>[], unknown>, Error>>;
218
+ hasNextPage: boolean;
219
+ isFetchingNextPage: boolean;
211
220
  };
212
221
 
213
- export { ChatContainer, ChatInput, ChatList, ChatMessage, LoadingSpinner, type Message, SendingDots, useBrowserSpeechRecognition, useOptimisticChat, useVoiceOptimisticChat };
222
+ export { ChatContainer, ChatInput, ChatList, ChatMessage, LoadingSpinner, type Message, SendingDots, type VoiceRecognition, useBrowserSpeechRecognition, useChat, useVoiceChat };
package/dist/index.d.ts CHANGED
@@ -1,5 +1,7 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import React$1 from 'react';
3
+ import * as _tanstack_query_core from '@tanstack/query-core';
4
+ import { InfiniteData } from '@tanstack/react-query';
3
5
 
4
6
  type ChatRole = "AI" | "USER";
5
7
  type BaseMessage = {
@@ -8,11 +10,21 @@ type BaseMessage = {
8
10
  content: string;
9
11
  isLoading?: boolean;
10
12
  };
11
- type Message<T = {}> = BaseMessage & T;
13
+ type MessageCore = Pick<BaseMessage, "id" | "role" | "content">;
14
+ type Message<TCustom = unknown> = BaseMessage & {
15
+ custom?: TCustom;
16
+ };
17
+
18
+ type VoiceRecognition = {
19
+ start: () => void;
20
+ stop: () => void;
21
+ isRecording: boolean;
22
+ onTranscript?: (text: string) => void;
23
+ };
12
24
 
13
25
  type Size$1 = 'xs' | 'sm' | 'md' | 'lg';
14
26
  type Props$5 = {
15
- size: Size$1;
27
+ size?: Size$1;
16
28
  };
17
29
  declare function LoadingSpinner({ size }: Props$5): react_jsx_runtime.JSX.Element;
18
30
 
@@ -35,28 +47,22 @@ type Props$3 = Message & {
35
47
  };
36
48
  declare function ChatMessage({ id, role, content, isLoading, wrapperClassName, icon, aiIconWrapperClassName, aiIconColor, bubbleClassName, aiBubbleClassName, userBubbleClassName, position, loadingRenderer, }: Props$3): react_jsx_runtime.JSX.Element;
37
49
 
38
- type MessagePatch = Partial<BaseMessage> & Record<string, unknown>;
39
- type Props$2<T extends Message = Message> = {
40
- messages: T[];
41
- messageMapper?: (msg: T) => MessagePatch;
42
- messageRenderer?: (msg: T) => React$1.ReactNode;
50
+ type Props$2<Raw> = {
51
+ messages: Raw[];
52
+ messageMapper?: (msg: Raw) => Message;
53
+ messageRenderer?: (msg: Message) => React$1.ReactNode;
43
54
  className?: string;
44
55
  loadingRenderer?: React$1.ReactNode;
45
56
  };
46
- declare function ChatList<T extends Message>({ messages, messageMapper, messageRenderer, className, loadingRenderer, }: Props$2<T>): react_jsx_runtime.JSX.Element;
57
+ declare function ChatList<Raw>({ messages, messageMapper, messageRenderer, className, loadingRenderer, }: Props$2<Raw>): react_jsx_runtime.JSX.Element;
47
58
 
48
- type VoiceRecognitionController$1 = {
49
- start: () => void;
50
- stop: () => void;
51
- isRecording: boolean;
52
- };
53
59
  type ButtonConfig = {
54
60
  className?: string;
55
61
  icon?: React.ReactNode;
56
62
  };
57
63
  type Props$1 = {
58
64
  onSend: (value: string) => void | Promise<void>;
59
- voice?: boolean | VoiceRecognitionController$1;
65
+ voice?: boolean | VoiceRecognition;
60
66
  placeholder?: string;
61
67
  className?: string;
62
68
  inputClassName?: string;
@@ -76,9 +82,9 @@ type MessageProps = {
76
82
  messages: Message[];
77
83
  messageMapper?: never;
78
84
  };
79
- type RawProps<T> = {
80
- messages: T[];
81
- messageMapper: (msg: T) => Message;
85
+ type RawProps<Raw> = {
86
+ messages: Raw[];
87
+ messageMapper: (msg: Raw) => Message;
82
88
  };
83
89
  type CommonProps = {
84
90
  messageRenderer?: (msg: Message) => React.ReactNode;
@@ -89,28 +95,34 @@ type CommonProps = {
89
95
  disableVoice?: boolean;
90
96
  placeholder?: string;
91
97
  inputClassName?: string;
98
+ fetchNextPage?: () => void;
99
+ hasNextPage?: boolean;
100
+ isFetchingNextPage?: boolean;
92
101
  className?: string;
93
102
  };
94
- type Props<T> = CommonProps & (MessageProps | RawProps<T>);
95
- declare function ChatContainer<T>(props: Props<T>): react_jsx_runtime.JSX.Element;
103
+ type Props<Raw> = CommonProps & (MessageProps | RawProps<Raw>);
104
+ declare function ChatContainer<Raw>(props: Props<Raw>): react_jsx_runtime.JSX.Element;
96
105
 
97
- type ExtraFromRaw$1<TRaw> = Omit<TRaw, keyof BaseMessage>;
98
- type MessageMapperResult$1 = Pick<BaseMessage, "id" | "role" | "content">;
99
- type MessageMapper$1<TRaw> = Message<ExtraFromRaw$1<TRaw>>;
100
- type Options$2<TRaw> = {
106
+ type ExtractCustom$1<Raw> = Omit<Raw, keyof BaseMessage>;
107
+ type Options$2<Raw> = {
101
108
  queryKey: readonly unknown[];
102
- queryFn: () => Promise<TRaw[]>;
103
- mutationFn: (content: string) => Promise<TRaw>;
104
- map: (raw: TRaw) => MessageMapperResult$1;
109
+ queryFn: (pageParam: unknown) => Promise<Raw[]>;
110
+ initialPageParam: unknown;
111
+ getNextPageParam: (lastPage: Message<ExtractCustom$1<Raw>>[], allPages: Message<ExtractCustom$1<Raw>>[][]) => unknown;
112
+ mutationFn: (content: string) => Promise<Raw>;
113
+ map: (raw: Raw) => MessageCore;
105
114
  onError?: (error: unknown) => void;
106
115
  staleTime?: number;
107
116
  gcTime?: number;
108
117
  };
109
- declare function useOptimisticChat<TRaw>({ queryKey, queryFn, mutationFn, map, onError, staleTime, gcTime, }: Options$2<TRaw>): {
110
- messages: MessageMapper$1<TRaw>[];
118
+ declare function useChat<Raw extends object>({ queryKey, queryFn, initialPageParam, getNextPageParam, mutationFn, map, onError, staleTime, gcTime, }: Options$2<Raw>): {
119
+ messages: Message<ExtractCustom$1<Raw>>[];
111
120
  sendUserMessage: (content: string) => void;
112
121
  isPending: boolean;
113
122
  isInitialLoading: boolean;
123
+ fetchNextPage: (options?: _tanstack_query_core.FetchNextPageOptions) => Promise<_tanstack_query_core.InfiniteQueryObserverResult<InfiniteData<Message<ExtractCustom$1<Raw>>[], unknown>, Error>>;
124
+ hasNextPage: boolean;
125
+ isFetchingNextPage: boolean;
114
126
  };
115
127
 
116
128
  interface SpeechGrammar {
@@ -183,31 +195,28 @@ declare function useBrowserSpeechRecognition({ lang, onStart, onEnd, onError, }?
183
195
  onTranscript: (text: string) => void;
184
196
  };
185
197
 
186
- type VoiceRecognitionController = {
187
- start: () => void;
188
- stop: () => void;
189
- isRecording: boolean;
190
- onTranscript: (text: string) => void;
191
- };
192
- type ExtraFromRaw<TRaw> = Omit<TRaw, keyof BaseMessage>;
193
- type MessageMapperResult = Pick<BaseMessage, "id" | "role" | "content">;
194
- type MessageMapper<TRaw> = Message<ExtraFromRaw<TRaw>>;
195
- type Options<TRaw> = {
198
+ type ExtractCustom<Raw> = Omit<Raw, keyof BaseMessage>;
199
+ type Options<Raw> = {
196
200
  queryKey: readonly unknown[];
197
- queryFn: () => Promise<TRaw[]>;
198
- mutationFn: (content: string) => Promise<TRaw>;
199
- map: (raw: TRaw) => MessageMapperResult;
200
- voice: VoiceRecognitionController;
201
+ queryFn: (pageParam: unknown) => Promise<Raw[]>;
202
+ initialPageParam: unknown;
203
+ getNextPageParam: (lastPage: Message<ExtractCustom<Raw>>[], allPages: Message<ExtractCustom<Raw>>[][]) => unknown;
204
+ mutationFn: (content: string) => Promise<Raw>;
205
+ map: (raw: Raw) => MessageCore;
206
+ voice: VoiceRecognition;
201
207
  onError?: (error: unknown) => void;
202
208
  staleTime?: number;
203
209
  gcTime?: number;
204
210
  };
205
- declare function useVoiceOptimisticChat<TRaw>({ queryKey, queryFn, mutationFn, map, voice, onError, staleTime, gcTime, }: Options<TRaw>): {
206
- messages: MessageMapper<TRaw>[];
211
+ declare function useVoiceChat<Raw extends object>({ queryKey, queryFn, initialPageParam, getNextPageParam, mutationFn, map, voice, onError, staleTime, gcTime, }: Options<Raw>): {
212
+ messages: Message<ExtractCustom<Raw>>[];
207
213
  isPending: boolean;
208
214
  isInitialLoading: boolean;
209
215
  startRecording: () => Promise<void>;
210
216
  stopRecording: () => void;
217
+ fetchNextPage: (options?: _tanstack_query_core.FetchNextPageOptions) => Promise<_tanstack_query_core.InfiniteQueryObserverResult<InfiniteData<Message<ExtractCustom<Raw>>[], unknown>, Error>>;
218
+ hasNextPage: boolean;
219
+ isFetchingNextPage: boolean;
211
220
  };
212
221
 
213
- export { ChatContainer, ChatInput, ChatList, ChatMessage, LoadingSpinner, type Message, SendingDots, useBrowserSpeechRecognition, useOptimisticChat, useVoiceOptimisticChat };
222
+ export { ChatContainer, ChatInput, ChatList, ChatMessage, LoadingSpinner, type Message, SendingDots, type VoiceRecognition, useBrowserSpeechRecognition, useChat, useVoiceChat };