@neo4j-ndl/react 4.2.10 → 4.2.11
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/lib/cjs/ai/response/Response.js +56 -32
- package/lib/cjs/ai/response/Response.js.map +1 -1
- package/lib/cjs/ai/response/stories/response-full-example.story.js +1 -1
- package/lib/cjs/ai/response/stories/response-full-example.story.js.map +1 -1
- package/lib/esm/ai/response/Response.js +56 -32
- package/lib/esm/ai/response/Response.js.map +1 -1
- package/lib/esm/ai/response/stories/response-full-example.story.js +1 -1
- package/lib/esm/ai/response/stories/response-full-example.story.js.map +1 -1
- package/lib/types/ai/response/Response.d.ts.map +1 -1
- package/package.json +2 -2
|
@@ -55,84 +55,104 @@ const Response = (0, react_2.memo)((_a) => {
|
|
|
55
55
|
const childrenRef = (0, react_2.useRef)(children);
|
|
56
56
|
childrenRef.current = children;
|
|
57
57
|
const components = (0, react_2.useMemo)(() => ({
|
|
58
|
+
// oxlint-disable-next-line no-unused-vars
|
|
58
59
|
ol: (_a) => {
|
|
59
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
60
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
60
61
|
return ((0, jsx_runtime_1.jsx)("ol", Object.assign({ className: className }, props, { children: children })));
|
|
61
62
|
},
|
|
63
|
+
// oxlint-disable-next-line no-unused-vars
|
|
62
64
|
ul: (_a) => {
|
|
63
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
65
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
64
66
|
return ((0, jsx_runtime_1.jsx)("ul", Object.assign({ className: (0, classnames_1.default)(className) }, props, { children: children })));
|
|
65
67
|
},
|
|
68
|
+
// oxlint-disable-next-line no-unused-vars
|
|
66
69
|
li: (_a) => {
|
|
67
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
70
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
68
71
|
return ((0, jsx_runtime_1.jsx)("li", Object.assign({ className: className }, props, { children: children })));
|
|
69
72
|
},
|
|
73
|
+
// oxlint-disable-next-line no-unused-vars
|
|
70
74
|
hr: (_a) => {
|
|
71
|
-
var { className } = _a, props = __rest(_a, ["className"]);
|
|
75
|
+
var { node, className } = _a, props = __rest(_a, ["node", "className"]);
|
|
72
76
|
return ((0, jsx_runtime_1.jsx)("hr", Object.assign({ className: (0, classnames_1.default)(className) }, props)));
|
|
73
77
|
},
|
|
78
|
+
// oxlint-disable-next-line no-unused-vars
|
|
74
79
|
strong: (_a) => {
|
|
75
|
-
var { children, className, style } = _a, props = __rest(_a, ["children", "className", "style"]);
|
|
80
|
+
var { node, children, className, style } = _a, props = __rest(_a, ["node", "children", "className", "style"]);
|
|
76
81
|
return ((0, jsx_runtime_1.jsx)(react_1.Typography, Object.assign({ as: "strong", variant: "body-medium", className: className, style: Object.assign(Object.assign({}, style), { fontWeight: 'bold' }) }, props, { children: children })));
|
|
77
82
|
},
|
|
83
|
+
// oxlint-disable-next-line no-unused-vars
|
|
78
84
|
em: (_a) => {
|
|
79
|
-
var { children, className, style } = _a, props = __rest(_a, ["children", "className", "style"]);
|
|
85
|
+
var { node, children, className, style } = _a, props = __rest(_a, ["node", "children", "className", "style"]);
|
|
80
86
|
return ((0, jsx_runtime_1.jsx)(react_1.Typography, Object.assign({ as: "em", variant: "body-medium", className: className, style: Object.assign(Object.assign({}, style), { fontStyle: 'italic' }) }, props, { children: children })));
|
|
81
87
|
},
|
|
88
|
+
// oxlint-disable-next-line no-unused-vars
|
|
82
89
|
a: (_a) => {
|
|
83
|
-
var { children, className, href } = _a, props = __rest(_a, ["children", "className", "href"]);
|
|
90
|
+
var { node, children, className, href } = _a, props = __rest(_a, ["node", "children", "className", "href"]);
|
|
84
91
|
return ((0, jsx_runtime_1.jsx)(react_1.TextLink, { type: "internal-underline", className: className, href: href, htmlAttributes: props, children: children }));
|
|
85
92
|
},
|
|
93
|
+
// oxlint-disable-next-line no-unused-vars
|
|
86
94
|
h1: (_a) => {
|
|
87
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
95
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
88
96
|
return ((0, jsx_runtime_1.jsx)(react_1.Typography, { as: "h1", variant: "display", className: className, htmlAttributes: Object.assign({}, props), children: children }));
|
|
89
97
|
},
|
|
98
|
+
// oxlint-disable-next-line no-unused-vars
|
|
90
99
|
h2: (_a) => {
|
|
91
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
100
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
92
101
|
return ((0, jsx_runtime_1.jsx)(react_1.Typography, { as: "h2", variant: "title-1", className: className, htmlAttributes: Object.assign({}, props), children: children }));
|
|
93
102
|
},
|
|
103
|
+
// oxlint-disable-next-line no-unused-vars
|
|
94
104
|
h3: (_a) => {
|
|
95
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
105
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
96
106
|
return ((0, jsx_runtime_1.jsx)(react_1.Typography, { as: "h3", variant: "title-2", className: className, htmlAttributes: Object.assign({}, props), children: children }));
|
|
97
107
|
},
|
|
108
|
+
// oxlint-disable-next-line no-unused-vars
|
|
98
109
|
h4: (_a) => {
|
|
99
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
110
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
100
111
|
return ((0, jsx_runtime_1.jsx)(react_1.Typography, { as: "h4", variant: "title-3", className: className, htmlAttributes: Object.assign({}, props), children: children }));
|
|
101
112
|
},
|
|
113
|
+
// oxlint-disable-next-line no-unused-vars
|
|
102
114
|
h5: (_a) => {
|
|
103
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
115
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
104
116
|
return ((0, jsx_runtime_1.jsx)(react_1.Typography, { as: "h5", variant: "title-4", className: className, htmlAttributes: Object.assign({}, props), children: children }));
|
|
105
117
|
},
|
|
118
|
+
// oxlint-disable-next-line no-unused-vars
|
|
106
119
|
h6: (_a) => {
|
|
107
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
108
|
-
return ((0, jsx_runtime_1.jsx)(react_1.Typography, { as: "h6", variant: "
|
|
120
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
121
|
+
return ((0, jsx_runtime_1.jsx)(react_1.Typography, { as: "h6", variant: "label", className: className, htmlAttributes: Object.assign({}, props), children: children }));
|
|
109
122
|
},
|
|
123
|
+
// oxlint-disable-next-line no-unused-vars
|
|
110
124
|
table: (_a) => {
|
|
111
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
112
|
-
return ((0, jsx_runtime_1.jsx)("div", { className: "
|
|
125
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
126
|
+
return ((0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-response-table-wrapper", children: (0, jsx_runtime_1.jsx)("table", Object.assign({ className: className }, props, { children: children })) }));
|
|
113
127
|
},
|
|
128
|
+
// oxlint-disable-next-line no-unused-vars
|
|
114
129
|
thead: (_a) => {
|
|
115
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
116
|
-
return ((0, jsx_runtime_1.jsx)("thead", Object.assign({ className:
|
|
130
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
131
|
+
return ((0, jsx_runtime_1.jsx)("thead", Object.assign({ className: className }, props, { children: children })));
|
|
117
132
|
},
|
|
133
|
+
// oxlint-disable-next-line no-unused-vars
|
|
118
134
|
tbody: (_a) => {
|
|
119
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
120
|
-
return ((0, jsx_runtime_1.jsx)("tbody", Object.assign({ className:
|
|
135
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
136
|
+
return ((0, jsx_runtime_1.jsx)("tbody", Object.assign({ className: className }, props, { children: children })));
|
|
121
137
|
},
|
|
138
|
+
// oxlint-disable-next-line no-unused-vars
|
|
122
139
|
tr: (_a) => {
|
|
123
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
124
|
-
return ((0, jsx_runtime_1.jsx)("tr", Object.assign({ className:
|
|
140
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
141
|
+
return ((0, jsx_runtime_1.jsx)("tr", Object.assign({ className: className }, props, { children: children })));
|
|
125
142
|
},
|
|
143
|
+
// oxlint-disable-next-line no-unused-vars
|
|
126
144
|
th: (_a) => {
|
|
127
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
128
|
-
return ((0, jsx_runtime_1.jsx)("th", Object.assign({ className:
|
|
145
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
146
|
+
return ((0, jsx_runtime_1.jsx)("th", Object.assign({ className: className }, props, { children: children })));
|
|
129
147
|
},
|
|
148
|
+
// oxlint-disable-next-line no-unused-vars
|
|
130
149
|
td: (_a) => {
|
|
131
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
132
|
-
return ((0, jsx_runtime_1.jsx)("td", Object.assign({ className:
|
|
150
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
151
|
+
return ((0, jsx_runtime_1.jsx)("td", Object.assign({ className: className }, props, { children: children })));
|
|
133
152
|
},
|
|
153
|
+
// oxlint-disable-next-line no-unused-vars
|
|
134
154
|
blockquote: (_a) => {
|
|
135
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
155
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
136
156
|
return ((0, jsx_runtime_1.jsx)("blockquote", Object.assign({ className: (0, classnames_1.default)(className) }, props, { children: children })));
|
|
137
157
|
},
|
|
138
158
|
code: (_a) => {
|
|
@@ -163,19 +183,23 @@ const Response = (0, react_2.memo)((_a) => {
|
|
|
163
183
|
return (0, jsx_runtime_1.jsx)("code", { className: className, children: codeChildren });
|
|
164
184
|
}
|
|
165
185
|
},
|
|
166
|
-
|
|
167
|
-
|
|
186
|
+
// oxlint-disable-next-line no-unused-vars
|
|
187
|
+
pre: (_a) => {
|
|
188
|
+
var { node, className, children } = _a, props = __rest(_a, ["node", "className", "children"]);
|
|
189
|
+
return ((0, jsx_runtime_1.jsx)("pre", Object.assign({ className: className }, props, { children: children })));
|
|
168
190
|
},
|
|
191
|
+
// oxlint-disable-next-line no-unused-vars
|
|
169
192
|
p: (_a) => {
|
|
170
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
193
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
171
194
|
return ((0, jsx_runtime_1.jsx)(react_1.Typography, Object.assign({ as: "p", variant: "body-medium", className: (0, classnames_1.default)(className) }, props, { children: children })));
|
|
172
195
|
},
|
|
196
|
+
// oxlint-disable-next-line no-unused-vars
|
|
173
197
|
img: (_a) => {
|
|
174
|
-
var { className, src, alt } = _a, props = __rest(_a, ["className", "src", "alt"]);
|
|
198
|
+
var { node, className, src, alt } = _a, props = __rest(_a, ["node", "className", "src", "alt"]);
|
|
175
199
|
return ((0, jsx_runtime_1.jsx)("img", Object.assign({ className: (0, classnames_1.default)(className), src: src, alt: alt }, props)));
|
|
176
200
|
},
|
|
177
201
|
}), []);
|
|
178
|
-
return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, style: style, className: (0, classnames_1.default)('ndl-ai-response
|
|
202
|
+
return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, style: style, className: (0, classnames_1.default)('ndl-ai-response', className) }, restProps, htmlAttributes, { children: (0, jsx_runtime_1.jsx)(streamdown_1.Streamdown, { isAnimating: isAnimating, parseIncompleteMarkdown: true, components: components, children: children }) })));
|
|
179
203
|
}, (prevProps, nextProps) => prevProps.children === nextProps.children);
|
|
180
204
|
exports.Response = Response;
|
|
181
205
|
Response.displayName = 'Response';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Response.js","sourceRoot":"","sources":["../../../../src/ai/response/Response.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport { Code, TextLink, Typography } from '@neo4j-ndl/react';\nimport classNames from 'classnames';\nimport { memo, useMemo, useRef } from 'react';\nimport { Streamdown } from 'streamdown';\n\nimport { type CommonProps } from '../../_common/types';\nimport { type LanguageProp, Languages } from '../../code-block/code-languages';\nimport { CodePreview } from '../code-preview';\n\ntype ResponseProps = {\n /** The response from the AI */\n children: string;\n /** Whether the response is animating */\n isAnimating?: React.ComponentProps<typeof Streamdown>['isAnimating'];\n};\n\n/**\n * The component is used to display the response from an LLM.\n * It handles markdown rendering and streaming.\n *\n * @alpha - Changes to this component may be breaking.\n */\nconst Response = memo(\n ({\n className,\n children,\n isAnimating = false,\n ref,\n style,\n htmlAttributes,\n ...restProps\n }: CommonProps<'div', ResponseProps>) => {\n // Use a ref to store the current markdown content so we can check for unclosed fences\n // without recreating the components object on every render\n const childrenRef = useRef(children);\n childrenRef.current = children;\n\n const components: React.ComponentProps<typeof Streamdown>['components'] =\n useMemo(\n () => ({\n ol: ({ children, className, ...props }) => (\n <ol className={className} {...props}>\n {children}\n </ol>\n ),\n ul: ({ children, className, ...props }) => (\n <ul className={classNames(className)} {...props}>\n {children}\n </ul>\n ),\n li: ({ children, className, ...props }) => (\n <li className={className} {...props}>\n {children}\n </li>\n ),\n hr: ({ className, ...props }) => (\n <hr className={classNames(className)} {...props} />\n ),\n strong: ({ children, className, style, ...props }) => (\n <Typography\n as=\"strong\"\n variant=\"body-medium\"\n className={className}\n style={{ ...style, fontWeight: 'bold' }}\n {...props}\n >\n {children}\n </Typography>\n ),\n em: ({ children, className, style, ...props }) => (\n <Typography\n as=\"em\"\n variant=\"body-medium\"\n className={className}\n style={{ ...style, fontStyle: 'italic' }}\n {...props}\n >\n {children}\n </Typography>\n ),\n a: ({ children, className, href, ...props }) => (\n <TextLink\n type=\"internal-underline\"\n className={className}\n href={href}\n htmlAttributes={props}\n >\n {children}\n </TextLink>\n ),\n h1: ({ children, className, ...props }) => (\n <Typography\n as=\"h1\"\n variant=\"display\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n h2: ({ children, className, ...props }) => (\n <Typography\n as=\"h2\"\n variant=\"title-1\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n h3: ({ children, className, ...props }) => (\n <Typography\n as=\"h3\"\n variant=\"title-2\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n h4: ({ children, className, ...props }) => (\n <Typography\n as=\"h4\"\n variant=\"title-3\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n h5: ({ children, className, ...props }) => (\n <Typography\n as=\"h5\"\n variant=\"title-4\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n h6: ({ children, className, ...props }) => (\n <Typography\n as=\"h6\"\n variant=\"subheading-large\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n table: ({ children, className, ...props }) => (\n <div className=\"my-4 overflow-x-auto\">\n <table\n className={classNames(\n 'w-full border-collapse border border-border',\n className,\n )}\n {...props}\n >\n {children}\n </table>\n </div>\n ),\n thead: ({ children, className, ...props }) => (\n <thead className={classNames('bg-muted/50', className)} {...props}>\n {children}\n </thead>\n ),\n tbody: ({ children, className, ...props }) => (\n <tbody\n className={classNames('divide-y divide-border', className)}\n {...props}\n >\n {children}\n </tbody>\n ),\n tr: ({ children, className, ...props }) => (\n <tr\n className={classNames('border-border border-b', className)}\n {...props}\n >\n {children}\n </tr>\n ),\n th: ({ children, className, ...props }) => (\n <th\n className={classNames(\n 'px-4 py-2 text-left font-semibold text-sm',\n className,\n )}\n {...props}\n >\n {children}\n </th>\n ),\n td: ({ children, className, ...props }) => (\n <td\n className={classNames('px-4 py-2 text-sm', className)}\n {...props}\n >\n {children}\n </td>\n ),\n blockquote: ({ children, className, ...props }) => (\n <blockquote className={classNames(className)} {...props}>\n {children}\n </blockquote>\n ),\n code: ({\n node,\n className,\n key,\n children: codeChildren,\n ...props\n }) => {\n const isInline =\n node?.position?.start.line === node?.position?.end.line;\n let language: LanguageProp | 'text' = 'javascript';\n if (typeof node?.properties?.className === 'string') {\n const rawLanguage = node.properties.className.replace(\n 'language-',\n '',\n );\n language = (Languages as readonly string[]).includes(rawLanguage)\n ? (rawLanguage as LanguageProp)\n : 'text';\n }\n if (isInline) {\n return (\n <Code\n isRunnable={false}\n className={className}\n htmlAttributes={props}\n >\n {codeChildren}\n </Code>\n );\n }\n if (typeof codeChildren === 'string') {\n // Check if code fences are balanced in the markdown\n // If there are an odd number of fences, it means there's an unclosed code block\n const fenceMatches = childrenRef.current.match(/```/g);\n const fenceCount = fenceMatches ? fenceMatches.length : 0;\n const hasUnclosedFence = fenceCount % 2 !== 0;\n\n // Show loading state when there's an unclosed fence (code block is streaming)\n const isCodeBlockLoading = hasUnclosedFence;\n return (\n <CodePreview\n key={key}\n code={codeChildren}\n isLoading={isCodeBlockLoading}\n language={language}\n className={className}\n htmlAttributes={{\n ...props,\n }}\n />\n );\n } else {\n return <code className={className}>{codeChildren}</code>;\n }\n },\n pre: ({ className, children }) => {\n return <pre className={classNames(className)}>{children}</pre>;\n },\n p: ({ children, className, ...props }) => (\n <Typography\n as=\"p\"\n variant=\"body-medium\"\n className={classNames(className)}\n {...props}\n >\n {children}\n </Typography>\n ),\n img: ({ className, src, alt, ...props }) => (\n <img\n className={classNames(className)}\n src={src}\n alt={alt}\n {...props}\n />\n ),\n }),\n [],\n );\n\n return (\n <div\n ref={ref}\n style={style}\n className={classNames(\n 'ndl-ai-response size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0',\n className,\n )}\n {...restProps}\n {...htmlAttributes}\n >\n <Streamdown\n isAnimating={isAnimating}\n parseIncompleteMarkdown={true}\n components={components}\n >\n {children}\n </Streamdown>\n </div>\n );\n },\n (prevProps, nextProps) => prevProps.children === nextProps.children,\n);\n\nResponse.displayName = 'Response';\n\nexport { Response };\n"]}
|
|
1
|
+
{"version":3,"file":"Response.js","sourceRoot":"","sources":["../../../../src/ai/response/Response.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport { Code, TextLink, Typography } from '@neo4j-ndl/react';\nimport classNames from 'classnames';\nimport { memo, useMemo, useRef } from 'react';\nimport { Streamdown } from 'streamdown';\n\nimport { type CommonProps } from '../../_common/types';\nimport { type LanguageProp, Languages } from '../../code-block/code-languages';\nimport { CodePreview } from '../code-preview';\n\ntype ResponseProps = {\n /** The response from the AI */\n children: string;\n /** Whether the response is animating */\n isAnimating?: React.ComponentProps<typeof Streamdown>['isAnimating'];\n};\n\n/**\n * The component is used to display the response from an LLM.\n * It handles markdown rendering and streaming.\n *\n * @alpha - Changes to this component may be breaking.\n */\nconst Response = memo(\n ({\n className,\n children,\n isAnimating = false,\n ref,\n style,\n htmlAttributes,\n ...restProps\n }: CommonProps<'div', ResponseProps>) => {\n // Use a ref to store the current markdown content so we can check for unclosed fences\n // without recreating the components object on every render\n const childrenRef = useRef(children);\n childrenRef.current = children;\n\n const components: React.ComponentProps<typeof Streamdown>['components'] =\n useMemo(\n () => ({\n // oxlint-disable-next-line no-unused-vars\n ol: ({ node, children, className, ...props }) => (\n <ol className={className} {...props}>\n {children}\n </ol>\n ),\n // oxlint-disable-next-line no-unused-vars\n ul: ({ node, children, className, ...props }) => (\n <ul className={classNames(className)} {...props}>\n {children}\n </ul>\n ),\n // oxlint-disable-next-line no-unused-vars\n li: ({ node, children, className, ...props }) => (\n <li className={className} {...props}>\n {children}\n </li>\n ),\n // oxlint-disable-next-line no-unused-vars\n hr: ({ node, className, ...props }) => (\n <hr className={classNames(className)} {...props} />\n ),\n // oxlint-disable-next-line no-unused-vars\n strong: ({ node, children, className, style, ...props }) => (\n <Typography\n as=\"strong\"\n variant=\"body-medium\"\n className={className}\n style={{ ...style, fontWeight: 'bold' }}\n {...props}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n em: ({ node, children, className, style, ...props }) => (\n <Typography\n as=\"em\"\n variant=\"body-medium\"\n className={className}\n style={{ ...style, fontStyle: 'italic' }}\n {...props}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n a: ({ node, children, className, href, ...props }) => (\n <TextLink\n type=\"internal-underline\"\n className={className}\n href={href}\n htmlAttributes={props}\n >\n {children}\n </TextLink>\n ),\n // oxlint-disable-next-line no-unused-vars\n h1: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h1\"\n variant=\"display\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h2: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h2\"\n variant=\"title-1\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h3: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h3\"\n variant=\"title-2\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h4: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h4\"\n variant=\"title-3\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h5: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h5\"\n variant=\"title-4\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h6: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h6\"\n variant=\"label\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n table: ({ node, children, className, ...props }) => (\n <div className=\"ndl-ai-response-table-wrapper\">\n <table className={className} {...props}>\n {children}\n </table>\n </div>\n ),\n // oxlint-disable-next-line no-unused-vars\n thead: ({ node, children, className, ...props }) => (\n <thead className={className} {...props}>\n {children}\n </thead>\n ),\n // oxlint-disable-next-line no-unused-vars\n tbody: ({ node, children, className, ...props }) => (\n <tbody className={className} {...props}>\n {children}\n </tbody>\n ),\n // oxlint-disable-next-line no-unused-vars\n tr: ({ node, children, className, ...props }) => (\n <tr className={className} {...props}>\n {children}\n </tr>\n ),\n // oxlint-disable-next-line no-unused-vars\n th: ({ node, children, className, ...props }) => (\n <th className={className} {...props}>\n {children}\n </th>\n ),\n // oxlint-disable-next-line no-unused-vars\n td: ({ node, children, className, ...props }) => (\n <td className={className} {...props}>\n {children}\n </td>\n ),\n // oxlint-disable-next-line no-unused-vars\n blockquote: ({ node, children, className, ...props }) => (\n <blockquote className={classNames(className)} {...props}>\n {children}\n </blockquote>\n ),\n code: ({\n node,\n className,\n key,\n children: codeChildren,\n ...props\n }) => {\n const isInline =\n node?.position?.start.line === node?.position?.end.line;\n let language: LanguageProp | 'text' = 'javascript';\n if (typeof node?.properties?.className === 'string') {\n const rawLanguage = node.properties.className.replace(\n 'language-',\n '',\n );\n language = (Languages as readonly string[]).includes(rawLanguage)\n ? (rawLanguage as LanguageProp)\n : 'text';\n }\n if (isInline) {\n return (\n <Code\n isRunnable={false}\n className={className}\n htmlAttributes={props}\n >\n {codeChildren}\n </Code>\n );\n }\n if (typeof codeChildren === 'string') {\n // Check if code fences are balanced in the markdown\n // If there are an odd number of fences, it means there's an unclosed code block\n const fenceMatches = childrenRef.current.match(/```/g);\n const fenceCount = fenceMatches ? fenceMatches.length : 0;\n const hasUnclosedFence = fenceCount % 2 !== 0;\n\n // Show loading state when there's an unclosed fence (code block is streaming)\n const isCodeBlockLoading = hasUnclosedFence;\n return (\n <CodePreview\n key={key}\n code={codeChildren}\n isLoading={isCodeBlockLoading}\n language={language}\n className={className}\n htmlAttributes={{\n ...props,\n }}\n />\n );\n } else {\n return <code className={className}>{codeChildren}</code>;\n }\n },\n // oxlint-disable-next-line no-unused-vars\n pre: ({ node, className, children, ...props }) => {\n return (\n <pre className={className} {...props}>\n {children}\n </pre>\n );\n },\n // oxlint-disable-next-line no-unused-vars\n p: ({ node, children, className, ...props }) => (\n <Typography\n as=\"p\"\n variant=\"body-medium\"\n className={classNames(className)}\n {...props}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n img: ({ node, className, src, alt, ...props }) => (\n <img\n className={classNames(className)}\n src={src}\n alt={alt}\n {...props}\n />\n ),\n }),\n [],\n );\n\n return (\n <div\n ref={ref}\n style={style}\n className={classNames('ndl-ai-response', className)}\n {...restProps}\n {...htmlAttributes}\n >\n <Streamdown\n isAnimating={isAnimating}\n parseIncompleteMarkdown={true}\n components={components}\n >\n {children}\n </Streamdown>\n </div>\n );\n },\n (prevProps, nextProps) => prevProps.children === nextProps.children,\n);\n\nResponse.displayName = 'Response';\n\nexport { Response };\n"]}
|
|
@@ -155,7 +155,7 @@ const Component = () => {
|
|
|
155
155
|
}, children: "Generate a report" })] }), (0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "body-medium", children: ["You can also drag and drop files here, or", ' ', (0, jsx_runtime_1.jsx)(react_1.TextLink, { as: "button", type: "internal-underline", children: "browse" }), ". Supports CVG, MOV, PDF"] })] }) })) : ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-4 n-pb-4", children: [messages.map((msg, idx) => ((0, jsx_runtime_1.jsx)("div", { className: `n-flex ${msg.role === 'user' ? 'n-justify-end' : 'n-justify-start'}`, children: msg.role === 'user' ? ((0, jsx_runtime_1.jsx)("div", { className: "n-max-w-[85%]", children: (0, jsx_runtime_1.jsx)(ai_1.UserBubble, { avatarProps: {
|
|
156
156
|
name: 'NM',
|
|
157
157
|
type: 'letters',
|
|
158
|
-
}, children: msg.content }) })) : ((0, jsx_runtime_1.jsxs)("div", { className: "n-w-full n-flex n-flex-col n-gap-2", children: [msg.thinkingTime !== undefined && ((0, jsx_runtime_1.jsx)(ai_1.Thinking, { isThinking: false, thinkingMs: msg.thinkingTime })), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-2", children: [(0, jsx_runtime_1.jsx)(ai_1.Response, { children: msg.content }), msg.done === true && ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-1.5", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { size: "small", description: "Dislike", children: (0, jsx_runtime_1.jsx)(icons_1.HandThumbDownIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { size: "small", description: "Re-run", children: (0, jsx_runtime_1.jsx)(icons_1.ArrowPathIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { size: "small", description: "Copy", children: (0, jsx_runtime_1.jsx)(icons_1.Square2StackIconOutline, {}) })] }))] })] })) }, idx))), isThinking && (0, jsx_runtime_1.jsx)(ai_1.Thinking, { isThinking: true }), (0, jsx_runtime_1.jsx)("div", { ref: messagesEndRef })] })) }), (0, jsx_runtime_1.jsx)("div", { className: "n-
|
|
158
|
+
}, children: msg.content }) })) : ((0, jsx_runtime_1.jsxs)("div", { className: "n-w-full n-flex n-flex-col n-gap-2", children: [msg.thinkingTime !== undefined && ((0, jsx_runtime_1.jsx)(ai_1.Thinking, { isThinking: false, thinkingMs: msg.thinkingTime })), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-2", children: [(0, jsx_runtime_1.jsx)(ai_1.Response, { children: msg.content }), msg.done === true && ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-1.5", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { size: "small", description: "Dislike", children: (0, jsx_runtime_1.jsx)(icons_1.HandThumbDownIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { size: "small", description: "Re-run", children: (0, jsx_runtime_1.jsx)(icons_1.ArrowPathIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { size: "small", description: "Copy", children: (0, jsx_runtime_1.jsx)(icons_1.Square2StackIconOutline, {}) })] }))] })] })) }, idx))), isThinking && (0, jsx_runtime_1.jsx)(ai_1.Thinking, { isThinking: true }), (0, jsx_runtime_1.jsx)("div", { ref: messagesEndRef })] })) }), (0, jsx_runtime_1.jsx)("div", { className: "n-px-4 n-pt-4 n-pb-1 n-mt-auto", children: (0, jsx_runtime_1.jsx)(ai_1.Prompt, { value: prompt, onChange: (e) => setPrompt(e.target.value), onSubmitPrompt: () => handleSend(), isRunningPrompt: isThinking || isStreaming, isSubmitDisabled: prompt.length === 0 && !(isThinking || isStreaming), bottomContent: (0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Add files", size: "small", children: (0, jsx_runtime_1.jsx)(icons_1.PlusIconOutline, {}) }) }) })] }) }));
|
|
159
159
|
};
|
|
160
160
|
exports.Component = Component;
|
|
161
161
|
exports.default = exports.Component;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"response-full-example.story.js","sourceRoot":"","sources":["../../../../../src/ai/response/stories/response-full-example.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { CleanIconButton, TextLink, Typography } from '@neo4j-ndl/react';\nimport {\n Prompt,\n Response,\n Suggestion,\n Thinking,\n UserBubble,\n} from '@neo4j-ndl/react/ai';\nimport {\n ArrowPathIconOutline,\n Cog6ToothIconOutline,\n HandThumbDownIconOutline,\n PlusIconOutline,\n Square2StackIconOutline,\n XMarkIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { useEffect, useRef, useState } from 'react';\n\nconst FAKE_RESPONSES = [\n `Here is a simple response with some **bold text** and *italics*.`,\n `Here is a list of items:\n- Item 1\n- Item 2\n- Item 3`,\n `Here is a code block example:\n\n\\`\\`\\`typescript\nconst greeting = \"Hello World\";\nconsole.log(greeting);\n\\`\\`\\`\n`,\n `# Heading 1\n## Heading 2\n### Heading 3\n\nSome text under headings.`,\n `You can also use tables:\n\n| Header 1 | Header 2 |\n|Data 1|Data 2|\n|Data 3|Data 4|\n`,\n];\n\nexport const Component = () => {\n const [messages, setMessages] = useState<\n {\n role: 'user' | 'assistant';\n content: string;\n thinkingTime?: number;\n done?: boolean;\n }[]\n >([]);\n const [prompt, setPrompt] = useState('');\n const [isThinking, setIsThinking] = useState(false);\n const [isStreaming, setIsStreaming] = useState(false);\n const [responseIndex, setResponseIndex] = useState(0);\n const messagesEndRef = useRef<HTMLDivElement>(null);\n const timeoutRef = useRef<NodeJS.Timeout | null>(null);\n const intervalRef = useRef<NodeJS.Timeout | null>(null);\n\n const scrollToBottom = () => {\n messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });\n };\n\n useEffect(() => {\n scrollToBottom();\n }, [messages, isThinking]);\n\n const handleSend = (overridePrompt?: string) => {\n // Handle Stop\n if (isThinking || isStreaming) {\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n if (intervalRef.current) {\n clearInterval(intervalRef.current);\n }\n setIsThinking(false);\n setIsStreaming(false);\n\n // Mark the last message as done if stopped\n setMessages((prev) => {\n const newMessages = [...prev];\n const lastMessage = newMessages[newMessages.length - 1];\n if (lastMessage?.role === 'assistant') {\n lastMessage.done = true;\n }\n return newMessages;\n });\n return;\n }\n\n const textToSend = overridePrompt || prompt;\n\n if (!textToSend.trim()) {\n return;\n }\n\n setMessages((prev) => [...prev, { content: textToSend, role: 'user' }]);\n setPrompt('');\n setIsThinking(true);\n const startTime = Date.now();\n\n // Simulate network delay (thinking time)\n timeoutRef.current = setTimeout(() => {\n const endTime = Date.now();\n const thinkingTime = endTime - startTime;\n setIsThinking(false);\n setIsStreaming(true);\n\n const responseText = FAKE_RESPONSES[responseIndex];\n setResponseIndex((prev) => (prev + 1) % FAKE_RESPONSES.length);\n\n let currentText = '';\n setMessages((prev) => [\n ...prev,\n { content: '', done: false, role: 'assistant', thinkingTime },\n ]);\n\n // Simulate streaming\n intervalRef.current = setInterval(() => {\n if (currentText.length < responseText.length) {\n // Add a few characters at a time to simulate chunks\n // Ensure we don't split newlines incorrectly if that's an issue,\n // but simple slicing should be fine as long as the source has \\n.\n const chunk = responseText.slice(\n currentText.length,\n currentText.length + 2,\n );\n currentText += chunk;\n\n setMessages((prev) => {\n const newMessages = [...prev];\n const lastMessage = newMessages[newMessages.length - 1];\n if (lastMessage.role === 'assistant') {\n lastMessage.content = currentText;\n }\n return newMessages;\n });\n } else {\n if (intervalRef.current) {\n clearInterval(intervalRef.current);\n }\n setIsStreaming(false);\n setMessages((prev) => {\n const newMessages = [...prev];\n const lastMessage = newMessages[newMessages.length - 1];\n if (lastMessage.role === 'assistant') {\n lastMessage.done = true;\n }\n return newMessages;\n });\n }\n }, 50);\n }, 2000);\n };\n\n return (\n <section className=\"n-h-screen\">\n <div className=\"n-w-[440px] n-h-full n-flex n-flex-col n-bg-neutral-bg-weak\">\n <div className=\"n-flex n-flex-row n-border-b n-border-neutral-border-weak n-p-3\">\n <div className=\"n-ml-auto\">\n <CleanIconButton description=\"settings\" tooltipProps={{}}>\n <Cog6ToothIconOutline />\n </CleanIconButton>\n <CleanIconButton description=\"close\">\n <XMarkIconOutline />\n </CleanIconButton>\n </div>\n </div>\n <div className=\"n-p-4 n-flex n-flex-col n-grow n-overflow-y-auto\">\n {messages.length === 0 ? (\n <div className=\"n-flex n-flex-col \">\n <div className=\"n-flex n-flex-col n-gap-12\">\n <Typography variant=\"display\">\n Hi [User], how can I help you today?\n </Typography>\n <div className=\"n-flex n-flex-col n-gap-4\">\n <Typography variant=\"body-medium\">Suggestions</Typography>\n <Suggestion\n isPrimary\n onClick={() => {\n handleSend('I want to import data');\n }}\n >\n I want to import data\n </Suggestion>\n <Suggestion\n onClick={() => {\n handleSend('Create an AI agent');\n }}\n >\n Create an AI agent\n </Suggestion>\n <Suggestion\n onClick={() => {\n handleSend('Invite project members');\n }}\n >\n Invite project members\n </Suggestion>\n <Suggestion\n onClick={() => {\n handleSend('Generate a report');\n }}\n >\n Generate a report\n </Suggestion>\n </div>\n <Typography variant=\"body-medium\">\n You can also drag and drop files here, or{' '}\n <TextLink as=\"button\" type=\"internal-underline\">\n browse\n </TextLink>\n . Supports CVG, MOV, PDF\n </Typography>\n </div>\n </div>\n ) : (\n <div className=\"n-flex n-flex-col n-gap-4 n-pb-4\">\n {messages.map((msg, idx) => (\n <div\n key={idx}\n className={`n-flex ${\n msg.role === 'user' ? 'n-justify-end' : 'n-justify-start'\n }`}\n >\n {msg.role === 'user' ? (\n <div className=\"n-max-w-[85%]\">\n <UserBubble\n avatarProps={{\n name: 'NM',\n type: 'letters',\n }}\n >\n {msg.content}\n </UserBubble>\n </div>\n ) : (\n <div className=\"n-w-full n-flex n-flex-col n-gap-2\">\n {msg.thinkingTime !== undefined && (\n <Thinking\n isThinking={false}\n thinkingMs={msg.thinkingTime}\n />\n )}\n <div className=\"n-flex n-flex-col n-gap-2\">\n <Response>{msg.content}</Response>\n\n {msg.done === true && (\n <div className=\"n-flex n-flex-row n-gap-1.5\">\n <CleanIconButton size=\"small\" description=\"Dislike\">\n <HandThumbDownIconOutline />\n </CleanIconButton>\n <CleanIconButton size=\"small\" description=\"Re-run\">\n <ArrowPathIconOutline />\n </CleanIconButton>\n <CleanIconButton size=\"small\" description=\"Copy\">\n <Square2StackIconOutline />\n </CleanIconButton>\n </div>\n )}\n </div>\n </div>\n )}\n </div>\n ))}\n {isThinking && <Thinking isThinking={true} />}\n <div ref={messagesEndRef} />\n </div>\n )}\n </div>\n <div className=\"n-p-4 n-mt-auto\">\n <Prompt\n value={prompt}\n onChange={(e) => setPrompt(e.target.value)}\n onSubmitPrompt={() => handleSend()}\n isRunningPrompt={isThinking || isStreaming}\n isSubmitDisabled={\n prompt.length === 0 && !(isThinking || isStreaming)\n }\n bottomContent={\n <CleanIconButton description=\"Add files\" size=\"small\">\n <PlusIconOutline />\n </CleanIconButton>\n }\n />\n </div>\n </div>\n </section>\n );\n};\n\nexport default Component;\n"]}
|
|
1
|
+
{"version":3,"file":"response-full-example.story.js","sourceRoot":"","sources":["../../../../../src/ai/response/stories/response-full-example.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { CleanIconButton, TextLink, Typography } from '@neo4j-ndl/react';\nimport {\n Prompt,\n Response,\n Suggestion,\n Thinking,\n UserBubble,\n} from '@neo4j-ndl/react/ai';\nimport {\n ArrowPathIconOutline,\n Cog6ToothIconOutline,\n HandThumbDownIconOutline,\n PlusIconOutline,\n Square2StackIconOutline,\n XMarkIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { useEffect, useRef, useState } from 'react';\n\nconst FAKE_RESPONSES = [\n `Here is a simple response with some **bold text** and *italics*.`,\n `Here is a list of items:\n- Item 1\n- Item 2\n- Item 3`,\n `Here is a code block example:\n\n\\`\\`\\`typescript\nconst greeting = \"Hello World\";\nconsole.log(greeting);\n\\`\\`\\`\n`,\n `# Heading 1\n## Heading 2\n### Heading 3\n\nSome text under headings.`,\n `You can also use tables:\n\n| Header 1 | Header 2 |\n|Data 1|Data 2|\n|Data 3|Data 4|\n`,\n];\n\nexport const Component = () => {\n const [messages, setMessages] = useState<\n {\n role: 'user' | 'assistant';\n content: string;\n thinkingTime?: number;\n done?: boolean;\n }[]\n >([]);\n const [prompt, setPrompt] = useState('');\n const [isThinking, setIsThinking] = useState(false);\n const [isStreaming, setIsStreaming] = useState(false);\n const [responseIndex, setResponseIndex] = useState(0);\n const messagesEndRef = useRef<HTMLDivElement>(null);\n const timeoutRef = useRef<NodeJS.Timeout | null>(null);\n const intervalRef = useRef<NodeJS.Timeout | null>(null);\n\n const scrollToBottom = () => {\n messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });\n };\n\n useEffect(() => {\n scrollToBottom();\n }, [messages, isThinking]);\n\n const handleSend = (overridePrompt?: string) => {\n // Handle Stop\n if (isThinking || isStreaming) {\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n if (intervalRef.current) {\n clearInterval(intervalRef.current);\n }\n setIsThinking(false);\n setIsStreaming(false);\n\n // Mark the last message as done if stopped\n setMessages((prev) => {\n const newMessages = [...prev];\n const lastMessage = newMessages[newMessages.length - 1];\n if (lastMessage?.role === 'assistant') {\n lastMessage.done = true;\n }\n return newMessages;\n });\n return;\n }\n\n const textToSend = overridePrompt || prompt;\n\n if (!textToSend.trim()) {\n return;\n }\n\n setMessages((prev) => [...prev, { content: textToSend, role: 'user' }]);\n setPrompt('');\n setIsThinking(true);\n const startTime = Date.now();\n\n // Simulate network delay (thinking time)\n timeoutRef.current = setTimeout(() => {\n const endTime = Date.now();\n const thinkingTime = endTime - startTime;\n setIsThinking(false);\n setIsStreaming(true);\n\n const responseText = FAKE_RESPONSES[responseIndex];\n setResponseIndex((prev) => (prev + 1) % FAKE_RESPONSES.length);\n\n let currentText = '';\n setMessages((prev) => [\n ...prev,\n { content: '', done: false, role: 'assistant', thinkingTime },\n ]);\n\n // Simulate streaming\n intervalRef.current = setInterval(() => {\n if (currentText.length < responseText.length) {\n // Add a few characters at a time to simulate chunks\n // Ensure we don't split newlines incorrectly if that's an issue,\n // but simple slicing should be fine as long as the source has \\n.\n const chunk = responseText.slice(\n currentText.length,\n currentText.length + 2,\n );\n currentText += chunk;\n\n setMessages((prev) => {\n const newMessages = [...prev];\n const lastMessage = newMessages[newMessages.length - 1];\n if (lastMessage.role === 'assistant') {\n lastMessage.content = currentText;\n }\n return newMessages;\n });\n } else {\n if (intervalRef.current) {\n clearInterval(intervalRef.current);\n }\n setIsStreaming(false);\n setMessages((prev) => {\n const newMessages = [...prev];\n const lastMessage = newMessages[newMessages.length - 1];\n if (lastMessage.role === 'assistant') {\n lastMessage.done = true;\n }\n return newMessages;\n });\n }\n }, 50);\n }, 2000);\n };\n\n return (\n <section className=\"n-h-screen\">\n <div className=\"n-w-[440px] n-h-full n-flex n-flex-col n-bg-neutral-bg-weak\">\n <div className=\"n-flex n-flex-row n-border-b n-border-neutral-border-weak n-p-3\">\n <div className=\"n-ml-auto\">\n <CleanIconButton description=\"settings\" tooltipProps={{}}>\n <Cog6ToothIconOutline />\n </CleanIconButton>\n <CleanIconButton description=\"close\">\n <XMarkIconOutline />\n </CleanIconButton>\n </div>\n </div>\n <div className=\"n-p-4 n-flex n-flex-col n-grow n-overflow-y-auto\">\n {messages.length === 0 ? (\n <div className=\"n-flex n-flex-col \">\n <div className=\"n-flex n-flex-col n-gap-12\">\n <Typography variant=\"display\">\n Hi [User], how can I help you today?\n </Typography>\n <div className=\"n-flex n-flex-col n-gap-4\">\n <Typography variant=\"body-medium\">Suggestions</Typography>\n <Suggestion\n isPrimary\n onClick={() => {\n handleSend('I want to import data');\n }}\n >\n I want to import data\n </Suggestion>\n <Suggestion\n onClick={() => {\n handleSend('Create an AI agent');\n }}\n >\n Create an AI agent\n </Suggestion>\n <Suggestion\n onClick={() => {\n handleSend('Invite project members');\n }}\n >\n Invite project members\n </Suggestion>\n <Suggestion\n onClick={() => {\n handleSend('Generate a report');\n }}\n >\n Generate a report\n </Suggestion>\n </div>\n <Typography variant=\"body-medium\">\n You can also drag and drop files here, or{' '}\n <TextLink as=\"button\" type=\"internal-underline\">\n browse\n </TextLink>\n . Supports CVG, MOV, PDF\n </Typography>\n </div>\n </div>\n ) : (\n <div className=\"n-flex n-flex-col n-gap-4 n-pb-4\">\n {messages.map((msg, idx) => (\n <div\n key={idx}\n className={`n-flex ${\n msg.role === 'user' ? 'n-justify-end' : 'n-justify-start'\n }`}\n >\n {msg.role === 'user' ? (\n <div className=\"n-max-w-[85%]\">\n <UserBubble\n avatarProps={{\n name: 'NM',\n type: 'letters',\n }}\n >\n {msg.content}\n </UserBubble>\n </div>\n ) : (\n <div className=\"n-w-full n-flex n-flex-col n-gap-2\">\n {msg.thinkingTime !== undefined && (\n <Thinking\n isThinking={false}\n thinkingMs={msg.thinkingTime}\n />\n )}\n <div className=\"n-flex n-flex-col n-gap-2\">\n <Response>{msg.content}</Response>\n\n {msg.done === true && (\n <div className=\"n-flex n-flex-row n-gap-1.5\">\n <CleanIconButton size=\"small\" description=\"Dislike\">\n <HandThumbDownIconOutline />\n </CleanIconButton>\n <CleanIconButton size=\"small\" description=\"Re-run\">\n <ArrowPathIconOutline />\n </CleanIconButton>\n <CleanIconButton size=\"small\" description=\"Copy\">\n <Square2StackIconOutline />\n </CleanIconButton>\n </div>\n )}\n </div>\n </div>\n )}\n </div>\n ))}\n {isThinking && <Thinking isThinking={true} />}\n <div ref={messagesEndRef} />\n </div>\n )}\n </div>\n <div className=\"n-px-4 n-pt-4 n-pb-1 n-mt-auto\">\n <Prompt\n value={prompt}\n onChange={(e) => setPrompt(e.target.value)}\n onSubmitPrompt={() => handleSend()}\n isRunningPrompt={isThinking || isStreaming}\n isSubmitDisabled={\n prompt.length === 0 && !(isThinking || isStreaming)\n }\n bottomContent={\n <CleanIconButton description=\"Add files\" size=\"small\">\n <PlusIconOutline />\n </CleanIconButton>\n }\n />\n </div>\n </div>\n </section>\n );\n};\n\nexport default Component;\n"]}
|
|
@@ -49,84 +49,104 @@ const Response = memo((_a) => {
|
|
|
49
49
|
const childrenRef = useRef(children);
|
|
50
50
|
childrenRef.current = children;
|
|
51
51
|
const components = useMemo(() => ({
|
|
52
|
+
// oxlint-disable-next-line no-unused-vars
|
|
52
53
|
ol: (_a) => {
|
|
53
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
54
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
54
55
|
return (_jsx("ol", Object.assign({ className: className }, props, { children: children })));
|
|
55
56
|
},
|
|
57
|
+
// oxlint-disable-next-line no-unused-vars
|
|
56
58
|
ul: (_a) => {
|
|
57
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
59
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
58
60
|
return (_jsx("ul", Object.assign({ className: classNames(className) }, props, { children: children })));
|
|
59
61
|
},
|
|
62
|
+
// oxlint-disable-next-line no-unused-vars
|
|
60
63
|
li: (_a) => {
|
|
61
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
64
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
62
65
|
return (_jsx("li", Object.assign({ className: className }, props, { children: children })));
|
|
63
66
|
},
|
|
67
|
+
// oxlint-disable-next-line no-unused-vars
|
|
64
68
|
hr: (_a) => {
|
|
65
|
-
var { className } = _a, props = __rest(_a, ["className"]);
|
|
69
|
+
var { node, className } = _a, props = __rest(_a, ["node", "className"]);
|
|
66
70
|
return (_jsx("hr", Object.assign({ className: classNames(className) }, props)));
|
|
67
71
|
},
|
|
72
|
+
// oxlint-disable-next-line no-unused-vars
|
|
68
73
|
strong: (_a) => {
|
|
69
|
-
var { children, className, style } = _a, props = __rest(_a, ["children", "className", "style"]);
|
|
74
|
+
var { node, children, className, style } = _a, props = __rest(_a, ["node", "children", "className", "style"]);
|
|
70
75
|
return (_jsx(Typography, Object.assign({ as: "strong", variant: "body-medium", className: className, style: Object.assign(Object.assign({}, style), { fontWeight: 'bold' }) }, props, { children: children })));
|
|
71
76
|
},
|
|
77
|
+
// oxlint-disable-next-line no-unused-vars
|
|
72
78
|
em: (_a) => {
|
|
73
|
-
var { children, className, style } = _a, props = __rest(_a, ["children", "className", "style"]);
|
|
79
|
+
var { node, children, className, style } = _a, props = __rest(_a, ["node", "children", "className", "style"]);
|
|
74
80
|
return (_jsx(Typography, Object.assign({ as: "em", variant: "body-medium", className: className, style: Object.assign(Object.assign({}, style), { fontStyle: 'italic' }) }, props, { children: children })));
|
|
75
81
|
},
|
|
82
|
+
// oxlint-disable-next-line no-unused-vars
|
|
76
83
|
a: (_a) => {
|
|
77
|
-
var { children, className, href } = _a, props = __rest(_a, ["children", "className", "href"]);
|
|
84
|
+
var { node, children, className, href } = _a, props = __rest(_a, ["node", "children", "className", "href"]);
|
|
78
85
|
return (_jsx(TextLink, { type: "internal-underline", className: className, href: href, htmlAttributes: props, children: children }));
|
|
79
86
|
},
|
|
87
|
+
// oxlint-disable-next-line no-unused-vars
|
|
80
88
|
h1: (_a) => {
|
|
81
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
89
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
82
90
|
return (_jsx(Typography, { as: "h1", variant: "display", className: className, htmlAttributes: Object.assign({}, props), children: children }));
|
|
83
91
|
},
|
|
92
|
+
// oxlint-disable-next-line no-unused-vars
|
|
84
93
|
h2: (_a) => {
|
|
85
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
94
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
86
95
|
return (_jsx(Typography, { as: "h2", variant: "title-1", className: className, htmlAttributes: Object.assign({}, props), children: children }));
|
|
87
96
|
},
|
|
97
|
+
// oxlint-disable-next-line no-unused-vars
|
|
88
98
|
h3: (_a) => {
|
|
89
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
99
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
90
100
|
return (_jsx(Typography, { as: "h3", variant: "title-2", className: className, htmlAttributes: Object.assign({}, props), children: children }));
|
|
91
101
|
},
|
|
102
|
+
// oxlint-disable-next-line no-unused-vars
|
|
92
103
|
h4: (_a) => {
|
|
93
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
104
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
94
105
|
return (_jsx(Typography, { as: "h4", variant: "title-3", className: className, htmlAttributes: Object.assign({}, props), children: children }));
|
|
95
106
|
},
|
|
107
|
+
// oxlint-disable-next-line no-unused-vars
|
|
96
108
|
h5: (_a) => {
|
|
97
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
109
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
98
110
|
return (_jsx(Typography, { as: "h5", variant: "title-4", className: className, htmlAttributes: Object.assign({}, props), children: children }));
|
|
99
111
|
},
|
|
112
|
+
// oxlint-disable-next-line no-unused-vars
|
|
100
113
|
h6: (_a) => {
|
|
101
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
102
|
-
return (_jsx(Typography, { as: "h6", variant: "
|
|
114
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
115
|
+
return (_jsx(Typography, { as: "h6", variant: "label", className: className, htmlAttributes: Object.assign({}, props), children: children }));
|
|
103
116
|
},
|
|
117
|
+
// oxlint-disable-next-line no-unused-vars
|
|
104
118
|
table: (_a) => {
|
|
105
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
106
|
-
return (_jsx("div", { className: "
|
|
119
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
120
|
+
return (_jsx("div", { className: "ndl-ai-response-table-wrapper", children: _jsx("table", Object.assign({ className: className }, props, { children: children })) }));
|
|
107
121
|
},
|
|
122
|
+
// oxlint-disable-next-line no-unused-vars
|
|
108
123
|
thead: (_a) => {
|
|
109
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
110
|
-
return (_jsx("thead", Object.assign({ className:
|
|
124
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
125
|
+
return (_jsx("thead", Object.assign({ className: className }, props, { children: children })));
|
|
111
126
|
},
|
|
127
|
+
// oxlint-disable-next-line no-unused-vars
|
|
112
128
|
tbody: (_a) => {
|
|
113
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
114
|
-
return (_jsx("tbody", Object.assign({ className:
|
|
129
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
130
|
+
return (_jsx("tbody", Object.assign({ className: className }, props, { children: children })));
|
|
115
131
|
},
|
|
132
|
+
// oxlint-disable-next-line no-unused-vars
|
|
116
133
|
tr: (_a) => {
|
|
117
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
118
|
-
return (_jsx("tr", Object.assign({ className:
|
|
134
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
135
|
+
return (_jsx("tr", Object.assign({ className: className }, props, { children: children })));
|
|
119
136
|
},
|
|
137
|
+
// oxlint-disable-next-line no-unused-vars
|
|
120
138
|
th: (_a) => {
|
|
121
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
122
|
-
return (_jsx("th", Object.assign({ className:
|
|
139
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
140
|
+
return (_jsx("th", Object.assign({ className: className }, props, { children: children })));
|
|
123
141
|
},
|
|
142
|
+
// oxlint-disable-next-line no-unused-vars
|
|
124
143
|
td: (_a) => {
|
|
125
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
126
|
-
return (_jsx("td", Object.assign({ className:
|
|
144
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
145
|
+
return (_jsx("td", Object.assign({ className: className }, props, { children: children })));
|
|
127
146
|
},
|
|
147
|
+
// oxlint-disable-next-line no-unused-vars
|
|
128
148
|
blockquote: (_a) => {
|
|
129
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
149
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
130
150
|
return (_jsx("blockquote", Object.assign({ className: classNames(className) }, props, { children: children })));
|
|
131
151
|
},
|
|
132
152
|
code: (_a) => {
|
|
@@ -157,19 +177,23 @@ const Response = memo((_a) => {
|
|
|
157
177
|
return _jsx("code", { className: className, children: codeChildren });
|
|
158
178
|
}
|
|
159
179
|
},
|
|
160
|
-
|
|
161
|
-
|
|
180
|
+
// oxlint-disable-next-line no-unused-vars
|
|
181
|
+
pre: (_a) => {
|
|
182
|
+
var { node, className, children } = _a, props = __rest(_a, ["node", "className", "children"]);
|
|
183
|
+
return (_jsx("pre", Object.assign({ className: className }, props, { children: children })));
|
|
162
184
|
},
|
|
185
|
+
// oxlint-disable-next-line no-unused-vars
|
|
163
186
|
p: (_a) => {
|
|
164
|
-
var { children, className } = _a, props = __rest(_a, ["children", "className"]);
|
|
187
|
+
var { node, children, className } = _a, props = __rest(_a, ["node", "children", "className"]);
|
|
165
188
|
return (_jsx(Typography, Object.assign({ as: "p", variant: "body-medium", className: classNames(className) }, props, { children: children })));
|
|
166
189
|
},
|
|
190
|
+
// oxlint-disable-next-line no-unused-vars
|
|
167
191
|
img: (_a) => {
|
|
168
|
-
var { className, src, alt } = _a, props = __rest(_a, ["className", "src", "alt"]);
|
|
192
|
+
var { node, className, src, alt } = _a, props = __rest(_a, ["node", "className", "src", "alt"]);
|
|
169
193
|
return (_jsx("img", Object.assign({ className: classNames(className), src: src, alt: alt }, props)));
|
|
170
194
|
},
|
|
171
195
|
}), []);
|
|
172
|
-
return (_jsx("div", Object.assign({ ref: ref, style: style, className: classNames('ndl-ai-response
|
|
196
|
+
return (_jsx("div", Object.assign({ ref: ref, style: style, className: classNames('ndl-ai-response', className) }, restProps, htmlAttributes, { children: _jsx(Streamdown, { isAnimating: isAnimating, parseIncompleteMarkdown: true, components: components, children: children }) })));
|
|
173
197
|
}, (prevProps, nextProps) => prevProps.children === nextProps.children);
|
|
174
198
|
Response.displayName = 'Response';
|
|
175
199
|
export { Response };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Response.js","sourceRoot":"","sources":["../../../../src/ai/response/Response.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9D,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAGxC,OAAO,EAAqB,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC/E,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAS9C;;;;;GAKG;AACH,MAAM,QAAQ,GAAG,IAAI,CACnB,CAAC,EAQmC,EAAE,EAAE;QARvC,EACC,SAAS,EACT,QAAQ,EACR,WAAW,GAAG,KAAK,EACnB,GAAG,EACH,KAAK,EACL,cAAc,OAEoB,EAD/B,SAAS,cAPb,0EAQA,CADa;IAEZ,sFAAsF;IACtF,2DAA2D;IAC3D,MAAM,WAAW,GAAG,MAAM,CAAC,QAAQ,CAAC,CAAC;IACrC,WAAW,CAAC,OAAO,GAAG,QAAQ,CAAC;IAE/B,MAAM,UAAU,GACd,OAAO,CACL,GAAG,EAAE,CAAC,CAAC;QACL,EAAE,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACzC,2BAAI,SAAS,EAAE,SAAS,IAAM,KAAK,cAChC,QAAQ,IACN,CACN,CAAA;SAAA;QACD,EAAE,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACzC,2BAAI,SAAS,EAAE,UAAU,CAAC,SAAS,CAAC,IAAM,KAAK,cAC5C,QAAQ,IACN,CACN,CAAA;SAAA;QACD,EAAE,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACzC,2BAAI,SAAS,EAAE,SAAS,IAAM,KAAK,cAChC,QAAQ,IACN,CACN,CAAA;SAAA;QACD,EAAE,EAAE,CAAC,EAAuB,EAAE,EAAE;gBAA3B,EAAE,SAAS,OAAY,EAAP,KAAK,cAArB,aAAuB,CAAF;YAAO,OAAA,CAC/B,2BAAI,SAAS,EAAE,UAAU,CAAC,SAAS,CAAC,IAAM,KAAK,EAAI,CACpD,CAAA;SAAA;QACD,MAAM,EAAE,CAAC,EAAwC,EAAE,EAAE;gBAA5C,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,OAAY,EAAP,KAAK,cAAtC,kCAAwC,CAAF;YAAO,OAAA,CACpD,KAAC,UAAU,kBACT,EAAE,EAAC,QAAQ,EACX,OAAO,EAAC,aAAa,EACrB,SAAS,EAAE,SAAS,EACpB,KAAK,kCAAO,KAAK,KAAE,UAAU,EAAE,MAAM,OACjC,KAAK,cAER,QAAQ,IACE,CACd,CAAA;SAAA;QACD,EAAE,EAAE,CAAC,EAAwC,EAAE,EAAE;gBAA5C,EAAE,QAAQ,EAAE,SAAS,EAAE,KAAK,OAAY,EAAP,KAAK,cAAtC,kCAAwC,CAAF;YAAO,OAAA,CAChD,KAAC,UAAU,kBACT,EAAE,EAAC,IAAI,EACP,OAAO,EAAC,aAAa,EACrB,SAAS,EAAE,SAAS,EACpB,KAAK,kCAAO,KAAK,KAAE,SAAS,EAAE,QAAQ,OAClC,KAAK,cAER,QAAQ,IACE,CACd,CAAA;SAAA;QACD,CAAC,EAAE,CAAC,EAAuC,EAAE,EAAE;gBAA3C,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,OAAY,EAAP,KAAK,cAArC,iCAAuC,CAAF;YAAO,OAAA,CAC9C,KAAC,QAAQ,IACP,IAAI,EAAC,oBAAoB,EACzB,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,IAAI,EACV,cAAc,EAAE,KAAK,YAEpB,QAAQ,GACA,CACZ,CAAA;SAAA;QACD,EAAE,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACzC,KAAC,UAAU,IACT,EAAE,EAAC,IAAI,EACP,OAAO,EAAC,SAAS,EACjB,SAAS,EAAE,SAAS,EACpB,cAAc,oBAAO,KAAK,aAEzB,QAAQ,GACE,CACd,CAAA;SAAA;QACD,EAAE,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACzC,KAAC,UAAU,IACT,EAAE,EAAC,IAAI,EACP,OAAO,EAAC,SAAS,EACjB,SAAS,EAAE,SAAS,EACpB,cAAc,oBAAO,KAAK,aAEzB,QAAQ,GACE,CACd,CAAA;SAAA;QACD,EAAE,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACzC,KAAC,UAAU,IACT,EAAE,EAAC,IAAI,EACP,OAAO,EAAC,SAAS,EACjB,SAAS,EAAE,SAAS,EACpB,cAAc,oBAAO,KAAK,aAEzB,QAAQ,GACE,CACd,CAAA;SAAA;QACD,EAAE,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACzC,KAAC,UAAU,IACT,EAAE,EAAC,IAAI,EACP,OAAO,EAAC,SAAS,EACjB,SAAS,EAAE,SAAS,EACpB,cAAc,oBAAO,KAAK,aAEzB,QAAQ,GACE,CACd,CAAA;SAAA;QACD,EAAE,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACzC,KAAC,UAAU,IACT,EAAE,EAAC,IAAI,EACP,OAAO,EAAC,SAAS,EACjB,SAAS,EAAE,SAAS,EACpB,cAAc,oBAAO,KAAK,aAEzB,QAAQ,GACE,CACd,CAAA;SAAA;QACD,EAAE,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACzC,KAAC,UAAU,IACT,EAAE,EAAC,IAAI,EACP,OAAO,EAAC,kBAAkB,EAC1B,SAAS,EAAE,SAAS,EACpB,cAAc,oBAAO,KAAK,aAEzB,QAAQ,GACE,CACd,CAAA;SAAA;QACD,KAAK,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CAC5C,cAAK,SAAS,EAAC,sBAAsB,YACnC,8BACE,SAAS,EAAE,UAAU,CACnB,6CAA6C,EAC7C,SAAS,CACV,IACG,KAAK,cAER,QAAQ,IACH,GACJ,CACP,CAAA;SAAA;QACD,KAAK,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CAC5C,8BAAO,SAAS,EAAE,UAAU,CAAC,aAAa,EAAE,SAAS,CAAC,IAAM,KAAK,cAC9D,QAAQ,IACH,CACT,CAAA;SAAA;QACD,KAAK,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CAC5C,8BACE,SAAS,EAAE,UAAU,CAAC,wBAAwB,EAAE,SAAS,CAAC,IACtD,KAAK,cAER,QAAQ,IACH,CACT,CAAA;SAAA;QACD,EAAE,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACzC,2BACE,SAAS,EAAE,UAAU,CAAC,wBAAwB,EAAE,SAAS,CAAC,IACtD,KAAK,cAER,QAAQ,IACN,CACN,CAAA;SAAA;QACD,EAAE,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACzC,2BACE,SAAS,EAAE,UAAU,CACnB,2CAA2C,EAC3C,SAAS,CACV,IACG,KAAK,cAER,QAAQ,IACN,CACN,CAAA;SAAA;QACD,EAAE,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACzC,2BACE,SAAS,EAAE,UAAU,CAAC,mBAAmB,EAAE,SAAS,CAAC,IACjD,KAAK,cAER,QAAQ,IACN,CACN,CAAA;SAAA;QACD,UAAU,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACjD,mCAAY,SAAS,EAAE,UAAU,CAAC,SAAS,CAAC,IAAM,KAAK,cACpD,QAAQ,IACE,CACd,CAAA;SAAA;QACD,IAAI,EAAE,CAAC,EAMN,EAAE,EAAE;;gBANE,EACL,IAAI,EACJ,SAAS,EACT,GAAG,EACH,QAAQ,EAAE,YAAY,OAEvB,EADI,KAAK,cALH,wCAMN,CADS;YAER,MAAM,QAAQ,GACZ,CAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,QAAQ,0CAAE,KAAK,CAAC,IAAI,OAAK,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,QAAQ,0CAAE,GAAG,CAAC,IAAI,CAAA,CAAC;YAC1D,IAAI,QAAQ,GAA0B,YAAY,CAAC;YACnD,IAAI,OAAO,CAAA,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,UAAU,0CAAE,SAAS,CAAA,KAAK,QAAQ,EAAE,CAAC;gBACpD,MAAM,WAAW,GAAG,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,OAAO,CACnD,WAAW,EACX,EAAE,CACH,CAAC;gBACF,QAAQ,GAAI,SAA+B,CAAC,QAAQ,CAAC,WAAW,CAAC;oBAC/D,CAAC,CAAE,WAA4B;oBAC/B,CAAC,CAAC,MAAM,CAAC;YACb,CAAC;YACD,IAAI,QAAQ,EAAE,CAAC;gBACb,OAAO,CACL,KAAC,IAAI,IACH,UAAU,EAAE,KAAK,EACjB,SAAS,EAAE,SAAS,EACpB,cAAc,EAAE,KAAK,YAEpB,YAAY,GACR,CACR,CAAC;YACJ,CAAC;YACD,IAAI,OAAO,YAAY,KAAK,QAAQ,EAAE,CAAC;gBACrC,oDAAoD;gBACpD,gFAAgF;gBAChF,MAAM,YAAY,GAAG,WAAW,CAAC,OAAO,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;gBACvD,MAAM,UAAU,GAAG,YAAY,CAAC,CAAC,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;gBAC1D,MAAM,gBAAgB,GAAG,UAAU,GAAG,CAAC,KAAK,CAAC,CAAC;gBAE9C,8EAA8E;gBAC9E,MAAM,kBAAkB,GAAG,gBAAgB,CAAC;gBAC5C,OAAO,CACL,KAAC,WAAW,IAEV,IAAI,EAAE,YAAY,EAClB,SAAS,EAAE,kBAAkB,EAC7B,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,SAAS,EACpB,cAAc,oBACT,KAAK,KANL,GAAG,CAQR,CACH,CAAC;YACJ,CAAC;iBAAM,CAAC;gBACN,OAAO,eAAM,SAAS,EAAE,SAAS,YAAG,YAAY,GAAQ,CAAC;YAC3D,CAAC;QACH,CAAC;QACD,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE;YAC/B,OAAO,cAAK,SAAS,EAAE,UAAU,CAAC,SAAS,CAAC,YAAG,QAAQ,GAAO,CAAC;QACjE,CAAC;QACD,CAAC,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,QAAQ,EAAE,SAAS,OAAY,EAAP,KAAK,cAA/B,yBAAiC,CAAF;YAAO,OAAA,CACxC,KAAC,UAAU,kBACT,EAAE,EAAC,GAAG,EACN,OAAO,EAAC,aAAa,EACrB,SAAS,EAAE,UAAU,CAAC,SAAS,CAAC,IAC5B,KAAK,cAER,QAAQ,IACE,CACd,CAAA;SAAA;QACD,GAAG,EAAE,CAAC,EAAiC,EAAE,EAAE;gBAArC,EAAE,SAAS,EAAE,GAAG,EAAE,GAAG,OAAY,EAAP,KAAK,cAA/B,2BAAiC,CAAF;YAAO,OAAA,CAC1C,4BACE,SAAS,EAAE,UAAU,CAAC,SAAS,CAAC,EAChC,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,GAAG,IACJ,KAAK,EACT,CACH,CAAA;SAAA;KACF,CAAC,EACF,EAAE,CACH,CAAC;IAEJ,OAAO,CACL,4BACE,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,UAAU,CACnB,wEAAwE,EACxE,SAAS,CACV,IACG,SAAS,EACT,cAAc,cAElB,KAAC,UAAU,IACT,WAAW,EAAE,WAAW,EACxB,uBAAuB,EAAE,IAAI,EAC7B,UAAU,EAAE,UAAU,YAErB,QAAQ,GACE,IACT,CACP,CAAC;AACJ,CAAC,EACD,CAAC,SAAS,EAAE,SAAS,EAAE,EAAE,CAAC,SAAS,CAAC,QAAQ,KAAK,SAAS,CAAC,QAAQ,CACpE,CAAC;AAEF,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAC;AAElC,OAAO,EAAE,QAAQ,EAAE,CAAC","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport { Code, TextLink, Typography } from '@neo4j-ndl/react';\nimport classNames from 'classnames';\nimport { memo, useMemo, useRef } from 'react';\nimport { Streamdown } from 'streamdown';\n\nimport { type CommonProps } from '../../_common/types';\nimport { type LanguageProp, Languages } from '../../code-block/code-languages';\nimport { CodePreview } from '../code-preview';\n\ntype ResponseProps = {\n /** The response from the AI */\n children: string;\n /** Whether the response is animating */\n isAnimating?: React.ComponentProps<typeof Streamdown>['isAnimating'];\n};\n\n/**\n * The component is used to display the response from an LLM.\n * It handles markdown rendering and streaming.\n *\n * @alpha - Changes to this component may be breaking.\n */\nconst Response = memo(\n ({\n className,\n children,\n isAnimating = false,\n ref,\n style,\n htmlAttributes,\n ...restProps\n }: CommonProps<'div', ResponseProps>) => {\n // Use a ref to store the current markdown content so we can check for unclosed fences\n // without recreating the components object on every render\n const childrenRef = useRef(children);\n childrenRef.current = children;\n\n const components: React.ComponentProps<typeof Streamdown>['components'] =\n useMemo(\n () => ({\n ol: ({ children, className, ...props }) => (\n <ol className={className} {...props}>\n {children}\n </ol>\n ),\n ul: ({ children, className, ...props }) => (\n <ul className={classNames(className)} {...props}>\n {children}\n </ul>\n ),\n li: ({ children, className, ...props }) => (\n <li className={className} {...props}>\n {children}\n </li>\n ),\n hr: ({ className, ...props }) => (\n <hr className={classNames(className)} {...props} />\n ),\n strong: ({ children, className, style, ...props }) => (\n <Typography\n as=\"strong\"\n variant=\"body-medium\"\n className={className}\n style={{ ...style, fontWeight: 'bold' }}\n {...props}\n >\n {children}\n </Typography>\n ),\n em: ({ children, className, style, ...props }) => (\n <Typography\n as=\"em\"\n variant=\"body-medium\"\n className={className}\n style={{ ...style, fontStyle: 'italic' }}\n {...props}\n >\n {children}\n </Typography>\n ),\n a: ({ children, className, href, ...props }) => (\n <TextLink\n type=\"internal-underline\"\n className={className}\n href={href}\n htmlAttributes={props}\n >\n {children}\n </TextLink>\n ),\n h1: ({ children, className, ...props }) => (\n <Typography\n as=\"h1\"\n variant=\"display\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n h2: ({ children, className, ...props }) => (\n <Typography\n as=\"h2\"\n variant=\"title-1\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n h3: ({ children, className, ...props }) => (\n <Typography\n as=\"h3\"\n variant=\"title-2\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n h4: ({ children, className, ...props }) => (\n <Typography\n as=\"h4\"\n variant=\"title-3\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n h5: ({ children, className, ...props }) => (\n <Typography\n as=\"h5\"\n variant=\"title-4\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n h6: ({ children, className, ...props }) => (\n <Typography\n as=\"h6\"\n variant=\"subheading-large\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n table: ({ children, className, ...props }) => (\n <div className=\"my-4 overflow-x-auto\">\n <table\n className={classNames(\n 'w-full border-collapse border border-border',\n className,\n )}\n {...props}\n >\n {children}\n </table>\n </div>\n ),\n thead: ({ children, className, ...props }) => (\n <thead className={classNames('bg-muted/50', className)} {...props}>\n {children}\n </thead>\n ),\n tbody: ({ children, className, ...props }) => (\n <tbody\n className={classNames('divide-y divide-border', className)}\n {...props}\n >\n {children}\n </tbody>\n ),\n tr: ({ children, className, ...props }) => (\n <tr\n className={classNames('border-border border-b', className)}\n {...props}\n >\n {children}\n </tr>\n ),\n th: ({ children, className, ...props }) => (\n <th\n className={classNames(\n 'px-4 py-2 text-left font-semibold text-sm',\n className,\n )}\n {...props}\n >\n {children}\n </th>\n ),\n td: ({ children, className, ...props }) => (\n <td\n className={classNames('px-4 py-2 text-sm', className)}\n {...props}\n >\n {children}\n </td>\n ),\n blockquote: ({ children, className, ...props }) => (\n <blockquote className={classNames(className)} {...props}>\n {children}\n </blockquote>\n ),\n code: ({\n node,\n className,\n key,\n children: codeChildren,\n ...props\n }) => {\n const isInline =\n node?.position?.start.line === node?.position?.end.line;\n let language: LanguageProp | 'text' = 'javascript';\n if (typeof node?.properties?.className === 'string') {\n const rawLanguage = node.properties.className.replace(\n 'language-',\n '',\n );\n language = (Languages as readonly string[]).includes(rawLanguage)\n ? (rawLanguage as LanguageProp)\n : 'text';\n }\n if (isInline) {\n return (\n <Code\n isRunnable={false}\n className={className}\n htmlAttributes={props}\n >\n {codeChildren}\n </Code>\n );\n }\n if (typeof codeChildren === 'string') {\n // Check if code fences are balanced in the markdown\n // If there are an odd number of fences, it means there's an unclosed code block\n const fenceMatches = childrenRef.current.match(/```/g);\n const fenceCount = fenceMatches ? fenceMatches.length : 0;\n const hasUnclosedFence = fenceCount % 2 !== 0;\n\n // Show loading state when there's an unclosed fence (code block is streaming)\n const isCodeBlockLoading = hasUnclosedFence;\n return (\n <CodePreview\n key={key}\n code={codeChildren}\n isLoading={isCodeBlockLoading}\n language={language}\n className={className}\n htmlAttributes={{\n ...props,\n }}\n />\n );\n } else {\n return <code className={className}>{codeChildren}</code>;\n }\n },\n pre: ({ className, children }) => {\n return <pre className={classNames(className)}>{children}</pre>;\n },\n p: ({ children, className, ...props }) => (\n <Typography\n as=\"p\"\n variant=\"body-medium\"\n className={classNames(className)}\n {...props}\n >\n {children}\n </Typography>\n ),\n img: ({ className, src, alt, ...props }) => (\n <img\n className={classNames(className)}\n src={src}\n alt={alt}\n {...props}\n />\n ),\n }),\n [],\n );\n\n return (\n <div\n ref={ref}\n style={style}\n className={classNames(\n 'ndl-ai-response size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0',\n className,\n )}\n {...restProps}\n {...htmlAttributes}\n >\n <Streamdown\n isAnimating={isAnimating}\n parseIncompleteMarkdown={true}\n components={components}\n >\n {children}\n </Streamdown>\n </div>\n );\n },\n (prevProps, nextProps) => prevProps.children === nextProps.children,\n);\n\nResponse.displayName = 'Response';\n\nexport { Response };\n"]}
|
|
1
|
+
{"version":3,"file":"Response.js","sourceRoot":"","sources":["../../../../src/ai/response/Response.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport { Code, TextLink, Typography } from '@neo4j-ndl/react';\nimport classNames from 'classnames';\nimport { memo, useMemo, useRef } from 'react';\nimport { Streamdown } from 'streamdown';\n\nimport { type CommonProps } from '../../_common/types';\nimport { type LanguageProp, Languages } from '../../code-block/code-languages';\nimport { CodePreview } from '../code-preview';\n\ntype ResponseProps = {\n /** The response from the AI */\n children: string;\n /** Whether the response is animating */\n isAnimating?: React.ComponentProps<typeof Streamdown>['isAnimating'];\n};\n\n/**\n * The component is used to display the response from an LLM.\n * It handles markdown rendering and streaming.\n *\n * @alpha - Changes to this component may be breaking.\n */\nconst Response = memo(\n ({\n className,\n children,\n isAnimating = false,\n ref,\n style,\n htmlAttributes,\n ...restProps\n }: CommonProps<'div', ResponseProps>) => {\n // Use a ref to store the current markdown content so we can check for unclosed fences\n // without recreating the components object on every render\n const childrenRef = useRef(children);\n childrenRef.current = children;\n\n const components: React.ComponentProps<typeof Streamdown>['components'] =\n useMemo(\n () => ({\n // oxlint-disable-next-line no-unused-vars\n ol: ({ node, children, className, ...props }) => (\n <ol className={className} {...props}>\n {children}\n </ol>\n ),\n // oxlint-disable-next-line no-unused-vars\n ul: ({ node, children, className, ...props }) => (\n <ul className={classNames(className)} {...props}>\n {children}\n </ul>\n ),\n // oxlint-disable-next-line no-unused-vars\n li: ({ node, children, className, ...props }) => (\n <li className={className} {...props}>\n {children}\n </li>\n ),\n // oxlint-disable-next-line no-unused-vars\n hr: ({ node, className, ...props }) => (\n <hr className={classNames(className)} {...props} />\n ),\n // oxlint-disable-next-line no-unused-vars\n strong: ({ node, children, className, style, ...props }) => (\n <Typography\n as=\"strong\"\n variant=\"body-medium\"\n className={className}\n style={{ ...style, fontWeight: 'bold' }}\n {...props}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n em: ({ node, children, className, style, ...props }) => (\n <Typography\n as=\"em\"\n variant=\"body-medium\"\n className={className}\n style={{ ...style, fontStyle: 'italic' }}\n {...props}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n a: ({ node, children, className, href, ...props }) => (\n <TextLink\n type=\"internal-underline\"\n className={className}\n href={href}\n htmlAttributes={props}\n >\n {children}\n </TextLink>\n ),\n // oxlint-disable-next-line no-unused-vars\n h1: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h1\"\n variant=\"display\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h2: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h2\"\n variant=\"title-1\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h3: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h3\"\n variant=\"title-2\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h4: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h4\"\n variant=\"title-3\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h5: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h5\"\n variant=\"title-4\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h6: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h6\"\n variant=\"label\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n table: ({ node, children, className, ...props }) => (\n <div className=\"ndl-ai-response-table-wrapper\">\n <table className={className} {...props}>\n {children}\n </table>\n </div>\n ),\n // oxlint-disable-next-line no-unused-vars\n thead: ({ node, children, className, ...props }) => (\n <thead className={className} {...props}>\n {children}\n </thead>\n ),\n // oxlint-disable-next-line no-unused-vars\n tbody: ({ node, children, className, ...props }) => (\n <tbody className={className} {...props}>\n {children}\n </tbody>\n ),\n // oxlint-disable-next-line no-unused-vars\n tr: ({ node, children, className, ...props }) => (\n <tr className={className} {...props}>\n {children}\n </tr>\n ),\n // oxlint-disable-next-line no-unused-vars\n th: ({ node, children, className, ...props }) => (\n <th className={className} {...props}>\n {children}\n </th>\n ),\n // oxlint-disable-next-line no-unused-vars\n td: ({ node, children, className, ...props }) => (\n <td className={className} {...props}>\n {children}\n </td>\n ),\n // oxlint-disable-next-line no-unused-vars\n blockquote: ({ node, children, className, ...props }) => (\n <blockquote className={classNames(className)} {...props}>\n {children}\n </blockquote>\n ),\n code: ({\n node,\n className,\n key,\n children: codeChildren,\n ...props\n }) => {\n const isInline =\n node?.position?.start.line === node?.position?.end.line;\n let language: LanguageProp | 'text' = 'javascript';\n if (typeof node?.properties?.className === 'string') {\n const rawLanguage = node.properties.className.replace(\n 'language-',\n '',\n );\n language = (Languages as readonly string[]).includes(rawLanguage)\n ? (rawLanguage as LanguageProp)\n : 'text';\n }\n if (isInline) {\n return (\n <Code\n isRunnable={false}\n className={className}\n htmlAttributes={props}\n >\n {codeChildren}\n </Code>\n );\n }\n if (typeof codeChildren === 'string') {\n // Check if code fences are balanced in the markdown\n // If there are an odd number of fences, it means there's an unclosed code block\n const fenceMatches = childrenRef.current.match(/```/g);\n const fenceCount = fenceMatches ? fenceMatches.length : 0;\n const hasUnclosedFence = fenceCount % 2 !== 0;\n\n // Show loading state when there's an unclosed fence (code block is streaming)\n const isCodeBlockLoading = hasUnclosedFence;\n return (\n <CodePreview\n key={key}\n code={codeChildren}\n isLoading={isCodeBlockLoading}\n language={language}\n className={className}\n htmlAttributes={{\n ...props,\n }}\n />\n );\n } else {\n return <code className={className}>{codeChildren}</code>;\n }\n },\n // oxlint-disable-next-line no-unused-vars\n pre: ({ node, className, children, ...props }) => {\n return (\n <pre className={className} {...props}>\n {children}\n </pre>\n );\n },\n // oxlint-disable-next-line no-unused-vars\n p: ({ node, children, className, ...props }) => (\n <Typography\n as=\"p\"\n variant=\"body-medium\"\n className={classNames(className)}\n {...props}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n img: ({ node, className, src, alt, ...props }) => (\n <img\n className={classNames(className)}\n src={src}\n alt={alt}\n {...props}\n />\n ),\n }),\n [],\n );\n\n return (\n <div\n ref={ref}\n style={style}\n className={classNames('ndl-ai-response', className)}\n {...restProps}\n {...htmlAttributes}\n >\n <Streamdown\n isAnimating={isAnimating}\n parseIncompleteMarkdown={true}\n components={components}\n >\n {children}\n </Streamdown>\n </div>\n );\n },\n (prevProps, nextProps) => prevProps.children === nextProps.children,\n);\n\nResponse.displayName = 'Response';\n\nexport { Response };\n"]}
|
|
@@ -152,7 +152,7 @@ export const Component = () => {
|
|
|
152
152
|
}, children: "Generate a report" })] }), _jsxs(Typography, { variant: "body-medium", children: ["You can also drag and drop files here, or", ' ', _jsx(TextLink, { as: "button", type: "internal-underline", children: "browse" }), ". Supports CVG, MOV, PDF"] })] }) })) : (_jsxs("div", { className: "n-flex n-flex-col n-gap-4 n-pb-4", children: [messages.map((msg, idx) => (_jsx("div", { className: `n-flex ${msg.role === 'user' ? 'n-justify-end' : 'n-justify-start'}`, children: msg.role === 'user' ? (_jsx("div", { className: "n-max-w-[85%]", children: _jsx(UserBubble, { avatarProps: {
|
|
153
153
|
name: 'NM',
|
|
154
154
|
type: 'letters',
|
|
155
|
-
}, children: msg.content }) })) : (_jsxs("div", { className: "n-w-full n-flex n-flex-col n-gap-2", children: [msg.thinkingTime !== undefined && (_jsx(Thinking, { isThinking: false, thinkingMs: msg.thinkingTime })), _jsxs("div", { className: "n-flex n-flex-col n-gap-2", children: [_jsx(Response, { children: msg.content }), msg.done === true && (_jsxs("div", { className: "n-flex n-flex-row n-gap-1.5", children: [_jsx(CleanIconButton, { size: "small", description: "Dislike", children: _jsx(HandThumbDownIconOutline, {}) }), _jsx(CleanIconButton, { size: "small", description: "Re-run", children: _jsx(ArrowPathIconOutline, {}) }), _jsx(CleanIconButton, { size: "small", description: "Copy", children: _jsx(Square2StackIconOutline, {}) })] }))] })] })) }, idx))), isThinking && _jsx(Thinking, { isThinking: true }), _jsx("div", { ref: messagesEndRef })] })) }), _jsx("div", { className: "n-
|
|
155
|
+
}, children: msg.content }) })) : (_jsxs("div", { className: "n-w-full n-flex n-flex-col n-gap-2", children: [msg.thinkingTime !== undefined && (_jsx(Thinking, { isThinking: false, thinkingMs: msg.thinkingTime })), _jsxs("div", { className: "n-flex n-flex-col n-gap-2", children: [_jsx(Response, { children: msg.content }), msg.done === true && (_jsxs("div", { className: "n-flex n-flex-row n-gap-1.5", children: [_jsx(CleanIconButton, { size: "small", description: "Dislike", children: _jsx(HandThumbDownIconOutline, {}) }), _jsx(CleanIconButton, { size: "small", description: "Re-run", children: _jsx(ArrowPathIconOutline, {}) }), _jsx(CleanIconButton, { size: "small", description: "Copy", children: _jsx(Square2StackIconOutline, {}) })] }))] })] })) }, idx))), isThinking && _jsx(Thinking, { isThinking: true }), _jsx("div", { ref: messagesEndRef })] })) }), _jsx("div", { className: "n-px-4 n-pt-4 n-pb-1 n-mt-auto", children: _jsx(Prompt, { value: prompt, onChange: (e) => setPrompt(e.target.value), onSubmitPrompt: () => handleSend(), isRunningPrompt: isThinking || isStreaming, isSubmitDisabled: prompt.length === 0 && !(isThinking || isStreaming), bottomContent: _jsx(CleanIconButton, { description: "Add files", size: "small", children: _jsx(PlusIconOutline, {}) }) }) })] }) }));
|
|
156
156
|
};
|
|
157
157
|
export default Component;
|
|
158
158
|
//# sourceMappingURL=response-full-example.story.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"response-full-example.story.js","sourceRoot":"","sources":["../../../../../src/ai/response/stories/response-full-example.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { CleanIconButton, TextLink, Typography } from '@neo4j-ndl/react';\nimport {\n Prompt,\n Response,\n Suggestion,\n Thinking,\n UserBubble,\n} from '@neo4j-ndl/react/ai';\nimport {\n ArrowPathIconOutline,\n Cog6ToothIconOutline,\n HandThumbDownIconOutline,\n PlusIconOutline,\n Square2StackIconOutline,\n XMarkIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { useEffect, useRef, useState } from 'react';\n\nconst FAKE_RESPONSES = [\n `Here is a simple response with some **bold text** and *italics*.`,\n `Here is a list of items:\n- Item 1\n- Item 2\n- Item 3`,\n `Here is a code block example:\n\n\\`\\`\\`typescript\nconst greeting = \"Hello World\";\nconsole.log(greeting);\n\\`\\`\\`\n`,\n `# Heading 1\n## Heading 2\n### Heading 3\n\nSome text under headings.`,\n `You can also use tables:\n\n| Header 1 | Header 2 |\n|Data 1|Data 2|\n|Data 3|Data 4|\n`,\n];\n\nexport const Component = () => {\n const [messages, setMessages] = useState<\n {\n role: 'user' | 'assistant';\n content: string;\n thinkingTime?: number;\n done?: boolean;\n }[]\n >([]);\n const [prompt, setPrompt] = useState('');\n const [isThinking, setIsThinking] = useState(false);\n const [isStreaming, setIsStreaming] = useState(false);\n const [responseIndex, setResponseIndex] = useState(0);\n const messagesEndRef = useRef<HTMLDivElement>(null);\n const timeoutRef = useRef<NodeJS.Timeout | null>(null);\n const intervalRef = useRef<NodeJS.Timeout | null>(null);\n\n const scrollToBottom = () => {\n messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });\n };\n\n useEffect(() => {\n scrollToBottom();\n }, [messages, isThinking]);\n\n const handleSend = (overridePrompt?: string) => {\n // Handle Stop\n if (isThinking || isStreaming) {\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n if (intervalRef.current) {\n clearInterval(intervalRef.current);\n }\n setIsThinking(false);\n setIsStreaming(false);\n\n // Mark the last message as done if stopped\n setMessages((prev) => {\n const newMessages = [...prev];\n const lastMessage = newMessages[newMessages.length - 1];\n if (lastMessage?.role === 'assistant') {\n lastMessage.done = true;\n }\n return newMessages;\n });\n return;\n }\n\n const textToSend = overridePrompt || prompt;\n\n if (!textToSend.trim()) {\n return;\n }\n\n setMessages((prev) => [...prev, { content: textToSend, role: 'user' }]);\n setPrompt('');\n setIsThinking(true);\n const startTime = Date.now();\n\n // Simulate network delay (thinking time)\n timeoutRef.current = setTimeout(() => {\n const endTime = Date.now();\n const thinkingTime = endTime - startTime;\n setIsThinking(false);\n setIsStreaming(true);\n\n const responseText = FAKE_RESPONSES[responseIndex];\n setResponseIndex((prev) => (prev + 1) % FAKE_RESPONSES.length);\n\n let currentText = '';\n setMessages((prev) => [\n ...prev,\n { content: '', done: false, role: 'assistant', thinkingTime },\n ]);\n\n // Simulate streaming\n intervalRef.current = setInterval(() => {\n if (currentText.length < responseText.length) {\n // Add a few characters at a time to simulate chunks\n // Ensure we don't split newlines incorrectly if that's an issue,\n // but simple slicing should be fine as long as the source has \\n.\n const chunk = responseText.slice(\n currentText.length,\n currentText.length + 2,\n );\n currentText += chunk;\n\n setMessages((prev) => {\n const newMessages = [...prev];\n const lastMessage = newMessages[newMessages.length - 1];\n if (lastMessage.role === 'assistant') {\n lastMessage.content = currentText;\n }\n return newMessages;\n });\n } else {\n if (intervalRef.current) {\n clearInterval(intervalRef.current);\n }\n setIsStreaming(false);\n setMessages((prev) => {\n const newMessages = [...prev];\n const lastMessage = newMessages[newMessages.length - 1];\n if (lastMessage.role === 'assistant') {\n lastMessage.done = true;\n }\n return newMessages;\n });\n }\n }, 50);\n }, 2000);\n };\n\n return (\n <section className=\"n-h-screen\">\n <div className=\"n-w-[440px] n-h-full n-flex n-flex-col n-bg-neutral-bg-weak\">\n <div className=\"n-flex n-flex-row n-border-b n-border-neutral-border-weak n-p-3\">\n <div className=\"n-ml-auto\">\n <CleanIconButton description=\"settings\" tooltipProps={{}}>\n <Cog6ToothIconOutline />\n </CleanIconButton>\n <CleanIconButton description=\"close\">\n <XMarkIconOutline />\n </CleanIconButton>\n </div>\n </div>\n <div className=\"n-p-4 n-flex n-flex-col n-grow n-overflow-y-auto\">\n {messages.length === 0 ? (\n <div className=\"n-flex n-flex-col \">\n <div className=\"n-flex n-flex-col n-gap-12\">\n <Typography variant=\"display\">\n Hi [User], how can I help you today?\n </Typography>\n <div className=\"n-flex n-flex-col n-gap-4\">\n <Typography variant=\"body-medium\">Suggestions</Typography>\n <Suggestion\n isPrimary\n onClick={() => {\n handleSend('I want to import data');\n }}\n >\n I want to import data\n </Suggestion>\n <Suggestion\n onClick={() => {\n handleSend('Create an AI agent');\n }}\n >\n Create an AI agent\n </Suggestion>\n <Suggestion\n onClick={() => {\n handleSend('Invite project members');\n }}\n >\n Invite project members\n </Suggestion>\n <Suggestion\n onClick={() => {\n handleSend('Generate a report');\n }}\n >\n Generate a report\n </Suggestion>\n </div>\n <Typography variant=\"body-medium\">\n You can also drag and drop files here, or{' '}\n <TextLink as=\"button\" type=\"internal-underline\">\n browse\n </TextLink>\n . Supports CVG, MOV, PDF\n </Typography>\n </div>\n </div>\n ) : (\n <div className=\"n-flex n-flex-col n-gap-4 n-pb-4\">\n {messages.map((msg, idx) => (\n <div\n key={idx}\n className={`n-flex ${\n msg.role === 'user' ? 'n-justify-end' : 'n-justify-start'\n }`}\n >\n {msg.role === 'user' ? (\n <div className=\"n-max-w-[85%]\">\n <UserBubble\n avatarProps={{\n name: 'NM',\n type: 'letters',\n }}\n >\n {msg.content}\n </UserBubble>\n </div>\n ) : (\n <div className=\"n-w-full n-flex n-flex-col n-gap-2\">\n {msg.thinkingTime !== undefined && (\n <Thinking\n isThinking={false}\n thinkingMs={msg.thinkingTime}\n />\n )}\n <div className=\"n-flex n-flex-col n-gap-2\">\n <Response>{msg.content}</Response>\n\n {msg.done === true && (\n <div className=\"n-flex n-flex-row n-gap-1.5\">\n <CleanIconButton size=\"small\" description=\"Dislike\">\n <HandThumbDownIconOutline />\n </CleanIconButton>\n <CleanIconButton size=\"small\" description=\"Re-run\">\n <ArrowPathIconOutline />\n </CleanIconButton>\n <CleanIconButton size=\"small\" description=\"Copy\">\n <Square2StackIconOutline />\n </CleanIconButton>\n </div>\n )}\n </div>\n </div>\n )}\n </div>\n ))}\n {isThinking && <Thinking isThinking={true} />}\n <div ref={messagesEndRef} />\n </div>\n )}\n </div>\n <div className=\"n-p-4 n-mt-auto\">\n <Prompt\n value={prompt}\n onChange={(e) => setPrompt(e.target.value)}\n onSubmitPrompt={() => handleSend()}\n isRunningPrompt={isThinking || isStreaming}\n isSubmitDisabled={\n prompt.length === 0 && !(isThinking || isStreaming)\n }\n bottomContent={\n <CleanIconButton description=\"Add files\" size=\"small\">\n <PlusIconOutline />\n </CleanIconButton>\n }\n />\n </div>\n </div>\n </section>\n );\n};\n\nexport default Component;\n"]}
|
|
1
|
+
{"version":3,"file":"response-full-example.story.js","sourceRoot":"","sources":["../../../../../src/ai/response/stories/response-full-example.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { CleanIconButton, TextLink, Typography } from '@neo4j-ndl/react';\nimport {\n Prompt,\n Response,\n Suggestion,\n Thinking,\n UserBubble,\n} from '@neo4j-ndl/react/ai';\nimport {\n ArrowPathIconOutline,\n Cog6ToothIconOutline,\n HandThumbDownIconOutline,\n PlusIconOutline,\n Square2StackIconOutline,\n XMarkIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { useEffect, useRef, useState } from 'react';\n\nconst FAKE_RESPONSES = [\n `Here is a simple response with some **bold text** and *italics*.`,\n `Here is a list of items:\n- Item 1\n- Item 2\n- Item 3`,\n `Here is a code block example:\n\n\\`\\`\\`typescript\nconst greeting = \"Hello World\";\nconsole.log(greeting);\n\\`\\`\\`\n`,\n `# Heading 1\n## Heading 2\n### Heading 3\n\nSome text under headings.`,\n `You can also use tables:\n\n| Header 1 | Header 2 |\n|Data 1|Data 2|\n|Data 3|Data 4|\n`,\n];\n\nexport const Component = () => {\n const [messages, setMessages] = useState<\n {\n role: 'user' | 'assistant';\n content: string;\n thinkingTime?: number;\n done?: boolean;\n }[]\n >([]);\n const [prompt, setPrompt] = useState('');\n const [isThinking, setIsThinking] = useState(false);\n const [isStreaming, setIsStreaming] = useState(false);\n const [responseIndex, setResponseIndex] = useState(0);\n const messagesEndRef = useRef<HTMLDivElement>(null);\n const timeoutRef = useRef<NodeJS.Timeout | null>(null);\n const intervalRef = useRef<NodeJS.Timeout | null>(null);\n\n const scrollToBottom = () => {\n messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });\n };\n\n useEffect(() => {\n scrollToBottom();\n }, [messages, isThinking]);\n\n const handleSend = (overridePrompt?: string) => {\n // Handle Stop\n if (isThinking || isStreaming) {\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n if (intervalRef.current) {\n clearInterval(intervalRef.current);\n }\n setIsThinking(false);\n setIsStreaming(false);\n\n // Mark the last message as done if stopped\n setMessages((prev) => {\n const newMessages = [...prev];\n const lastMessage = newMessages[newMessages.length - 1];\n if (lastMessage?.role === 'assistant') {\n lastMessage.done = true;\n }\n return newMessages;\n });\n return;\n }\n\n const textToSend = overridePrompt || prompt;\n\n if (!textToSend.trim()) {\n return;\n }\n\n setMessages((prev) => [...prev, { content: textToSend, role: 'user' }]);\n setPrompt('');\n setIsThinking(true);\n const startTime = Date.now();\n\n // Simulate network delay (thinking time)\n timeoutRef.current = setTimeout(() => {\n const endTime = Date.now();\n const thinkingTime = endTime - startTime;\n setIsThinking(false);\n setIsStreaming(true);\n\n const responseText = FAKE_RESPONSES[responseIndex];\n setResponseIndex((prev) => (prev + 1) % FAKE_RESPONSES.length);\n\n let currentText = '';\n setMessages((prev) => [\n ...prev,\n { content: '', done: false, role: 'assistant', thinkingTime },\n ]);\n\n // Simulate streaming\n intervalRef.current = setInterval(() => {\n if (currentText.length < responseText.length) {\n // Add a few characters at a time to simulate chunks\n // Ensure we don't split newlines incorrectly if that's an issue,\n // but simple slicing should be fine as long as the source has \\n.\n const chunk = responseText.slice(\n currentText.length,\n currentText.length + 2,\n );\n currentText += chunk;\n\n setMessages((prev) => {\n const newMessages = [...prev];\n const lastMessage = newMessages[newMessages.length - 1];\n if (lastMessage.role === 'assistant') {\n lastMessage.content = currentText;\n }\n return newMessages;\n });\n } else {\n if (intervalRef.current) {\n clearInterval(intervalRef.current);\n }\n setIsStreaming(false);\n setMessages((prev) => {\n const newMessages = [...prev];\n const lastMessage = newMessages[newMessages.length - 1];\n if (lastMessage.role === 'assistant') {\n lastMessage.done = true;\n }\n return newMessages;\n });\n }\n }, 50);\n }, 2000);\n };\n\n return (\n <section className=\"n-h-screen\">\n <div className=\"n-w-[440px] n-h-full n-flex n-flex-col n-bg-neutral-bg-weak\">\n <div className=\"n-flex n-flex-row n-border-b n-border-neutral-border-weak n-p-3\">\n <div className=\"n-ml-auto\">\n <CleanIconButton description=\"settings\" tooltipProps={{}}>\n <Cog6ToothIconOutline />\n </CleanIconButton>\n <CleanIconButton description=\"close\">\n <XMarkIconOutline />\n </CleanIconButton>\n </div>\n </div>\n <div className=\"n-p-4 n-flex n-flex-col n-grow n-overflow-y-auto\">\n {messages.length === 0 ? (\n <div className=\"n-flex n-flex-col \">\n <div className=\"n-flex n-flex-col n-gap-12\">\n <Typography variant=\"display\">\n Hi [User], how can I help you today?\n </Typography>\n <div className=\"n-flex n-flex-col n-gap-4\">\n <Typography variant=\"body-medium\">Suggestions</Typography>\n <Suggestion\n isPrimary\n onClick={() => {\n handleSend('I want to import data');\n }}\n >\n I want to import data\n </Suggestion>\n <Suggestion\n onClick={() => {\n handleSend('Create an AI agent');\n }}\n >\n Create an AI agent\n </Suggestion>\n <Suggestion\n onClick={() => {\n handleSend('Invite project members');\n }}\n >\n Invite project members\n </Suggestion>\n <Suggestion\n onClick={() => {\n handleSend('Generate a report');\n }}\n >\n Generate a report\n </Suggestion>\n </div>\n <Typography variant=\"body-medium\">\n You can also drag and drop files here, or{' '}\n <TextLink as=\"button\" type=\"internal-underline\">\n browse\n </TextLink>\n . Supports CVG, MOV, PDF\n </Typography>\n </div>\n </div>\n ) : (\n <div className=\"n-flex n-flex-col n-gap-4 n-pb-4\">\n {messages.map((msg, idx) => (\n <div\n key={idx}\n className={`n-flex ${\n msg.role === 'user' ? 'n-justify-end' : 'n-justify-start'\n }`}\n >\n {msg.role === 'user' ? (\n <div className=\"n-max-w-[85%]\">\n <UserBubble\n avatarProps={{\n name: 'NM',\n type: 'letters',\n }}\n >\n {msg.content}\n </UserBubble>\n </div>\n ) : (\n <div className=\"n-w-full n-flex n-flex-col n-gap-2\">\n {msg.thinkingTime !== undefined && (\n <Thinking\n isThinking={false}\n thinkingMs={msg.thinkingTime}\n />\n )}\n <div className=\"n-flex n-flex-col n-gap-2\">\n <Response>{msg.content}</Response>\n\n {msg.done === true && (\n <div className=\"n-flex n-flex-row n-gap-1.5\">\n <CleanIconButton size=\"small\" description=\"Dislike\">\n <HandThumbDownIconOutline />\n </CleanIconButton>\n <CleanIconButton size=\"small\" description=\"Re-run\">\n <ArrowPathIconOutline />\n </CleanIconButton>\n <CleanIconButton size=\"small\" description=\"Copy\">\n <Square2StackIconOutline />\n </CleanIconButton>\n </div>\n )}\n </div>\n </div>\n )}\n </div>\n ))}\n {isThinking && <Thinking isThinking={true} />}\n <div ref={messagesEndRef} />\n </div>\n )}\n </div>\n <div className=\"n-px-4 n-pt-4 n-pb-1 n-mt-auto\">\n <Prompt\n value={prompt}\n onChange={(e) => setPrompt(e.target.value)}\n onSubmitPrompt={() => handleSend()}\n isRunningPrompt={isThinking || isStreaming}\n isSubmitDisabled={\n prompt.length === 0 && !(isThinking || isStreaming)\n }\n bottomContent={\n <CleanIconButton description=\"Add files\" size=\"small\">\n <PlusIconOutline />\n </CleanIconButton>\n }\n />\n </div>\n </div>\n </section>\n );\n};\n\nexport default Component;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Response.d.ts","sourceRoot":"","sources":["../../../../src/ai/response/Response.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAKH,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAExC,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAIvD,KAAK,aAAa,GAAG;IACnB,+BAA+B;IAC/B,QAAQ,EAAE,MAAM,CAAC;IACjB,wCAAwC;IACxC,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,CAAC,aAAa,CAAC,CAAC;CACtE,CAAC;AAEF;;;;;GAKG;AACH,QAAA,MAAM,QAAQ,uHAST,WAAW,CAAC,KAAK,EAAE,aAAa,CAAC,
|
|
1
|
+
{"version":3,"file":"Response.d.ts","sourceRoot":"","sources":["../../../../src/ai/response/Response.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAKH,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAExC,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAIvD,KAAK,aAAa,GAAG;IACnB,+BAA+B;IAC/B,QAAQ,EAAE,MAAM,CAAC;IACjB,wCAAwC;IACxC,WAAW,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,CAAC,aAAa,CAAC,CAAC;CACtE,CAAC;AAEF;;;;;GAKG;AACH,QAAA,MAAM,QAAQ,uHAST,WAAW,CAAC,KAAK,EAAE,aAAa,CAAC,6CA0RrC,CAAC;AAIF,OAAO,EAAE,QAAQ,EAAE,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@neo4j-ndl/react",
|
|
3
|
-
"version": "4.2.
|
|
3
|
+
"version": "4.2.11",
|
|
4
4
|
"sideEffects": false,
|
|
5
5
|
"description": "React implementation of Neo4j Design System",
|
|
6
6
|
"keywords": [
|
|
@@ -86,7 +86,7 @@
|
|
|
86
86
|
"@tanstack/react-table": "8.21.3",
|
|
87
87
|
"react": ">=19.0.0",
|
|
88
88
|
"react-dom": ">=19.0.0",
|
|
89
|
-
"@neo4j-ndl/base": "^4.2.
|
|
89
|
+
"@neo4j-ndl/base": "^4.2.3"
|
|
90
90
|
},
|
|
91
91
|
"dependencies": {
|
|
92
92
|
"@dnd-kit/core": "6.3.1",
|