reachat 1.0.6 → 1.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 +2 -1
- package/dist/Chat.d.ts +7 -4
- package/dist/ChatContext.d.ts +2 -0
- package/dist/Markdown/CodeHighlighter.d.ts +4 -0
- package/dist/Markdown/themes/dark.d.ts +0 -1
- package/dist/docs.json +22 -3
- package/dist/index.js +33 -26
- package/dist/index.js.map +1 -1
- package/dist/index.umd.cjs +33 -26
- package/dist/index.umd.cjs.map +1 -1
- package/dist/theme.d.ts +1 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -35,6 +35,7 @@ theme via Tailwind.
|
|
|
35
35
|
- Checkout the [storybook demos](https://storybook.reachat.dev)
|
|
36
36
|
- Learn about updates from the [changelog](CHANGELOG.md)
|
|
37
37
|
- Download [Figma template](https://www.figma.com/community/file/1401162540082414292/reachat-landing-page-public)
|
|
38
|
+
- Try the [sample repo](https://github.com/reaviz/reachat-example)
|
|
38
39
|
|
|
39
40
|
## 💎 Other Projects
|
|
40
41
|
|
|
@@ -86,5 +87,5 @@ If you want to run reachat locally, its super easy!
|
|
|
86
87
|
|
|
87
88
|
Thanks to all our contributors!
|
|
88
89
|
|
|
89
|
-
<a href="https://github.com/reaviz/
|
|
90
|
+
<a href="https://github.com/reaviz/reachat/graphs/contributors"><img src="https://opencollective.com/reaviz/contributors.svg?width=890" /></a>
|
|
90
91
|
|
package/dist/Chat.d.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { CSSProperties, FC, PropsWithChildren } from 'react';
|
|
2
2
|
import { Session } from './types';
|
|
3
3
|
import { ChatTheme } from './theme';
|
|
4
|
+
import { ChatViewType } from './ChatContext';
|
|
4
5
|
import { PluggableList } from 'react-markdown/lib';
|
|
5
6
|
|
|
6
7
|
export interface ChatProps extends PropsWithChildren {
|
|
@@ -13,11 +14,13 @@ export interface ChatProps extends PropsWithChildren {
|
|
|
13
14
|
*/
|
|
14
15
|
className?: string;
|
|
15
16
|
/**
|
|
16
|
-
* The type of prompt to display.
|
|
17
|
-
*
|
|
18
|
-
*
|
|
17
|
+
* The type of prompt to display.
|
|
18
|
+
*
|
|
19
|
+
* - Companion: Smaller prompt screen with session lists.
|
|
20
|
+
* - Console: Full screen experience.
|
|
21
|
+
* - Chat: Only chat, no sessions.
|
|
19
22
|
*/
|
|
20
|
-
viewType?:
|
|
23
|
+
viewType?: ChatViewType;
|
|
21
24
|
/**
|
|
22
25
|
* The list of sessions to display.
|
|
23
26
|
*/
|
package/dist/ChatContext.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ import { Session } from './types';
|
|
|
2
2
|
import { ChatTheme } from './theme';
|
|
3
3
|
import { PluggableList } from 'react-markdown/lib';
|
|
4
4
|
|
|
5
|
+
export type ChatViewType = 'chat' | 'companion' | 'console';
|
|
5
6
|
export interface ChatContextProps {
|
|
6
7
|
sessions: Session[];
|
|
7
8
|
disabled?: boolean;
|
|
@@ -9,6 +10,7 @@ export interface ChatContextProps {
|
|
|
9
10
|
theme?: ChatTheme;
|
|
10
11
|
isLoading?: boolean;
|
|
11
12
|
isCompact?: boolean;
|
|
13
|
+
viewType?: ChatViewType;
|
|
12
14
|
activeSession?: Session | null;
|
|
13
15
|
remarkPlugins?: PluggableList[];
|
|
14
16
|
selectSession?: (sessionId: string) => void;
|
|
@@ -13,6 +13,10 @@ export interface CodeHighlighterProps extends PropsWithChildren {
|
|
|
13
13
|
* The class name to apply to the copy button.
|
|
14
14
|
*/
|
|
15
15
|
copyClassName?: string;
|
|
16
|
+
/**
|
|
17
|
+
* The class name to apply to the toolbar.
|
|
18
|
+
*/
|
|
19
|
+
toolbarClassName?: string;
|
|
16
20
|
/**
|
|
17
21
|
* Icon to show for copy.
|
|
18
22
|
*/
|
package/dist/docs.json
CHANGED
|
@@ -48,7 +48,7 @@
|
|
|
48
48
|
"defaultValue": {
|
|
49
49
|
"value": "console"
|
|
50
50
|
},
|
|
51
|
-
"description": "The type of prompt to display
|
|
51
|
+
"description": "The type of prompt to display.\n\n- Companion: Smaller prompt screen with session lists.\n- Console: Full screen experience.\n- Chat: Only chat, no sessions.",
|
|
52
52
|
"name": "viewType",
|
|
53
53
|
"parent": {
|
|
54
54
|
"fileName": "src/Chat.tsx",
|
|
@@ -62,7 +62,7 @@
|
|
|
62
62
|
],
|
|
63
63
|
"required": false,
|
|
64
64
|
"type": {
|
|
65
|
-
"name": "
|
|
65
|
+
"name": "ChatViewType"
|
|
66
66
|
}
|
|
67
67
|
},
|
|
68
68
|
"sessions": {
|
|
@@ -488,6 +488,25 @@
|
|
|
488
488
|
"name": "string"
|
|
489
489
|
}
|
|
490
490
|
},
|
|
491
|
+
"toolbarClassName": {
|
|
492
|
+
"defaultValue": null,
|
|
493
|
+
"description": "The class name to apply to the toolbar.",
|
|
494
|
+
"name": "toolbarClassName",
|
|
495
|
+
"parent": {
|
|
496
|
+
"fileName": "src/Markdown/CodeHighlighter.tsx",
|
|
497
|
+
"name": "CodeHighlighterProps"
|
|
498
|
+
},
|
|
499
|
+
"declarations": [
|
|
500
|
+
{
|
|
501
|
+
"fileName": "src/Markdown/CodeHighlighter.tsx",
|
|
502
|
+
"name": "CodeHighlighterProps"
|
|
503
|
+
}
|
|
504
|
+
],
|
|
505
|
+
"required": false,
|
|
506
|
+
"type": {
|
|
507
|
+
"name": "string"
|
|
508
|
+
}
|
|
509
|
+
},
|
|
491
510
|
"copyIcon": {
|
|
492
511
|
"defaultValue": {
|
|
493
512
|
"value": "<CopyIcon />"
|
|
@@ -511,7 +530,7 @@
|
|
|
511
530
|
},
|
|
512
531
|
"theme": {
|
|
513
532
|
"defaultValue": {
|
|
514
|
-
"value": "{\n 'code[class*=\"language-\"]': {\n 'background': '#11111f',\n 'color': '#e2e8f0',\n 'textShadow': '0 1px rgba(0, 0, 0, 0.3)',\n 'fontFamily': '\"Fira Code\", \"Fira Mono\", Menlo, Consolas, \"DejaVu Sans Mono\", monospace',\n 'direction': 'ltr',\n 'textAlign': 'left',\n 'whiteSpace': 'pre',\n 'wordSpacing': 'normal',\n 'wordBreak': 'normal',\n 'lineHeight': '1.5',\n 'MozTabSize': '2',\n 'OTabSize': '2',\n 'tabSize': '2',\n 'WebkitHyphens': 'none',\n 'MozHyphens': 'none',\n 'msHyphens': 'none',\n 'hyphens': 'none'\n },\n 'pre[class*=\"language-\"]': {\n 'background': '#11111f',\n 'color': '#e2e8f0',\n 'textShadow': '0 1px rgba(0, 0, 0, 0.3)',\n 'fontFamily': '\"Fira Code\", \"Fira Mono\", Menlo, Consolas, \"DejaVu Sans Mono\", monospace',\n 'direction': 'ltr',\n 'textAlign': 'left',\n 'whiteSpace': 'pre',\n 'wordSpacing': 'normal',\n 'wordBreak': 'normal',\n 'lineHeight': '1.5',\n 'MozTabSize': '2',\n 'OTabSize': '2',\n 'tabSize': '2',\n 'WebkitHyphens': 'none',\n 'MozHyphens': 'none',\n 'msHyphens': 'none',\n 'hyphens': 'none',\n 'padding': '1em',\n 'margin': '0.5em 0',\n 'overflow': 'auto',\n 'borderRadius': '0.3em'\n },\n 'code[class*=\"language-\"]::-moz-selection': {\n 'background': '#1e293b',\n 'color': 'inherit',\n 'textShadow': 'none'\n },\n 'code[class*=\"language-\"] *::-moz-selection': {\n 'background': '#1e293b',\n 'color': 'inherit',\n 'textShadow': 'none'\n },\n 'pre[class*=\"language-\"] *::-moz-selection': {\n 'background': '#1e293b',\n 'color': 'inherit',\n 'textShadow': 'none'\n },\n 'code[class*=\"language-\"]::selection': {\n 'background': '#1e293b',\n 'color': 'inherit',\n 'textShadow': 'none'\n },\n 'code[class*=\"language-\"] *::selection': {\n 'background': '#1e293b',\n 'color': 'inherit',\n 'textShadow': 'none'\n },\n 'pre[class*=\"language-\"] *::selection': {\n 'background': '#1e293b',\n 'color': 'inherit',\n 'textShadow': 'none'\n },\n ':not(pre) > code[class*=\"language-\"]': {\n 'padding': '0.2em 0.3em',\n 'borderRadius': '0.3em',\n 'whiteSpace': 'normal'\n },\n 'comment': {\n 'color': '#64748b',\n 'fontStyle': 'italic'\n },\n 'prolog': {\n 'color': '#64748b'\n },\n 'cdata': {\n 'color': '#64748b'\n },\n 'doctype': {\n 'color': '#e2e8f0'\n },\n 'punctuation': {\n 'color': '#e2e8f0'\n },\n 'entity': {\n 'color': '#3b82f6',\n 'cursor': 'help'\n },\n 'attr-name': {\n 'color': '#f59e0b'\n },\n 'class-name': {\n 'color': '#f59e0b'\n },\n 'boolean': {\n 'color': '#3b82f6'\n },\n 'constant': {\n 'color': '#3b82f6'\n },\n 'number': {\n 'color': '#3b82f6'\n },\n 'atrule': {\n 'color': '#f59e0b'\n },\n 'keyword': {\n 'color': '#f472b6'\n },\n 'property': {\n 'color': '#3b82f6'\n },\n 'tag': {\n 'color': '#3b82f6'\n },\n 'symbol': {\n 'color': '#3b82f6'\n },\n 'deleted': {\n 'color': '#ef4444'\n },\n 'important': {\n 'color': '#f472b6'\n },\n 'selector': {\n 'color': '#10b981'\n },\n 'string': {\n 'color': '#10b981'\n },\n 'char': {\n 'color': '#10b981'\n },\n 'builtin': {\n 'color': '#10b981'\n },\n 'inserted': {\n 'color': '#10b981'\n },\n 'regex': {\n 'color': '#10b981'\n },\n 'attr-value': {\n 'color': '#10b981'\n },\n 'attr-value > .token.punctuation': {\n 'color': '#10b981'\n },\n 'variable': {\n 'color': '#60a5fa'\n },\n 'operator': {\n 'color': '#60a5fa'\n },\n 'function': {\n 'color': '#60a5fa'\n },\n 'url': {\n 'color': '#60a5fa'\n },\n 'attr-value > .token.punctuation.attr-equals': {\n 'color': '#e2e8f0'\n },\n 'special-attr > .token.attr-value > .token.value.css': {\n 'color': '#e2e8f0'\n },\n '.language-css .token.selector': {\n 'color': '#3b82f6'\n },\n '.language-css .token.property': {\n 'color': '#e2e8f0'\n },\n '.language-css .token.function': {\n 'color': '#60a5fa'\n },\n '.language-css .token.url > .token.function': {\n 'color': '#60a5fa'\n },\n '.language-css .token.url > .token.string.url': {\n 'color': '#10b981'\n },\n '.language-css .token.important': {\n 'color': '#f472b6'\n },\n '.language-css .token.atrule .token.rule': {\n 'color': '#f472b6'\n },\n '.language-javascript .token.operator': {\n 'color': '#f472b6'\n },\n '.language-javascript .token.template-string > .token.interpolation > .token.interpolation-punctuation.punctuation': {\n 'color': '#ef4444'\n },\n '.language-json .token.operator': {\n 'color': '#e2e8f0'\n },\n '.language-json .token.null.keyword': {\n 'color': '#3b82f6'\n },\n '.language-markdown .token.url': {\n 'color': '#e2e8f0'\n },\n '.language-markdown .token.url > .token.operator': {\n 'color': '#e2e8f0'\n },\n '.language-markdown .token.url-reference.url > .token.string': {\n 'color': '#e2e8f0'\n },\n '.language-markdown .token.url > .token.content': {\n 'color': '#60a5fa'\n },\n '.language-markdown .token.url > .token.url': {\n 'color': '#60a5fa'\n },\n '.language-markdown .token.url-reference.url': {\n 'color': '#60a5fa'\n },\n '.language-markdown .token.blockquote.punctuation': {\n 'color': '#64748b',\n 'fontStyle': 'italic'\n },\n '.language-markdown .token.hr.punctuation': {\n 'color': '#64748b',\n 'fontStyle': 'italic'\n },\n '.language-markdown .token.code-snippet': {\n 'color': '#10b981'\n },\n '.language-markdown .token.bold .token.content': {\n 'color': '#f59e0b'\n },\n '.language-markdown .token.italic .token.content': {\n 'color': '#f472b6'\n },\n '.language-markdown .token.strike .token.content': {\n 'color': '#3b82f6'\n },\n '.language-markdown .token.strike .token.punctuation': {\n 'color': '#3b82f6'\n },\n '.language-markdown .token.list.punctuation': {\n 'color': '#3b82f6'\n },\n '.language-markdown .token.title.important > .token.punctuation': {\n 'color': '#3b82f6'\n },\n 'bold': {\n 'fontWeight': 'bold'\n },\n 'italic': {\n 'fontStyle': 'italic'\n },\n 'namespace': {\n 'Opacity': '0.8'\n },\n 'token.tab:not(:empty):before': {\n 'color': '#64748b',\n 'textShadow': 'none'\n },\n 'token.cr:before': {\n 'color': '#64748b',\n 'textShadow': 'none'\n },\n 'token.lf:before': {\n 'color': '#64748b',\n 'textShadow': 'none'\n },\n 'token.space:before': {\n 'color': '#64748b',\n 'textShadow': 'none'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item': {\n 'marginRight': '0.4em'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > button': {\n 'background': '#1e293b',\n 'color': '#94a3b8',\n 'padding': '0.1em 0.4em',\n 'borderRadius': '0.3em'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > a': {\n 'background': '#1e293b',\n 'color': '#94a3b8',\n 'padding': '0.1em 0.4em',\n 'borderRadius': '0.3em'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > span': {\n 'background': '#1e293b',\n 'color': '#94a3b8',\n 'padding': '0.1em 0.4em',\n 'borderRadius': '0.3em'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:hover': {\n 'background': '#3b82f6',\n 'color': '#ffffff'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:focus': {\n 'background': '#3b82f6',\n 'color': '#ffffff'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:hover': {\n 'background': '#3b82f6',\n 'color': '#ffffff'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:focus': {\n 'background': '#3b82f6',\n 'color': '#ffffff'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:hover': {\n 'background': '#3b82f6',\n 'color': '#ffffff'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:focus': {\n 'background': '#3b82f6',\n 'color': '#ffffff'\n },\n '.line-highlight.line-highlight': {\n 'background': 'rgba(59, 130, 246, 0.08)'\n },\n '.line-highlight.line-highlight:before': {\n 'background': '#1e293b',\n 'color': '#e2e8f0',\n 'padding': '0.1em 0.6em',\n 'borderRadius': '0.3em',\n 'boxShadow': '0 2px 0 0 rgba(0, 0, 0, 0.2)'\n },\n '.line-highlight.line-highlight[data-end]:after': {\n 'background': '#1e293b',\n 'color': '#e2e8f0',\n 'padding': '0.1em 0.6em',\n 'borderRadius': '0.3em',\n 'boxShadow': '0 2px 0 0 rgba(0, 0, 0, 0.2)'\n },\n 'pre[id].linkable-line-numbers.linkable-line-numbers span.line-numbers-rows > span:hover:before': {\n 'backgroundColor': 'rgba(59, 130, 246, 0.08)'\n },\n '.line-numbers.line-numbers .line-numbers-rows': {\n 'borderRightColor': '#1e293b'\n },\n '.command-line .command-line-prompt': {\n 'borderRightColor': '#1e293b'\n },\n '.line-numbers .line-numbers-rows > span:before': {\n 'color': '#64748b'\n },\n '.command-line .command-line-prompt > span:before': {\n 'color': '#64748b'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-1': {\n 'color': '#3b82f6'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-5': {\n 'color': '#3b82f6'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-9': {\n 'color': '#3b82f6'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-2': {\n 'color': '#10b981'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-6': {\n 'color': '#10b981'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-10': {\n 'color': '#10b981'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-3': {\n 'color': '#60a5fa'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-7': {\n 'color': '#60a5fa'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-11': {\n 'color': '#60a5fa'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-4': {\n 'color': '#f472b6'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-8': {\n 'color': '#f472b6'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-12': {\n 'color': '#f472b6'\n },\n 'pre.diff-highlight > code .token.token.deleted:not(.prefix)': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.15)'\n },\n 'pre > code.diff-highlight .token.token.deleted:not(.prefix)': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.15)'\n },\n 'pre.diff-highlight > code .token.token.deleted:not(.prefix)::-moz-selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.deleted:not(.prefix) *::-moz-selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.deleted:not(.prefix)::-moz-selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.deleted:not(.prefix) *::-moz-selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.deleted:not(.prefix)::selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.deleted:not(.prefix) *::selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.deleted:not(.prefix)::selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.deleted:not(.prefix) *::selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.inserted:not(.prefix)': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.15)'\n },\n 'pre > code.diff-highlight .token.token.inserted:not(.prefix)': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.15)'\n },\n 'pre.diff-highlight > code .token.token.inserted:not(.prefix)::-moz-selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.inserted:not(.prefix) *::-moz-selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.inserted:not(.prefix)::-moz-selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.inserted:not(.prefix) *::-moz-selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.inserted:not(.prefix)::selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.inserted:not(.prefix) *::selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.inserted:not(.prefix)::selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.inserted:not(.prefix) *::selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n '.prism-previewer.prism-previewer:before': {\n 'borderColor': '#11111f'\n },\n '.prism-previewer-gradient.prism-previewer-gradient div': {\n 'borderColor': '#11111f',\n 'borderRadius': '0.3em'\n },\n '.prism-previewer-color.prism-previewer-color:before': {\n 'borderRadius': '0.3em'\n },\n '.prism-previewer-easing.prism-previewer-easing:before': {\n 'borderRadius': '0.3em'\n },\n '.prism-previewer.prism-previewer:after': {\n 'borderTopColor': '#11111f'\n },\n '.prism-previewer-flipped.prism-previewer-flipped.after': {\n 'borderBottomColor': '#11111f'\n },\n '.prism-previewer-angle.prism-previewer-angle:before': {\n 'background': '#1e293b'\n },\n '.prism-previewer-time.prism-previewer-time:before': {\n 'background': '#1e293b'\n },\n '.prism-previewer-easing.prism-previewer-easing': {\n 'background': '#1e293b'\n },\n '.prism-previewer-angle.prism-previewer-angle circle': {\n 'stroke': '#e2e8f0',\n 'strokeOpacity': '1'\n },\n '.prism-previewer-time.prism-previewer-time circle': {\n 'stroke': '#e2e8f0',\n 'strokeOpacity': '1'\n },\n '.prism-previewer-easing.prism-previewer-easing circle': {\n 'stroke': '#e2e8f0',\n 'fill': 'transparent'\n },\n '.prism-previewer-easing.prism-previewer-easing path': {\n 'stroke': '#e2e8f0'\n },\n '.prism-previewer-easing.prism-previewer-easing line': {\n 'stroke': '#e2e8f0'\n }\n}"
|
|
533
|
+
"value": "{\n 'code[class*=\"language-\"]': {\n 'background': '#11111f',\n 'color': '#e2e8f0',\n 'textShadow': '0 1px rgba(0, 0, 0, 0.3)',\n 'fontFamily': '\"Fira Code\", \"Fira Mono\", Menlo, Consolas, \"DejaVu Sans Mono\", monospace',\n 'direction': 'ltr',\n 'textAlign': 'left',\n 'whiteSpace': 'pre',\n 'wordSpacing': 'normal',\n 'wordBreak': 'normal',\n 'lineHeight': '1.5',\n 'MozTabSize': '2',\n 'OTabSize': '2',\n 'tabSize': '2',\n 'WebkitHyphens': 'none',\n 'MozHyphens': 'none',\n 'msHyphens': 'none',\n 'hyphens': 'none'\n },\n 'pre[class*=\"language-\"]': {\n 'background': '#11111f',\n 'color': '#e2e8f0',\n 'textShadow': '0 1px rgba(0, 0, 0, 0.3)',\n 'fontFamily': '\"Fira Code\", \"Fira Mono\", Menlo, Consolas, \"DejaVu Sans Mono\", monospace',\n 'direction': 'ltr',\n 'textAlign': 'left',\n 'whiteSpace': 'pre',\n 'wordSpacing': 'normal',\n 'wordBreak': 'normal',\n 'lineHeight': '1.5',\n 'MozTabSize': '2',\n 'OTabSize': '2',\n 'tabSize': '2',\n 'WebkitHyphens': 'none',\n 'MozHyphens': 'none',\n 'msHyphens': 'none',\n 'hyphens': 'none',\n 'padding': '1em',\n 'margin': '0',\n 'overflow': 'auto'\n },\n 'code[class*=\"language-\"]::-moz-selection': {\n 'background': '#1e293b',\n 'color': 'inherit',\n 'textShadow': 'none'\n },\n 'code[class*=\"language-\"] *::-moz-selection': {\n 'background': '#1e293b',\n 'color': 'inherit',\n 'textShadow': 'none'\n },\n 'pre[class*=\"language-\"] *::-moz-selection': {\n 'background': '#1e293b',\n 'color': 'inherit',\n 'textShadow': 'none'\n },\n 'code[class*=\"language-\"]::selection': {\n 'background': '#1e293b',\n 'color': 'inherit',\n 'textShadow': 'none'\n },\n 'code[class*=\"language-\"] *::selection': {\n 'background': '#1e293b',\n 'color': 'inherit',\n 'textShadow': 'none'\n },\n 'pre[class*=\"language-\"] *::selection': {\n 'background': '#1e293b',\n 'color': 'inherit',\n 'textShadow': 'none'\n },\n ':not(pre) > code[class*=\"language-\"]': {\n 'padding': '0.2em 0.3em',\n 'borderRadius': '0.3em',\n 'whiteSpace': 'normal'\n },\n 'comment': {\n 'color': '#64748b',\n 'fontStyle': 'italic'\n },\n 'prolog': {\n 'color': '#64748b'\n },\n 'cdata': {\n 'color': '#64748b'\n },\n 'doctype': {\n 'color': '#e2e8f0'\n },\n 'punctuation': {\n 'color': '#e2e8f0'\n },\n 'entity': {\n 'color': '#3b82f6',\n 'cursor': 'help'\n },\n 'attr-name': {\n 'color': '#f59e0b'\n },\n 'class-name': {\n 'color': '#f59e0b'\n },\n 'boolean': {\n 'color': '#3b82f6'\n },\n 'constant': {\n 'color': '#3b82f6'\n },\n 'number': {\n 'color': '#3b82f6'\n },\n 'atrule': {\n 'color': '#f59e0b'\n },\n 'keyword': {\n 'color': '#f472b6'\n },\n 'property': {\n 'color': '#3b82f6'\n },\n 'tag': {\n 'color': '#3b82f6'\n },\n 'symbol': {\n 'color': '#3b82f6'\n },\n 'deleted': {\n 'color': '#ef4444'\n },\n 'important': {\n 'color': '#f472b6'\n },\n 'selector': {\n 'color': '#10b981'\n },\n 'string': {\n 'color': '#10b981'\n },\n 'char': {\n 'color': '#10b981'\n },\n 'builtin': {\n 'color': '#10b981'\n },\n 'inserted': {\n 'color': '#10b981'\n },\n 'regex': {\n 'color': '#10b981'\n },\n 'attr-value': {\n 'color': '#10b981'\n },\n 'attr-value > .token.punctuation': {\n 'color': '#10b981'\n },\n 'variable': {\n 'color': '#60a5fa'\n },\n 'operator': {\n 'color': '#60a5fa'\n },\n 'function': {\n 'color': '#60a5fa'\n },\n 'url': {\n 'color': '#60a5fa'\n },\n 'attr-value > .token.punctuation.attr-equals': {\n 'color': '#e2e8f0'\n },\n 'special-attr > .token.attr-value > .token.value.css': {\n 'color': '#e2e8f0'\n },\n '.language-css .token.selector': {\n 'color': '#3b82f6'\n },\n '.language-css .token.property': {\n 'color': '#e2e8f0'\n },\n '.language-css .token.function': {\n 'color': '#60a5fa'\n },\n '.language-css .token.url > .token.function': {\n 'color': '#60a5fa'\n },\n '.language-css .token.url > .token.string.url': {\n 'color': '#10b981'\n },\n '.language-css .token.important': {\n 'color': '#f472b6'\n },\n '.language-css .token.atrule .token.rule': {\n 'color': '#f472b6'\n },\n '.language-javascript .token.operator': {\n 'color': '#f472b6'\n },\n '.language-javascript .token.template-string > .token.interpolation > .token.interpolation-punctuation.punctuation': {\n 'color': '#ef4444'\n },\n '.language-json .token.operator': {\n 'color': '#e2e8f0'\n },\n '.language-json .token.null.keyword': {\n 'color': '#3b82f6'\n },\n '.language-markdown .token.url': {\n 'color': '#e2e8f0'\n },\n '.language-markdown .token.url > .token.operator': {\n 'color': '#e2e8f0'\n },\n '.language-markdown .token.url-reference.url > .token.string': {\n 'color': '#e2e8f0'\n },\n '.language-markdown .token.url > .token.content': {\n 'color': '#60a5fa'\n },\n '.language-markdown .token.url > .token.url': {\n 'color': '#60a5fa'\n },\n '.language-markdown .token.url-reference.url': {\n 'color': '#60a5fa'\n },\n '.language-markdown .token.blockquote.punctuation': {\n 'color': '#64748b',\n 'fontStyle': 'italic'\n },\n '.language-markdown .token.hr.punctuation': {\n 'color': '#64748b',\n 'fontStyle': 'italic'\n },\n '.language-markdown .token.code-snippet': {\n 'color': '#10b981'\n },\n '.language-markdown .token.bold .token.content': {\n 'color': '#f59e0b'\n },\n '.language-markdown .token.italic .token.content': {\n 'color': '#f472b6'\n },\n '.language-markdown .token.strike .token.content': {\n 'color': '#3b82f6'\n },\n '.language-markdown .token.strike .token.punctuation': {\n 'color': '#3b82f6'\n },\n '.language-markdown .token.list.punctuation': {\n 'color': '#3b82f6'\n },\n '.language-markdown .token.title.important > .token.punctuation': {\n 'color': '#3b82f6'\n },\n 'bold': {\n 'fontWeight': 'bold'\n },\n 'italic': {\n 'fontStyle': 'italic'\n },\n 'namespace': {\n 'Opacity': '0.8'\n },\n 'token.tab:not(:empty):before': {\n 'color': '#64748b',\n 'textShadow': 'none'\n },\n 'token.cr:before': {\n 'color': '#64748b',\n 'textShadow': 'none'\n },\n 'token.lf:before': {\n 'color': '#64748b',\n 'textShadow': 'none'\n },\n 'token.space:before': {\n 'color': '#64748b',\n 'textShadow': 'none'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item': {\n 'marginRight': '0.4em'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > button': {\n 'background': '#1e293b',\n 'color': '#94a3b8',\n 'padding': '0.1em 0.4em',\n 'borderRadius': '0.3em'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > a': {\n 'background': '#1e293b',\n 'color': '#94a3b8',\n 'padding': '0.1em 0.4em',\n 'borderRadius': '0.3em'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > span': {\n 'background': '#1e293b',\n 'color': '#94a3b8',\n 'padding': '0.1em 0.4em',\n 'borderRadius': '0.3em'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:hover': {\n 'background': '#3b82f6',\n 'color': '#ffffff'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > button:focus': {\n 'background': '#3b82f6',\n 'color': '#ffffff'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:hover': {\n 'background': '#3b82f6',\n 'color': '#ffffff'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > a:focus': {\n 'background': '#3b82f6',\n 'color': '#ffffff'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:hover': {\n 'background': '#3b82f6',\n 'color': '#ffffff'\n },\n 'div.code-toolbar > .toolbar.toolbar > .toolbar-item > span:focus': {\n 'background': '#3b82f6',\n 'color': '#ffffff'\n },\n '.line-highlight.line-highlight': {\n 'background': 'rgba(59, 130, 246, 0.08)'\n },\n '.line-highlight.line-highlight:before': {\n 'background': '#1e293b',\n 'color': '#e2e8f0',\n 'padding': '0.1em 0.6em',\n 'borderRadius': '0.3em',\n 'boxShadow': '0 2px 0 0 rgba(0, 0, 0, 0.2)'\n },\n '.line-highlight.line-highlight[data-end]:after': {\n 'background': '#1e293b',\n 'color': '#e2e8f0',\n 'padding': '0.1em 0.6em',\n 'borderRadius': '0.3em',\n 'boxShadow': '0 2px 0 0 rgba(0, 0, 0, 0.2)'\n },\n 'pre[id].linkable-line-numbers.linkable-line-numbers span.line-numbers-rows > span:hover:before': {\n 'backgroundColor': 'rgba(59, 130, 246, 0.08)'\n },\n '.line-numbers.line-numbers .line-numbers-rows': {\n 'borderRightColor': '#1e293b'\n },\n '.command-line .command-line-prompt': {\n 'borderRightColor': '#1e293b'\n },\n '.line-numbers .line-numbers-rows > span:before': {\n 'color': '#64748b'\n },\n '.command-line .command-line-prompt > span:before': {\n 'color': '#64748b'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-1': {\n 'color': '#3b82f6'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-5': {\n 'color': '#3b82f6'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-9': {\n 'color': '#3b82f6'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-2': {\n 'color': '#10b981'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-6': {\n 'color': '#10b981'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-10': {\n 'color': '#10b981'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-3': {\n 'color': '#60a5fa'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-7': {\n 'color': '#60a5fa'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-11': {\n 'color': '#60a5fa'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-4': {\n 'color': '#f472b6'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-8': {\n 'color': '#f472b6'\n },\n '.rainbow-braces .token.token.punctuation.brace-level-12': {\n 'color': '#f472b6'\n },\n 'pre.diff-highlight > code .token.token.deleted:not(.prefix)': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.15)'\n },\n 'pre > code.diff-highlight .token.token.deleted:not(.prefix)': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.15)'\n },\n 'pre.diff-highlight > code .token.token.deleted:not(.prefix)::-moz-selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.deleted:not(.prefix) *::-moz-selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.deleted:not(.prefix)::-moz-selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.deleted:not(.prefix) *::-moz-selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.deleted:not(.prefix)::selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.deleted:not(.prefix) *::selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.deleted:not(.prefix)::selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.deleted:not(.prefix) *::selection': {\n 'backgroundColor': 'rgba(239, 68, 68, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.inserted:not(.prefix)': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.15)'\n },\n 'pre > code.diff-highlight .token.token.inserted:not(.prefix)': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.15)'\n },\n 'pre.diff-highlight > code .token.token.inserted:not(.prefix)::-moz-selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.inserted:not(.prefix) *::-moz-selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.inserted:not(.prefix)::-moz-selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.inserted:not(.prefix) *::-moz-selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.inserted:not(.prefix)::selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre.diff-highlight > code .token.token.inserted:not(.prefix) *::selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.inserted:not(.prefix)::selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n 'pre > code.diff-highlight .token.token.inserted:not(.prefix) *::selection': {\n 'backgroundColor': 'rgba(16, 185, 129, 0.25)'\n },\n '.prism-previewer.prism-previewer:before': {\n 'borderColor': '#11111f'\n },\n '.prism-previewer-gradient.prism-previewer-gradient div': {\n 'borderColor': '#11111f',\n 'borderRadius': '0.3em'\n },\n '.prism-previewer-color.prism-previewer-color:before': {\n 'borderRadius': '0.3em'\n },\n '.prism-previewer-easing.prism-previewer-easing:before': {\n 'borderRadius': '0.3em'\n },\n '.prism-previewer.prism-previewer:after': {\n 'borderTopColor': '#11111f'\n },\n '.prism-previewer-flipped.prism-previewer-flipped.after': {\n 'borderBottomColor': '#11111f'\n },\n '.prism-previewer-angle.prism-previewer-angle:before': {\n 'background': '#1e293b'\n },\n '.prism-previewer-time.prism-previewer-time:before': {\n 'background': '#1e293b'\n },\n '.prism-previewer-easing.prism-previewer-easing': {\n 'background': '#1e293b'\n },\n '.prism-previewer-angle.prism-previewer-angle circle': {\n 'stroke': '#e2e8f0',\n 'strokeOpacity': '1'\n },\n '.prism-previewer-time.prism-previewer-time circle': {\n 'stroke': '#e2e8f0',\n 'strokeOpacity': '1'\n },\n '.prism-previewer-easing.prism-previewer-easing circle': {\n 'stroke': '#e2e8f0',\n 'fill': 'transparent'\n },\n '.prism-previewer-easing.prism-previewer-easing path': {\n 'stroke': '#e2e8f0'\n },\n '.prism-previewer-easing.prism-previewer-easing line': {\n 'stroke': '#e2e8f0'\n }\n}"
|
|
515
534
|
},
|
|
516
535
|
"description": "The theme to use for the code block.",
|
|
517
536
|
"name": "theme",
|
package/dist/index.js
CHANGED
|
@@ -138,9 +138,9 @@ const SessionMessagesHeader = ({ children }) => {
|
|
|
138
138
|
};
|
|
139
139
|
const SvgBack = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 1, strokeLinecap: "round", strokeLinejoin: "round", className: "lucide lucide-chevron-left", ...props }, /* @__PURE__ */ React.createElement("path", { d: "m15 18-6-6 6-6" }));
|
|
140
140
|
const SessionMessagePanel = ({ children }) => {
|
|
141
|
-
const { activeSessionId, theme, isCompact, selectSession } = useContext(ChatContext);
|
|
142
|
-
const isVisible = isCompact && activeSessionId;
|
|
143
|
-
return
|
|
141
|
+
const { activeSessionId, theme, isCompact, selectSession, viewType } = useContext(ChatContext);
|
|
142
|
+
const isVisible = isCompact && activeSessionId || viewType === "chat" || !isCompact;
|
|
143
|
+
return isVisible && /* @__PURE__ */ jsx(
|
|
144
144
|
motion.div,
|
|
145
145
|
{
|
|
146
146
|
initial: { translateX: "200%" },
|
|
@@ -159,7 +159,7 @@ const SessionMessagePanel = ({ children }) => {
|
|
|
159
159
|
[theme.messages.console]: !isCompact
|
|
160
160
|
}),
|
|
161
161
|
children: /* @__PURE__ */ jsxs("div", { className: cn(theme.messages.inner), children: [
|
|
162
|
-
isCompact && /* @__PURE__ */ jsxs(
|
|
162
|
+
isCompact && viewType !== "chat" && /* @__PURE__ */ jsxs(
|
|
163
163
|
Button,
|
|
164
164
|
{
|
|
165
165
|
variant: "text",
|
|
@@ -217,9 +217,8 @@ const dark = {
|
|
|
217
217
|
"msHyphens": "none",
|
|
218
218
|
"hyphens": "none",
|
|
219
219
|
"padding": "1em",
|
|
220
|
-
"margin": "0
|
|
221
|
-
"overflow": "auto"
|
|
222
|
-
"borderRadius": "0.3em"
|
|
220
|
+
"margin": "0",
|
|
221
|
+
"overflow": "auto"
|
|
223
222
|
},
|
|
224
223
|
'code[class*="language-"]::-moz-selection': {
|
|
225
224
|
"background": "#1e293b",
|
|
@@ -1184,6 +1183,7 @@ const CodeHighlighter = ({
|
|
|
1184
1183
|
copyClassName,
|
|
1185
1184
|
copyIcon = /* @__PURE__ */ jsx(SvgCopy, {}),
|
|
1186
1185
|
language,
|
|
1186
|
+
toolbarClassName,
|
|
1187
1187
|
theme = dark
|
|
1188
1188
|
}) => {
|
|
1189
1189
|
const match = language == null ? void 0 : language.match(/language-(\w+)/);
|
|
@@ -1196,17 +1196,20 @@ const CodeHighlighter = ({
|
|
|
1196
1196
|
});
|
|
1197
1197
|
};
|
|
1198
1198
|
return /* @__PURE__ */ jsxs("div", { className: cn("relative", className), children: [
|
|
1199
|
-
|
|
1200
|
-
|
|
1201
|
-
|
|
1202
|
-
|
|
1203
|
-
|
|
1204
|
-
|
|
1205
|
-
|
|
1206
|
-
|
|
1207
|
-
|
|
1208
|
-
|
|
1209
|
-
|
|
1199
|
+
/* @__PURE__ */ jsxs("div", { className: cn(toolbarClassName), children: [
|
|
1200
|
+
/* @__PURE__ */ jsx("div", { children: lang }),
|
|
1201
|
+
copyIcon && /* @__PURE__ */ jsx(
|
|
1202
|
+
Button,
|
|
1203
|
+
{
|
|
1204
|
+
className: cn(copyClassName),
|
|
1205
|
+
size: "small",
|
|
1206
|
+
variant: "text",
|
|
1207
|
+
title: "Copy code",
|
|
1208
|
+
onClick: () => handleCopy(children),
|
|
1209
|
+
children: copyIcon
|
|
1210
|
+
}
|
|
1211
|
+
)
|
|
1212
|
+
] }),
|
|
1210
1213
|
/* @__PURE__ */ jsx(
|
|
1211
1214
|
Prism,
|
|
1212
1215
|
{
|
|
@@ -1236,7 +1239,8 @@ const Markdown = ({
|
|
|
1236
1239
|
...props,
|
|
1237
1240
|
language: className,
|
|
1238
1241
|
className: cn(theme.messages.message.markdown.code, className),
|
|
1239
|
-
copyClassName: cn(theme.messages.message.markdown.copy)
|
|
1242
|
+
copyClassName: cn(theme.messages.message.markdown.copy),
|
|
1243
|
+
toolbarClassName: cn(theme.messages.message.markdown.toolbar)
|
|
1240
1244
|
}
|
|
1241
1245
|
),
|
|
1242
1246
|
table: (props) => /* @__PURE__ */ jsx(TableComponent, { ...props, className: cn(theme.messages.message.markdown.table) }),
|
|
@@ -1513,7 +1517,7 @@ const SessionMessages = ({
|
|
|
1513
1517
|
}
|
|
1514
1518
|
}, [activeSession, isAnimating]);
|
|
1515
1519
|
function handleShowMore() {
|
|
1516
|
-
showNext(
|
|
1520
|
+
showNext(limit);
|
|
1517
1521
|
requestAnimationFrame(() => contentRef.current.scrollTop = 0);
|
|
1518
1522
|
}
|
|
1519
1523
|
const reversedConvos = useMemo(
|
|
@@ -1522,7 +1526,7 @@ const SessionMessages = ({
|
|
|
1522
1526
|
);
|
|
1523
1527
|
const { data, hasMore, showNext } = useInfinityList({
|
|
1524
1528
|
items: reversedConvos,
|
|
1525
|
-
limit
|
|
1529
|
+
size: limit
|
|
1526
1530
|
});
|
|
1527
1531
|
const reReversedConvo = useMemo(() => [...data].reverse(), [data]);
|
|
1528
1532
|
const convosToRender = limit ? reReversedConvo : activeSession == null ? void 0 : activeSession.conversations;
|
|
@@ -1547,7 +1551,7 @@ const SessionMessages = ({
|
|
|
1547
1551
|
initial: "hidden",
|
|
1548
1552
|
animate: "visible",
|
|
1549
1553
|
onAnimationComplete: () => {
|
|
1550
|
-
setIsAnimating(false);
|
|
1554
|
+
requestAnimationFrame(() => setIsAnimating(false));
|
|
1551
1555
|
},
|
|
1552
1556
|
children: children(convosToRender)
|
|
1553
1557
|
},
|
|
@@ -1557,7 +1561,7 @@ const SessionMessages = ({
|
|
|
1557
1561
|
};
|
|
1558
1562
|
const chatTheme = {
|
|
1559
1563
|
base: "dark:text-white text-gray-500",
|
|
1560
|
-
console: "flex w-full gap-
|
|
1564
|
+
console: "flex w-full gap-4 h-full",
|
|
1561
1565
|
companion: "w-full h-full overflow-hidden",
|
|
1562
1566
|
empty: "text-center flex-1",
|
|
1563
1567
|
sessions: {
|
|
@@ -1581,7 +1585,7 @@ const chatTheme = {
|
|
|
1581
1585
|
},
|
|
1582
1586
|
messages: {
|
|
1583
1587
|
base: "",
|
|
1584
|
-
console: "flex flex-col
|
|
1588
|
+
console: "flex flex-col mx-5 flex-1 overflow-hidden",
|
|
1585
1589
|
companion: "flex w-full h-full",
|
|
1586
1590
|
back: "self-start p-0 my-2",
|
|
1587
1591
|
inner: "flex-1 h-full flex flex-col",
|
|
@@ -1627,13 +1631,14 @@ const chatTheme = {
|
|
|
1627
1631
|
}
|
|
1628
1632
|
},
|
|
1629
1633
|
markdown: {
|
|
1630
|
-
copy: "
|
|
1634
|
+
copy: "sticky py-1 [&>svg]:w-4 [&>svg]:h-4 opacity-50",
|
|
1631
1635
|
p: "mb-2",
|
|
1632
1636
|
a: "text-blue-400 underline",
|
|
1633
1637
|
table: "table-auto w-full m-2",
|
|
1634
1638
|
th: "px-4 py-2 text-left font-bold border-b border-gray-500",
|
|
1635
1639
|
td: "px-4 py-2",
|
|
1636
|
-
code: "m-2 rounded",
|
|
1640
|
+
code: "m-2 rounded-b relative",
|
|
1641
|
+
toolbar: "text-xs dark:bg-gray-700/50 flex items-center justify-between px-2 py-1 rounded-t sticky top-0 backdrop-blur-md bg-gray-200 ",
|
|
1637
1642
|
li: "mb-2 ml-6",
|
|
1638
1643
|
ul: "mb-4 list-disc",
|
|
1639
1644
|
ol: "mb-4 list-decimal"
|
|
@@ -1754,6 +1759,7 @@ const Chat = ({
|
|
|
1754
1759
|
disabled,
|
|
1755
1760
|
isLoading,
|
|
1756
1761
|
isCompact,
|
|
1762
|
+
viewType,
|
|
1757
1763
|
activeSessionId: internalActiveSessionID,
|
|
1758
1764
|
selectSession: handleSelectSession,
|
|
1759
1765
|
deleteSession: handleDeleteSession,
|
|
@@ -1765,6 +1771,7 @@ const Chat = ({
|
|
|
1765
1771
|
[
|
|
1766
1772
|
isLoading,
|
|
1767
1773
|
isCompact,
|
|
1774
|
+
viewType,
|
|
1768
1775
|
disabled,
|
|
1769
1776
|
theme,
|
|
1770
1777
|
remarkPlugins,
|