@clikvn/agent-widget-embedded 0.0.10-dev → 0.0.12-dev

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 (73) hide show
  1. package/dist/commons/constants/variables.d.ts +4 -0
  2. package/dist/commons/constants/variables.d.ts.map +1 -1
  3. package/dist/components/Chat/Icons.d.ts +19 -1
  4. package/dist/components/Chat/Icons.d.ts.map +1 -1
  5. package/dist/components/Chat/Message.d.ts.map +1 -1
  6. package/dist/components/Chat/MultimodalInput.d.ts +1 -1
  7. package/dist/components/Chat/MultimodalInput.d.ts.map +1 -1
  8. package/dist/components/Chat/SuggestedActions.d.ts +12 -0
  9. package/dist/components/Chat/SuggestedActions.d.ts.map +1 -0
  10. package/dist/features/AgentWidget/index.d.ts +8 -2
  11. package/dist/features/AgentWidget/index.d.ts.map +1 -1
  12. package/dist/hooks/useConfiguration.d.ts +8 -1
  13. package/dist/hooks/useConfiguration.d.ts.map +1 -1
  14. package/dist/index.html +45 -44
  15. package/dist/types/common.type.d.ts +6 -0
  16. package/dist/types/common.type.d.ts.map +1 -1
  17. package/dist/web.js +1 -1
  18. package/package.json +3 -2
  19. package/.eslintrc +0 -34
  20. package/.prettierrc +0 -8
  21. package/dist/components/Chat/AudioRecording.d.ts +0 -9
  22. package/dist/components/Chat/AudioRecording.d.ts.map +0 -1
  23. package/dist/hooks/useConnection.d.ts +0 -15
  24. package/dist/hooks/useConnection.d.ts.map +0 -1
  25. package/dist/services/user.service.d.ts +0 -3
  26. package/dist/services/user.service.d.ts.map +0 -1
  27. package/dist/types/agentType.d.ts +0 -11
  28. package/dist/types/agentType.d.ts.map +0 -1
  29. package/src/assets/common.css +0 -148
  30. package/src/assets/tailwindcss.css +0 -3
  31. package/src/commons/constants/index.ts +0 -1
  32. package/src/commons/constants/variables.ts +0 -20
  33. package/src/components/Agent/index.tsx +0 -14
  34. package/src/components/Chat/AudioPlayer.tsx +0 -44
  35. package/src/components/Chat/Chat.tsx +0 -91
  36. package/src/components/Chat/Icons.tsx +0 -930
  37. package/src/components/Chat/Markdown.tsx +0 -335
  38. package/src/components/Chat/Message.tsx +0 -191
  39. package/src/components/Chat/MultimodalInput.tsx +0 -479
  40. package/src/components/Chat/Overview.tsx +0 -46
  41. package/src/components/Chat/PreviewAttachment.tsx +0 -46
  42. package/src/components/Chat/ui/Button.tsx +0 -55
  43. package/src/components/Chat/ui/Textarea.tsx +0 -23
  44. package/src/constants.ts +0 -1
  45. package/src/env.d.ts +0 -10
  46. package/src/features/AgentWidget/index.tsx +0 -57
  47. package/src/global.d.ts +0 -1
  48. package/src/hooks/useAudioRecording.ts +0 -50
  49. package/src/hooks/useChat.ts +0 -262
  50. package/src/hooks/useChatData.tsx +0 -68
  51. package/src/hooks/useConfiguration.tsx +0 -56
  52. package/src/hooks/useScrollToBottom.ts +0 -31
  53. package/src/index.ts +0 -1
  54. package/src/models/FlowiseClient.ts +0 -103
  55. package/src/models.ts +0 -1
  56. package/src/register.tsx +0 -85
  57. package/src/services/apis.ts +0 -12
  58. package/src/services/bot.service.ts +0 -15
  59. package/src/services/chat.service.ts +0 -199
  60. package/src/types/bot.type.ts +0 -10
  61. package/src/types/chat.type.ts +0 -11
  62. package/src/types/common.type.ts +0 -17
  63. package/src/types/flowise.type.ts +0 -108
  64. package/src/types/user.type.ts +0 -15
  65. package/src/types.ts +0 -0
  66. package/src/utils/audioRecording.ts +0 -371
  67. package/src/utils/commonUtils.ts +0 -47
  68. package/src/utils/functionUtils.ts +0 -17
  69. package/src/utils/requestUtils.ts +0 -113
  70. package/src/utils/streamUtils.ts +0 -18
  71. package/src/web.ts +0 -6
  72. package/src/window.ts +0 -43
  73. package/tsconfig.json +0 -24
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@clikvn/agent-widget-embedded",
3
3
  "description": "This is agent widget",
4
- "version": "0.0.10-dev",
4
+ "version": "0.0.12-dev",
5
5
  "author": "Clik JSC",
6
6
  "license": "ISC",
7
7
  "type": "module",
@@ -13,7 +13,8 @@
13
13
  "lint": "eslint src",
14
14
  "lint:fix": "eslint --fix src",
15
15
  "prettier": "prettier --write .",
16
- "pub": "publish --access public"
16
+ "pub": "publish --access public",
17
+ "deploy": "yarn publish --access public"
17
18
  },
18
19
  "dependencies": {
19
20
  "@fortawesome/fontawesome-svg-core": "^6.6.0",
package/.eslintrc DELETED
@@ -1,34 +0,0 @@
1
- {
2
- "root": true,
3
- "parser": "@typescript-eslint/parser",
4
- "plugins": ["@typescript-eslint", "prettier", "react-hooks"],
5
- "extends": [
6
- "eslint:recommended",
7
- "plugin:@typescript-eslint/recommended",
8
- "plugin:react-hooks/recommended",
9
- "plugin:@typescript-eslint/recommended",
10
- "plugin:prettier/recommended"
11
- ],
12
- "ignorePatterns": ["node_modules/*"],
13
- "parserOptions": {
14
- "project": ["./tsconfig.json"]
15
- },
16
- "rules": {
17
- "@typescript-eslint/no-explicit-any": "warn",
18
- "@typescript-eslint/no-unused-vars": ["warn", { "vars": "all" }],
19
- "react-hooks/exhaustive-deps": "warn",
20
- "no-console": ["warn", { "allow": ["info", "warn", "error"] }],
21
- "no-return-await": "off",
22
- "@typescript-eslint/return-await": "warn",
23
- "@typescript-eslint/no-empty-object-type": "warn",
24
- "@next/next/no-img-element": "off",
25
- "prettier/prettier": ["warn", {
26
- "semi": true,
27
- "singleQuote": true,
28
- "tabWidth": 2,
29
- "trailingComma": "es5",
30
- "printWidth": 80,
31
- "bracketSpacing": true
32
- }]
33
- }
34
- }
package/.prettierrc DELETED
@@ -1,8 +0,0 @@
1
- {
2
- "semi": true,
3
- "singleQuote": true,
4
- "tabWidth": 2,
5
- "trailingComma": "es5",
6
- "printWidth": 80,
7
- "bracketSpacing": true
8
- }
@@ -1,9 +0,0 @@
1
- import { FC } from 'react';
2
- type Props = {
3
- addRecordingToPreviews: (blob: Blob) => void;
4
- isRecording: boolean;
5
- setIsRecording: (value: boolean) => void;
6
- };
7
- export declare const AudioRecording: FC<Props>;
8
- export {};
9
- //# sourceMappingURL=AudioRecording.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"AudioRecording.d.ts","sourceRoot":"","sources":["../../../src/components/Chat/AudioRecording.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAuB,MAAM,OAAO,CAAC;AAShD,KAAK,KAAK,GAAG;IACX,sBAAsB,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IAC7C,WAAW,EAAE,OAAO,CAAC;IACrB,cAAc,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,CAAC;AACF,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,KAAK,CAiEpC,CAAC"}
@@ -1,15 +0,0 @@
1
- import React from 'react';
2
- type TokenGeneratorData = {
3
- shouldConnect: boolean;
4
- wsUrl: string;
5
- token: string;
6
- disconnect: () => Promise<void>;
7
- connect: () => Promise<void>;
8
- };
9
- export declare const ConnectionProvider: ({ children, livekitURL, }: {
10
- children: React.ReactNode;
11
- livekitURL: string;
12
- }) => import("react/jsx-runtime").JSX.Element;
13
- export declare const useConnection: () => TokenGeneratorData;
14
- export {};
15
- //# sourceMappingURL=useConnection.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useConnection.d.ts","sourceRoot":"","sources":["../../src/hooks/useConnection.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkC,MAAM,OAAO,CAAC;AAIvD,KAAK,kBAAkB,GAAG;IACxB,aAAa,EAAE,OAAO,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAChC,OAAO,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;CAC9B,CAAC;AAMF,eAAO,MAAM,kBAAkB,8BAG5B;IACD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,UAAU,EAAE,MAAM,CAAC;CACpB,4CA6CA,CAAC;AAEF,eAAO,MAAM,aAAa,0BAMzB,CAAC"}
@@ -1,3 +0,0 @@
1
- import { UserType } from '../types/user.type';
2
- export declare const getUserInfo: (accessToken: string) => Promise<UserType>;
3
- //# sourceMappingURL=user.service.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"user.service.d.ts","sourceRoot":"","sources":["../../src/services/user.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AAI9C,eAAO,MAAM,WAAW,gBAAuB,MAAM,KAAG,OAAO,CAAC,QAAQ,CAUvE,CAAC"}
@@ -1,11 +0,0 @@
1
- export interface AgentType {
2
- id: string;
3
- created: string;
4
- lastModifiedDate: string;
5
- name: string;
6
- chatflowId: string;
7
- chatflowConfig: any;
8
- hidden: boolean;
9
- avatar: string;
10
- }
11
- //# sourceMappingURL=agentType.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"agentType.d.ts","sourceRoot":"","sources":["../../src/types/agentType.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;IAChB,gBAAgB,EAAE,MAAM,CAAC;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,EAAE,GAAG,CAAC;IACpB,MAAM,EAAE,OAAO,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;CAChB"}
@@ -1,148 +0,0 @@
1
- @tailwind base;
2
- @tailwind components;
3
- @tailwind utilities;
4
-
5
- :root {
6
- --foreground-rgb: 0, 0, 0;
7
- --background-start-rgb: 214, 219, 220;
8
- --background-end-rgb: 255, 255, 255;
9
- }
10
-
11
- @media (prefers-color-scheme: dark) {
12
- :root {
13
- --foreground-rgb: 255, 255, 255;
14
- --background-start-rgb: 0, 0, 0;
15
- --background-end-rgb: 0, 0, 0;
16
- }
17
- }
18
-
19
- @layer utilities {
20
- .text-balance {
21
- text-wrap: balance;
22
- }
23
- }
24
-
25
- @layer base {
26
- :root {
27
- --background: 0 0% 100%;
28
- --foreground: 240 10% 3.9%;
29
- --card: 0 0% 100%;
30
- --card-foreground: 240 10% 3.9%;
31
- --popover: 0 0% 100%;
32
- --popover-foreground: 240 10% 3.9%;
33
- --primary: 217 100% 45%;
34
- --primary-foreground: 0 0% 98%;
35
- --secondary: 213 100% 96%;
36
- --secondary-foreground: 240 5.9% 10%;
37
- --muted: 240 4.8% 95.9%;
38
- --muted-foreground: 240 3.8% 46.1%;
39
- --accent: 240 4.8% 95.9%;
40
- --accent-foreground: 240 5.9% 10%;
41
- --destructive: 0 84.2% 60.2%;
42
- --destructive-foreground: 0 0% 98%;
43
- --border: 214 32% 91%;
44
- --input: 240 5.9% 90%;
45
- --ring: 240 10% 3.9%;
46
- --chart-1: 12 76% 61%;
47
- --chart-2: 173 58% 39%;
48
- --chart-3: 197 37% 24%;
49
- --chart-4: 43 74% 66%;
50
- --chart-5: 27 87% 67%;
51
- --radius: 0.5rem;
52
- --sidebar-background: 0 0% 98%;
53
- --sidebar-foreground: 240 10% 3.9%;
54
- --sidebar-primary: 240 5.9% 10%;
55
- --sidebar-primary-foreground: 0 0% 98%;
56
- --sidebar-accent: 240 5.9% 94%;
57
- --sidebar-accent-foreground: 240 5.9% 10%;
58
- --sidebar-border: 220 13% 91%;
59
- --sidebar-ring: 217.2 91.2% 59.8%;
60
- }
61
- .dark {
62
- --background: 240 10% 3.9%;
63
- --foreground: 0 0% 98%;
64
- --card: 240 10% 3.9%;
65
- --card-foreground: 0 0% 98%;
66
- --popover: 240 10% 3.9%;
67
- --popover-foreground: 0 0% 98%;
68
- --primary: 208.69 100% 24.18%;
69
- --primary-foreground: 207 100% 96%;
70
- --secondary: 240 3.7% 15.9%;
71
- --secondary-foreground: 0 0% 98%;
72
- --muted: 240 3.7% 15.9%;
73
- --muted-foreground: 240 5% 64.9%;
74
- --accent: 240 3.7% 15.9%;
75
- --accent-foreground: 0 0% 98%;
76
- --destructive: 0 62.8% 30.6%;
77
- --destructive-foreground: 0 0% 98%;
78
- --border: 240 3.7% 15.9%;
79
- --input: 240 3.7% 15.9%;
80
- --ring: 240 4.9% 83.9%;
81
- --chart-1: 220 70% 50%;
82
- --chart-2: 160 60% 45%;
83
- --chart-3: 30 80% 55%;
84
- --chart-4: 280 65% 60%;
85
- --chart-5: 340 75% 55%;
86
- --sidebar-background: 240 5.9% 10%;
87
- --sidebar-foreground: 240 4.8% 95.9%;
88
- --sidebar-primary: 224.3 76.3% 48%;
89
- --sidebar-primary-foreground: 0 0% 100%;
90
- --sidebar-accent: 240 3.7% 15.9%;
91
- --sidebar-accent-foreground: 240 4.8% 95.9%;
92
- --sidebar-border: 240 3.7% 15.9%;
93
- --sidebar-ring: 217.2 91.2% 59.8%;
94
- }
95
- }
96
-
97
- @layer base {
98
- * {
99
- @apply border-border;
100
- }
101
-
102
- body {
103
- @apply bg-background text-foreground;
104
- }
105
-
106
- @font-face {
107
- /*font-family: "geist";*/
108
- font-family: 'Be Vietnam Pro', sans-serif;
109
- font-style: normal;
110
- font-weight: 100 900;
111
- /*src: url(/fonts/geist.woff2) format("woff2");*/
112
- }
113
-
114
- @font-face {
115
- /*font-family: "geist-mono";*/
116
- font-family: 'Be Vietnam Pro', sans-serif;
117
- font-style: normal;
118
- font-weight: 100 900;
119
- /*src: url(/fonts/geist-mono.woff2) format("woff2");*/
120
- }
121
- }
122
-
123
- .skeleton {
124
- * {
125
- pointer-events: none !important;
126
- }
127
-
128
- *[class^='text-'] {
129
- color: transparent;
130
- @apply rounded-md bg-foreground/20 select-none animate-pulse;
131
- }
132
-
133
- .skeleton-bg {
134
- @apply bg-foreground/10;
135
- }
136
-
137
- .skeleton-div {
138
- @apply bg-foreground/20 animate-pulse;
139
- }
140
- }
141
-
142
- .ProseMirror {
143
- outline: none;
144
- }
145
-
146
- .suggestion-highlight {
147
- @apply bg-blue-200 hover:bg-blue-300 dark:hover:bg-blue-400/50 dark:text-blue-50 dark:bg-blue-500/40;
148
- }
@@ -1,3 +0,0 @@
1
- @tailwind base;
2
- @tailwind components;
3
- @tailwind utilities;
@@ -1 +0,0 @@
1
- export * from './variables';
@@ -1,20 +0,0 @@
1
- export const BE_API = '';
2
-
3
- export const LANGUAGE_HEADER: { [key: string]: string } = {
4
- vi: 'vn',
5
- en: 'en',
6
- jp: 'jp',
7
- kr: 'kr',
8
- cn: 'cn',
9
- es: 'es',
10
- fr: 'fr',
11
- de: 'de',
12
- ru: 'ru',
13
- th: 'th',
14
- tw: 'tw',
15
- sg: 'sg',
16
- my: 'my',
17
- kh: 'kh',
18
- au: 'au',
19
- global: 'global',
20
- };
@@ -1,14 +0,0 @@
1
- import { useChatData } from '../../hooks/useChatData';
2
- import { useConfiguration } from '../../hooks/useConfiguration';
3
- import { Chat } from '../Chat/Chat';
4
-
5
- const Agent = () => {
6
- const { agentId } = useConfiguration();
7
- const { chatId, initialMessages } = useChatData();
8
-
9
- return (
10
- <Chat agentId={agentId} id={chatId} initialMessages={initialMessages} />
11
- );
12
- };
13
-
14
- export default Agent;
@@ -1,44 +0,0 @@
1
- import React, { useRef, useState } from 'react';
2
- import { PlayIcon, StopIcon1 } from './Icons';
3
-
4
- const AudioPlayer = ({
5
- src,
6
- autoplay = false,
7
- }: {
8
- src: string;
9
- autoplay?: boolean;
10
- }) => {
11
- const audioRef = useRef<any>(null);
12
- const [isPlaying, setIsPlaying] = useState(false);
13
-
14
- const handlePlayPause = (e: any) => {
15
- e.preventDefault();
16
- if (isPlaying) {
17
- audioRef.current.pause();
18
- } else {
19
- audioRef.current.play();
20
- }
21
- };
22
-
23
- return (
24
- <>
25
- <button
26
- className="rounded-full cursor-pointer h-fit w-[24px]"
27
- onClick={handlePlayPause}
28
- >
29
- {isPlaying ? <StopIcon1 /> : <PlayIcon />}
30
- </button>
31
- <audio
32
- ref={audioRef}
33
- className="hidden"
34
- src={src}
35
- autoPlay={autoplay}
36
- onEnded={() => setIsPlaying(false)}
37
- onPause={() => setIsPlaying(false)}
38
- onPlay={() => setIsPlaying(true)}
39
- ></audio>
40
- </>
41
- );
42
- };
43
-
44
- export default AudioPlayer;
@@ -1,91 +0,0 @@
1
- import { FC, useState } from 'react';
2
- import { ChatMessageType, IFileUpload } from '../../types/flowise.type';
3
- import { PreviewMessage, ThinkingMessage } from './Message';
4
- import { useChat } from '../../hooks/useChat';
5
- import { useScrollToBottom } from '../../hooks/useScrollToBottom';
6
- import { MultimodalInput } from './MultimodalInput';
7
- import { Overview } from './Overview';
8
- import { useConfiguration } from '../../hooks/useConfiguration';
9
-
10
- type PropsType = {
11
- id?: string;
12
- initialMessages?: ChatMessageType[];
13
- agentId?: string;
14
- };
15
-
16
- export const Chat: FC<PropsType> = ({ id, agentId, initialMessages = [] }) => {
17
- const {
18
- messages = [],
19
- setMessages,
20
- handleSubmit,
21
- input = '',
22
- setInput,
23
- isLoading,
24
- stop,
25
- chatId,
26
- append,
27
- bot,
28
- enableTTS,
29
- setEnableTTS,
30
- suggestions
31
- } = useChat({ id, initialMessages, agentId });
32
- const { apiHost } = useConfiguration();
33
- const [messagesContainerRef, messagesEndRef] =
34
- useScrollToBottom<HTMLDivElement>();
35
- const [attachments, setAttachments] = useState<Array<IFileUpload>>([]);
36
-
37
- return (
38
- <>
39
- <div className="flex flex-col min-w-0 h-full bg-background">
40
- <div
41
- ref={messagesContainerRef}
42
- className="flex flex-col min-w-0 gap-6 flex-1 overflow-y-scroll pt-4"
43
- >
44
- {(messages?.length || 0) === 0 && <Overview bot={bot} />}
45
-
46
- {(messages || []).map((message, index) => (
47
- <PreviewMessage
48
- key={message.id}
49
- bot={bot}
50
- chatId={id}
51
- message={message}
52
- isLoading={isLoading && (messages || []).length - 1 === index}
53
- enableTTS={enableTTS}
54
- />
55
- ))}
56
-
57
- {isLoading &&
58
- messages.length > 0 &&
59
- messages[messages.length - 1].role === 'userMessage' && (
60
- <ThinkingMessage bot={bot} />
61
- )}
62
-
63
- <div
64
- ref={messagesEndRef}
65
- className="shrink-0 min-w-[24px] min-h-[24px]"
66
- />
67
- </div>
68
- <form className="flex mx-auto px-4 bg-background pb-4 md:pb-6 gap-2 w-full md:max-w-3xl">
69
- <MultimodalInput
70
- input={input}
71
- setInput={setInput}
72
- chatId={chatId}
73
- handleSubmit={handleSubmit}
74
- isLoading={isLoading}
75
- stop={stop}
76
- messages={messages}
77
- setMessages={setMessages}
78
- append={append}
79
- attachments={attachments}
80
- setAttachments={setAttachments}
81
- bot={bot}
82
- apiHost={apiHost}
83
- setEnableTTS={setEnableTTS}
84
- enableTTS={enableTTS}
85
- suggestedActions={suggestions}
86
- />
87
- </form>
88
- </div>
89
- </>
90
- );
91
- };