@smarter.sh/ui-chat 0.0.7 → 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/README.md +21 -1
- package/package.json +1 -1
- package/types/index.d.ts +2 -2
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
[](https://
|
|
1
|
+
[](https://www.npmjs.com/package/@smarter.sh/ui-chat)
|
|
2
2
|
[](https://github.com/smarter-sh/smarter-chat/)
|
|
3
3
|
<a href="https://smarter.sh">
|
|
4
4
|
<img src="https://img.shields.io/badge/Smarter.sh-orange?style=flat&logo=appveyor&logoColor=white" height="32">
|
|
@@ -39,6 +39,26 @@ root.render(
|
|
|
39
39
|
);
|
|
40
40
|
```
|
|
41
41
|
|
|
42
|
+
## Integrate to an existing web page
|
|
43
|
+
|
|
44
|
+
We integrate this react component to the [Smarter developer workbench](https://platform.smarter.sh/) using this small repo, [github.com/smarter-sh/smarter-workbench]/(https://github.com/smarter-sh/smarter-workbench). This methodology provides a layer of separation between Django and react.js, which keeps things simple. smarter-workbench substantially consists of the following three files:
|
|
45
|
+
|
|
46
|
+
- [main.jsx](https://github.com/smarter-sh/smarter-workbench/blob/main/src/main.jsx): a 40-line react.js mini app for configuring this npm component with a Smarter Api url and any initialization settings we choose to include.
|
|
47
|
+
- [app-loader.js](https://github.com/smarter-sh/smarter-workbench/blob/main/src/public/app-loader.js): a small js script that injects the react.js build assets into your DOM, initiating the React boot-up process.
|
|
48
|
+
- [Makefile]: for automating build and release to AWS Cloudfront, where the react ui-chat app is served.
|
|
49
|
+
|
|
50
|
+
Meanwhile, Django adds a pair of DOM elements like the following example, where the app-loader.js launches itself with an "iffe", (Immediately Invoked Function Expression).
|
|
51
|
+
|
|
52
|
+
```html
|
|
53
|
+
<div
|
|
54
|
+
id="smarter-sh-v1-ui-chat-root"
|
|
55
|
+
smarter-chatbot-api-url="https://openai.3141-5926-5359.api.smarter.sh/"
|
|
56
|
+
smarter-toggle-metadata="False"
|
|
57
|
+
style="height: 88vh;"
|
|
58
|
+
></div>
|
|
59
|
+
<script async="" src="https://cdn.platform.smarter.sh/ui-chat/app-loader.js"></script>
|
|
60
|
+
```
|
|
61
|
+
|
|
42
62
|
## Developers
|
|
43
63
|
|
|
44
64
|
SmarterChat is created with [React](https://react.dev/) leveraging [@chatscope/chat-ui-kit-react](https://www.npmjs.com/package/@chatscope/chat-ui-kit-react)
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@smarter.sh/ui-chat",
|
|
3
|
-
"version": "0.0
|
|
3
|
+
"version": "0.1.0",
|
|
4
4
|
"description": "chatbot React.js component for the https://smarter.sh no-code, plugin based AI platform",
|
|
5
5
|
"homepage": "https://smarter.sh",
|
|
6
6
|
"main": "dist/smarter-chat-library.umd.js",
|
package/types/index.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { MessageDirectionEnum, SenderRoleEnum, ValidMessageRolesEnum } from "../src/components/enums.js";
|
|
2
|
-
import { SmarterChat } from "../src/components/SmarterChat";
|
|
3
2
|
|
|
4
3
|
declare module "@smarter.sh/ui-chat" {
|
|
4
|
+
// source: https://github.com/smarter-sh/smarter-chat/tree/main/src/components/SmarterChat
|
|
5
5
|
export interface SmarterChatProps {
|
|
6
6
|
apiUrl: string;
|
|
7
7
|
apiKey: string;
|
|
@@ -13,5 +13,5 @@ declare module "@smarter.sh/ui-chat" {
|
|
|
13
13
|
sessionCookieExpiration: number;
|
|
14
14
|
}
|
|
15
15
|
|
|
16
|
-
export { MessageDirectionEnum, SenderRoleEnum, ValidMessageRolesEnum
|
|
16
|
+
export { MessageDirectionEnum, SenderRoleEnum, ValidMessageRolesEnum };
|
|
17
17
|
}
|