@lobehub/chat 1.21.4 → 1.21.5
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/CHANGELOG.md +25 -0
- package/package.json +1 -1
- package/src/app/(main)/chat/(workspace)/@portal/Artifacts/Body/Renderer/React/index.tsx +51 -0
- package/src/app/(main)/chat/(workspace)/@portal/Artifacts/Body/Renderer/React/template.ts +32 -0
- package/src/app/(main)/chat/(workspace)/@portal/Artifacts/Body/Renderer/React.tsx +0 -31
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,31 @@
|
|
|
2
2
|
|
|
3
3
|
# Changelog
|
|
4
4
|
|
|
5
|
+
### [Version 1.21.5](https://github.com/lobehub/lobe-chat/compare/v1.21.4...v1.21.5)
|
|
6
|
+
|
|
7
|
+
<sup>Released on **2024-10-05**</sup>
|
|
8
|
+
|
|
9
|
+
#### 💄 Styles
|
|
10
|
+
|
|
11
|
+
- **misc**: Support shadcn in Artifacts.
|
|
12
|
+
|
|
13
|
+
<br/>
|
|
14
|
+
|
|
15
|
+
<details>
|
|
16
|
+
<summary><kbd>Improvements and Fixes</kbd></summary>
|
|
17
|
+
|
|
18
|
+
#### Styles
|
|
19
|
+
|
|
20
|
+
- **misc**: Support shadcn in Artifacts, closes [#4256](https://github.com/lobehub/lobe-chat/issues/4256) ([863bae5](https://github.com/lobehub/lobe-chat/commit/863bae5))
|
|
21
|
+
|
|
22
|
+
</details>
|
|
23
|
+
|
|
24
|
+
<div align="right">
|
|
25
|
+
|
|
26
|
+
[](#readme-top)
|
|
27
|
+
|
|
28
|
+
</div>
|
|
29
|
+
|
|
5
30
|
### [Version 1.21.4](https://github.com/lobehub/lobe-chat/compare/v1.21.3...v1.21.4)
|
|
6
31
|
|
|
7
32
|
<sup>Released on **2024-10-02**</sup>
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lobehub/chat",
|
|
3
|
-
"version": "1.21.
|
|
3
|
+
"version": "1.21.5",
|
|
4
4
|
"description": "Lobe Chat - an open-source, high-performance chatbot framework that supports speech synthesis, multimodal, and extensible Function Call plugin system. Supports one-click free deployment of your private ChatGPT/LLM web application.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"framework",
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
import { SandpackLayout, SandpackPreview, SandpackProvider } from '@codesandbox/sandpack-react';
|
|
2
|
+
import { memo } from 'react';
|
|
3
|
+
|
|
4
|
+
import { useChatStore } from '@/store/chat';
|
|
5
|
+
import { chatPortalSelectors } from '@/store/chat/selectors';
|
|
6
|
+
|
|
7
|
+
import { createTemplateFiles } from './template';
|
|
8
|
+
|
|
9
|
+
interface ReactRendererProps {
|
|
10
|
+
code: string;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
const ReactRenderer = memo<ReactRendererProps>(({ code }) => {
|
|
14
|
+
const title = useChatStore(chatPortalSelectors.artifactTitle);
|
|
15
|
+
|
|
16
|
+
return (
|
|
17
|
+
<SandpackProvider
|
|
18
|
+
customSetup={{
|
|
19
|
+
dependencies: {
|
|
20
|
+
'@lshay/ui': 'latest',
|
|
21
|
+
'@radix-ui/react-alert-dialog': 'latest',
|
|
22
|
+
'@radix-ui/react-dialog': 'latest',
|
|
23
|
+
'@radix-ui/react-icons': 'latest',
|
|
24
|
+
'antd': 'latest',
|
|
25
|
+
'class-variance-authority': 'latest',
|
|
26
|
+
'clsx': 'latest',
|
|
27
|
+
'lucide-react': 'latest',
|
|
28
|
+
'recharts': 'latest',
|
|
29
|
+
'tailwind-merge': 'latest',
|
|
30
|
+
},
|
|
31
|
+
}}
|
|
32
|
+
files={{
|
|
33
|
+
'App.tsx': code,
|
|
34
|
+
...createTemplateFiles({ title }),
|
|
35
|
+
}}
|
|
36
|
+
options={{
|
|
37
|
+
externalResources: ['https://cdn.tailwindcss.com'],
|
|
38
|
+
visibleFiles: ['App.tsx'],
|
|
39
|
+
}}
|
|
40
|
+
style={{ height: '100%' }}
|
|
41
|
+
template="vite-react-ts"
|
|
42
|
+
theme="auto"
|
|
43
|
+
>
|
|
44
|
+
<SandpackLayout style={{ height: '100%' }}>
|
|
45
|
+
<SandpackPreview style={{ height: '100%' }} />
|
|
46
|
+
</SandpackLayout>
|
|
47
|
+
</SandpackProvider>
|
|
48
|
+
);
|
|
49
|
+
});
|
|
50
|
+
|
|
51
|
+
export default ReactRenderer;
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
interface TemplateFilesParams {
|
|
2
|
+
title?: string;
|
|
3
|
+
}
|
|
4
|
+
export const createTemplateFiles = ({ title }: TemplateFilesParams = {}) => ({
|
|
5
|
+
'index.html': `<!DOCTYPE html>
|
|
6
|
+
<html lang="en">
|
|
7
|
+
<head>
|
|
8
|
+
<meta charset="UTF-8" />
|
|
9
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
10
|
+
<title>${title || 'Artifacts App'}</title>
|
|
11
|
+
<script src="https://cdn.tailwindcss.com"></script>
|
|
12
|
+
</head>
|
|
13
|
+
<body>
|
|
14
|
+
<div id="root"></div>
|
|
15
|
+
<script type="module" src="/index.tsx"></script>
|
|
16
|
+
</body>
|
|
17
|
+
</html>
|
|
18
|
+
`,
|
|
19
|
+
'vite.config.ts': {
|
|
20
|
+
code: `import { defineConfig } from 'vite';
|
|
21
|
+
import react from '@vitejs/plugin-react';
|
|
22
|
+
|
|
23
|
+
export default defineConfig({
|
|
24
|
+
plugins: [react()],
|
|
25
|
+
resolve: {
|
|
26
|
+
alias: {
|
|
27
|
+
'@/components/ui': '@lshay/ui/components/default',
|
|
28
|
+
},
|
|
29
|
+
},
|
|
30
|
+
});`,
|
|
31
|
+
},
|
|
32
|
+
});
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
import { SandpackLayout, SandpackPreview, SandpackProvider } from '@codesandbox/sandpack-react';
|
|
2
|
-
import { memo } from 'react';
|
|
3
|
-
|
|
4
|
-
interface ReactRendererProps {
|
|
5
|
-
code: string;
|
|
6
|
-
}
|
|
7
|
-
const ReactRenderer = memo<ReactRendererProps>(({ code }) => {
|
|
8
|
-
return (
|
|
9
|
-
<SandpackProvider
|
|
10
|
-
customSetup={{
|
|
11
|
-
dependencies: {
|
|
12
|
-
antd: 'latest',
|
|
13
|
-
recharts: 'latest',
|
|
14
|
-
},
|
|
15
|
-
}}
|
|
16
|
-
files={{
|
|
17
|
-
'App.js': code,
|
|
18
|
-
}}
|
|
19
|
-
options={{ externalResources: ['https://cdn.tailwindcss.com'] }}
|
|
20
|
-
style={{ height: '100%' }}
|
|
21
|
-
template="react"
|
|
22
|
-
theme="auto"
|
|
23
|
-
>
|
|
24
|
-
<SandpackLayout style={{ height: '100%' }}>
|
|
25
|
-
<SandpackPreview style={{ height: '100%' }} />
|
|
26
|
-
</SandpackLayout>
|
|
27
|
-
</SandpackProvider>
|
|
28
|
-
);
|
|
29
|
-
});
|
|
30
|
-
|
|
31
|
-
export default ReactRenderer;
|