reachat 2.0.2 → 2.1.0-alpha.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. package/dist/AppBar/AppBar.d.ts +1 -1
  2. package/dist/{CSVFileRenderer-fklKR5lg.js → CSVFileRenderer-BJ6YmtEo.js} +15 -14
  3. package/dist/CSVFileRenderer-BJ6YmtEo.js.map +1 -0
  4. package/dist/Chat.d.ts +3 -3
  5. package/dist/ChatBubble/ChatBubble.d.ts +1 -1
  6. package/dist/ChatContext.d.ts +2 -2
  7. package/dist/ChatInput/ChatInput.d.ts +24 -0
  8. package/dist/ChatInput/FileInput.d.ts +1 -1
  9. package/dist/{DefaultFileRenderer-BQ9xzbrH.js → DefaultFileRenderer-BVeS3GS1.js} +2 -2
  10. package/dist/DefaultFileRenderer-BVeS3GS1.js.map +1 -0
  11. package/dist/ImageFileRenderer-C8tVW3I8.js.map +1 -1
  12. package/dist/Markdown/Markdown.d.ts +5 -0
  13. package/dist/Markdown/Table.d.ts +1 -1
  14. package/dist/Markdown/index.d.ts +2 -2
  15. package/dist/Markdown/plugins/remarkCve.d.ts +1 -1
  16. package/dist/PDFFileRenderer-BBn2EVrV.js +16 -0
  17. package/dist/PDFFileRenderer-BBn2EVrV.js.map +1 -0
  18. package/dist/SessionMessages/SessionEmpty.d.ts +1 -4
  19. package/dist/SessionMessages/SessionMessage/MessageFile/renderers/index.d.ts +1 -1
  20. package/dist/SessionMessages/SessionMessage/MessageFiles.d.ts +1 -1
  21. package/dist/SessionMessages/SessionMessage/MessageSources.d.ts +1 -1
  22. package/dist/SessionMessages/SessionMessage/SessionMessage.d.ts +4 -0
  23. package/dist/SessionMessages/SessionMessage/index.d.ts +2 -2
  24. package/dist/SessionMessages/SessionMessages.d.ts +9 -1
  25. package/dist/SessionMessages/index.d.ts +2 -2
  26. package/dist/SessionsList/index.d.ts +2 -2
  27. package/dist/docs.json +159 -20
  28. package/dist/{index-D7d92jbn.js → index-BIrmxgH5.js} +1326 -1308
  29. package/dist/index-BIrmxgH5.js.map +1 -0
  30. package/dist/index.css +8227 -850
  31. package/dist/index.d.ts +7 -6
  32. package/dist/index.js +33 -32
  33. package/dist/index.umd.cjs +1306 -1280
  34. package/dist/index.umd.cjs.map +1 -1
  35. package/dist/stories/Changelog.mdx +1 -1
  36. package/dist/stories/Chat.stories.tsx +5 -5
  37. package/dist/stories/ChatBubble.stories.tsx +3 -3
  38. package/dist/stories/Companion.stories.tsx +6 -6
  39. package/dist/stories/Console.stories.tsx +23 -23
  40. package/dist/stories/Integration.stories.tsx +2 -2
  41. package/dist/stories/Intro.mdx +1 -1
  42. package/dist/stories/assets/logo.svg +38 -19
  43. package/dist/stories/assets/paperclip.svg +4 -1
  44. package/dist/stories/assets/search.svg +5 -1
  45. package/dist/stories/examples.ts +20 -13
  46. package/dist/theme.d.ts +14 -0
  47. package/dist/utils/index.d.ts +1 -0
  48. package/package.json +63 -47
  49. package/dist/CSVFileRenderer-fklKR5lg.js.map +0 -1
  50. package/dist/DefaultFileRenderer-BQ9xzbrH.js.map +0 -1
  51. package/dist/PDFFileRenderer-DQdFS2l6.js +0 -9
  52. package/dist/PDFFileRenderer-DQdFS2l6.js.map +0 -1
  53. package/dist/index-D7d92jbn.js.map +0 -1
@@ -1,4 +1,4 @@
1
- import { ReactNode, FC } from 'react';
1
+ import { FC, ReactNode } from 'react';
2
2
  import { ChatTheme } from '../theme';
3
3
  export interface AppBarProps {
4
4
  /**
@@ -1,9 +1,10 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
- import * as React from "react";
3
- import { useState, useRef, useEffect } from "react";
4
2
  import { AnimatePresence, motion } from "motion/react";
5
- import { a as SvgCopy } from "./index-D7d92jbn.js";
6
3
  import { IconButton } from "reablocks";
4
+ import * as React from "react";
5
+ import { useContext, useState, useRef, useEffect } from "react";
6
+ import { C as ChatContext, a as SvgCopy } from "./index-BIrmxgH5.js";
7
+ const SvgDownload = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24px", height: "24px", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M 11 2 C 10.448 2 10 2.448 10 3 L 10 11 L 6.5 11 A 0.5 0.5 0 0 0 6 11.5 A 0.5 0.5 0 0 0 6.1464844 11.853516 A 0.5 0.5 0 0 0 6.1777344 11.882812 L 11.283203 16.697266 L 11.316406 16.728516 A 1 1 0 0 0 12 17 A 1 1 0 0 0 12.683594 16.728516 L 12.697266 16.716797 A 1 1 0 0 0 12.707031 16.705078 L 17.810547 11.892578 A 0.5 0.5 0 0 0 17.839844 11.865234 L 17.847656 11.859375 A 0.5 0.5 0 0 0 17.853516 11.853516 A 0.5 0.5 0 0 0 18 11.5 A 0.5 0.5 0 0 0 17.5 11 L 14 11 L 14 3 C 14 2.448 13.552 2 13 2 L 12 2 L 11 2 z M 3 20 A 1.0001 1.0001 0 1 0 3 22 L 21 22 A 1.0001 1.0001 0 1 0 21 20 L 3 20 z", fill: "currentColor" }));
7
8
  const sanitizeSVGCell = (cell) => {
8
9
  const trimmed = cell.trim();
9
10
  const escaped = trimmed.replace(/"/g, '""');
@@ -20,8 +21,8 @@ const parseCSV = (csvString) => {
20
21
  throw new Error("Failed to parse CSV file.");
21
22
  }
22
23
  };
23
- const SvgDownload = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 1, strokeLinecap: "round", strokeLinejoin: "round", className: "lucide lucide-cloud-download", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M4 14.899A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.5 8.242" }), /* @__PURE__ */ React.createElement("path", { d: "M12 12v9" }), /* @__PURE__ */ React.createElement("path", { d: "m8 17 4 4 4-4" }));
24
24
  const CSVFileRenderer = ({ name, url, fileIcon }) => {
25
+ const { theme } = useContext(ChatContext);
25
26
  const [isLoading, setIsLoading] = useState(true);
26
27
  const [csvData, setCsvData] = useState([]);
27
28
  const [error, setError] = useState(null);
@@ -97,24 +98,24 @@ const CSVFileRenderer = ({ name, url, fileIcon }) => {
97
98
  ]
98
99
  }
99
100
  );
100
- return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
101
- /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center gap-4", children: [
102
- /* @__PURE__ */ jsxs("div", { className: "csv-icon flex items-center", children: [
101
+ return /* @__PURE__ */ jsxs("div", { className: theme.messages.message.csvPreview.base, children: [
102
+ /* @__PURE__ */ jsxs("div", { className: theme.messages.message.csvPreview.header.base, children: [
103
+ /* @__PURE__ */ jsxs("div", { className: theme.messages.message.csvPreview.header.icon, children: [
103
104
  fileIcon,
104
105
  name && /* @__PURE__ */ jsx("figcaption", { className: "ml-1", children: name })
105
106
  ] }),
106
- /* @__PURE__ */ jsxs("div", { className: "csv-icon flex items-center gap-6", children: [
107
- /* @__PURE__ */ jsx(IconButton, { size: "small", variant: "text", onClick: downloadCSV, children: /* @__PURE__ */ jsx(SvgDownload, {}) }),
108
- /* @__PURE__ */ jsx(IconButton, { size: "small", variant: "text", onClick: toggleModal, children: /* @__PURE__ */ jsx(SvgCopy, {}) })
107
+ /* @__PURE__ */ jsxs("div", { className: theme.messages.message.csvPreview.header.actions, children: [
108
+ /* @__PURE__ */ jsx(IconButton, { size: "medium", variant: "text", onClick: downloadCSV, children: /* @__PURE__ */ jsx(SvgDownload, {}) }),
109
+ /* @__PURE__ */ jsx(IconButton, { size: "medium", variant: "text", onClick: toggleModal, children: /* @__PURE__ */ jsx(SvgCopy, {}) })
109
110
  ] })
110
111
  ] }),
111
112
  error && /* @__PURE__ */ jsx("div", { className: "error-message", children: error }),
112
113
  isLoading && !csvData && /* @__PURE__ */ jsx("div", { className: "text-text-secondary", children: "Loading..." }),
113
- /* @__PURE__ */ jsx("div", { className: "flex justify-between", children: !error && csvData.length > 0 && renderTable(csvData, 6) }),
114
+ /* @__PURE__ */ jsx("div", { className: theme.messages.message.csvPreview.tableContainer, children: !error && csvData.length > 0 && renderTable(csvData, 6) }),
114
115
  /* @__PURE__ */ jsx(AnimatePresence, { children: isModalOpen && /* @__PURE__ */ jsx(
115
116
  motion.div,
116
117
  {
117
- className: "fixed inset-0 bg-black/70 flex justify-center items-center z-50",
118
+ className: theme.messages.message.csvPreview.dialog.base,
118
119
  initial: { opacity: 0 },
119
120
  animate: { opacity: 1 },
120
121
  exit: { opacity: 0 },
@@ -123,7 +124,7 @@ const CSVFileRenderer = ({ name, url, fileIcon }) => {
123
124
  motion.div,
124
125
  {
125
126
  ref: modalRef,
126
- className: "bg-white dark:bg-gray-900 rounded-md w-11/12 h-5/6 overflow-auto",
127
+ className: theme.messages.message.csvPreview.dialog.container,
127
128
  initial: { scale: 0.8 },
128
129
  animate: { scale: 1 },
129
130
  exit: { scale: 0.8 },
@@ -138,4 +139,4 @@ const CSVFileRenderer = ({ name, url, fileIcon }) => {
138
139
  export {
139
140
  CSVFileRenderer as default
140
141
  };
141
- //# sourceMappingURL=CSVFileRenderer-fklKR5lg.js.map
142
+ //# sourceMappingURL=CSVFileRenderer-BJ6YmtEo.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CSVFileRenderer-BJ6YmtEo.js","sources":["../src/assets/download.svg?react","../src/utils/sanitize.ts","../src/utils/parseCSV.ts","../src/SessionMessages/SessionMessage/MessageFile/renderers/CSVFileRenderer.tsx"],"sourcesContent":["import * as React from \"react\";\nconst SvgDownload = (props) => /* @__PURE__ */ React.createElement(\"svg\", { xmlns: \"http://www.w3.org/2000/svg\", viewBox: \"0 0 24 24\", width: \"24px\", height: \"24px\", ...props }, /* @__PURE__ */ React.createElement(\"path\", { d: \"M 11 2 C 10.448 2 10 2.448 10 3 L 10 11 L 6.5 11 A 0.5 0.5 0 0 0 6 11.5 A 0.5 0.5 0 0 0 6.1464844 11.853516 A 0.5 0.5 0 0 0 6.1777344 11.882812 L 11.283203 16.697266 L 11.316406 16.728516 A 1 1 0 0 0 12 17 A 1 1 0 0 0 12.683594 16.728516 L 12.697266 16.716797 A 1 1 0 0 0 12.707031 16.705078 L 17.810547 11.892578 A 0.5 0.5 0 0 0 17.839844 11.865234 L 17.847656 11.859375 A 0.5 0.5 0 0 0 17.853516 11.853516 A 0.5 0.5 0 0 0 18 11.5 A 0.5 0.5 0 0 0 17.5 11 L 14 11 L 14 3 C 14 2.448 13.552 2 13 2 L 12 2 L 11 2 z M 3 20 A 1.0001 1.0001 0 1 0 3 22 L 21 22 A 1.0001 1.0001 0 1 0 21 20 L 3 20 z\", fill: \"currentColor\" }));\nexport default SvgDownload;\n","/**\n * Sanitizes cell content to prevent CSV injection and other potential vulnerabilities.\n * Based on the documentation of OWASP for CSV Injection\n * https://owasp.org/www-community/attacks/CSV_Injection\n * @param cell The cell content to sanitize.\n * @returns The sanitized cell content.\n */\nexport const sanitizeSVGCell = (cell: string): string => {\n const trimmed = cell.trim();\n // Escape double quotes by doubling them\n const escaped = trimmed.replace(/\"/g, '\"\"');\n // Add single quote prefix only for potentially dangerous content\n const prefix = /^[=+\\-@]/.test(trimmed) ? \"'\" : '';\n // Only wrap in quotes if the content contains special characters\n const needsQuotes = /[\",\\n\\r]/.test(escaped) || prefix;\n\n return needsQuotes ? `\"${prefix}${escaped}\"` : escaped;\n};\n","import { sanitizeSVGCell } from './sanitize';\n\n/**\n * Parses a CSV string from a local file and returns an array of rows.\n * Sanitizes cell data to prevent injection attacks.\n * @param csvString The raw CSV string content to parse.\n * @returns The parsed CSV data as a 2D array of strings.\n */\nexport const parseCSV = (csvString: string): string[][] => {\n try {\n const rows = csvString.split('\\n');\n return rows.map(row => row.split(',').map(cell => sanitizeSVGCell(cell)));\n } catch (error) {\n console.error('Error parsing CSV:', error);\n throw new Error('Failed to parse CSV file.');\n }\n};\n","import { AnimatePresence, motion } from 'motion/react';\nimport { IconButton } from 'reablocks';\nimport type { FC, ReactElement } from 'react';\nimport { useContext, useEffect, useRef, useState } from 'react';\n\nimport PlaceholderIcon from '@/assets/copy.svg?react';\nimport DownloadIcon from '@/assets/download.svg?react';\nimport { ChatContext } from '@/ChatContext';\nimport { parseCSV } from '@/utils/parseCSV';\n\ninterface CSVFileRendererProps {\n /**\n * Name of the file.\n */\n name?: string;\n\n /**\n * URL of the file.\n */\n url: string;\n\n /**\n * Icon to for file type.\n */\n fileIcon?: ReactElement;\n}\n\n/**\n * Renderer for CSV files that fetches and displays a snippet of the file data.\n */\nconst CSVFileRenderer: FC<CSVFileRendererProps> = ({ name, url, fileIcon }) => {\n const { theme } = useContext(ChatContext);\n const [isLoading, setIsLoading] = useState<boolean>(true);\n const [csvData, setCsvData] = useState<string[][]>([]);\n const [error, setError] = useState<string | null>(null);\n const [isModalOpen, setIsModalOpen] = useState(false);\n const modalRef = useRef<HTMLDivElement>(null);\n\n useEffect(() => {\n const fetchCsvData = async () => {\n try {\n setIsLoading(true);\n const response = await fetch(url);\n const data = parseCSV(await response.text());\n setCsvData(data);\n } catch {\n setError('Failed to load CSV file.');\n } finally {\n setIsLoading(false);\n }\n };\n\n fetchCsvData();\n }, [url]);\n\n const toggleModal = () => {\n setIsModalOpen(prev => !prev);\n };\n\n const handleClickOutside = (event: MouseEvent) => {\n if (modalRef.current && !modalRef.current.contains(event.target as Node)) {\n setIsModalOpen(false);\n }\n };\n\n useEffect(() => {\n if (isModalOpen) {\n document.addEventListener('mousedown', handleClickOutside);\n } else {\n document.removeEventListener('mousedown', handleClickOutside);\n }\n return () => {\n document.removeEventListener('mousedown', handleClickOutside);\n };\n }, [isModalOpen]);\n\n const downloadCSV = () => {\n if (csvData.length === 0) return;\n\n const csvContent = csvData.map(row => row.join(',')).join('\\n');\n const blob = new Blob([csvContent], { type: 'text/csv;charset=utf-8;' });\n const url = URL.createObjectURL(blob);\n const link = document.createElement('a');\n link.href = url;\n link.setAttribute('download', `${name || 'data'}`);\n document.body.appendChild(link);\n link.click();\n document.body.removeChild(link);\n };\n\n const renderTable = (data: string[][], maxRows?: number) => (\n <motion.table\n layout\n className=\"w-full\"\n transition={{ type: 'spring', stiffness: 100, damping: 20 }}\n >\n <thead className=\"sticky top-0 bg-gray-200 dark:bg-gray-800 z-10\">\n <tr>\n <th className=\"py-4 px-6\">#</th>\n {data[0].map((header, index) => (\n <th key={`header-${index}`} className=\"py-4 px-6\">\n {header}\n </th>\n ))}\n </tr>\n </thead>\n <tbody>\n {data.slice(1, maxRows).map((row, rowIndex) => (\n <tr\n key={`row-${rowIndex}`}\n className=\"border-b border-panel-accent light:border-gray-700 hover:bg-panel-accent hover:light:bg-gray-700/40 transition-colors text-base\"\n >\n <td className=\"py-4 px-6\">{rowIndex + 1}</td>\n {row.map((cell, cellIndex) => (\n <td key={`cell-${rowIndex}-${cellIndex}`} className=\"py-4 px-6\">\n {cell}\n </td>\n ))}\n </tr>\n ))}\n </tbody>\n </motion.table>\n );\n\n return (\n <div className={theme.messages.message.csvPreview.base}>\n <div className={theme.messages.message.csvPreview.header.base}>\n <div className={theme.messages.message.csvPreview.header.icon}>\n {fileIcon}\n {name && <figcaption className=\"ml-1\">{name}</figcaption>}\n </div>\n <div className={theme.messages.message.csvPreview.header.actions}>\n <IconButton size=\"medium\" variant=\"text\" onClick={downloadCSV}>\n <DownloadIcon />\n </IconButton>\n <IconButton size=\"medium\" variant=\"text\" onClick={toggleModal}>\n <PlaceholderIcon />\n </IconButton>\n </div>\n </div>\n\n {error && <div className=\"error-message\">{error}</div>}\n\n {isLoading && !csvData && (\n <div className=\"text-text-secondary\">Loading...</div>\n )}\n\n <div className={theme.messages.message.csvPreview.tableContainer}>\n {!error && csvData.length > 0 && renderTable(csvData, 6)}\n </div>\n\n <AnimatePresence>\n {isModalOpen && (\n <motion.div\n className={theme.messages.message.csvPreview.dialog.base}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n transition={{ duration: 0.3 }}\n >\n <motion.div\n ref={modalRef}\n className={theme.messages.message.csvPreview.dialog.container}\n initial={{ scale: 0.8 }}\n animate={{ scale: 1 }}\n exit={{ scale: 0.8 }}\n transition={{ duration: 0.3 }}\n >\n {!error && csvData.length > 0 && renderTable(csvData)}\n </motion.div>\n </motion.div>\n )}\n </AnimatePresence>\n </div>\n );\n};\n\nexport default CSVFileRenderer;\n"],"names":["url","DownloadIcon","PlaceholderIcon"],"mappings":"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"}
package/dist/Chat.d.ts CHANGED
@@ -1,8 +1,8 @@
1
1
  import { CSSProperties, FC, PropsWithChildren } from 'react';
2
- import { Session } from './types';
3
- import { ChatTheme } from './theme';
4
- import { ChatViewType } from './ChatContext';
5
2
  import { Plugin } from 'unified';
3
+ import { ChatViewType } from './ChatContext';
4
+ import { ChatTheme } from './theme';
5
+ import { Session } from './types';
6
6
  export interface ChatProps extends PropsWithChildren {
7
7
  /**
8
8
  * The style to apply to the root element.
@@ -24,4 +24,4 @@ export interface ChatBubbleProps {
24
24
  */
25
25
  className?: string;
26
26
  }
27
- export declare const ChatBubble: import('react').NamedExoticComponent<ChatBubbleProps>;
27
+ export declare const ChatBubble: import('react').MemoExoticComponent<({ children, bubbleContent, position, modifiers, className }: ChatBubbleProps) => import("react/jsx-runtime").JSX.Element>;
@@ -1,6 +1,6 @@
1
- import { Session } from './types';
2
- import { ChatTheme } from './theme';
3
1
  import { Plugin } from 'unified';
2
+ import { ChatTheme } from './theme';
3
+ import { Session } from './types';
4
4
  export type ChatViewType = 'chat' | 'companion' | 'console';
5
5
  export interface ChatContextProps {
6
6
  sessions: Session[];
@@ -24,12 +24,36 @@ interface ChatInputProps {
24
24
  * Icon to show for attach.
25
25
  */
26
26
  attachIcon?: ReactElement;
27
+ /**
28
+ * Message to be displayed in the input field.
29
+ */
30
+ message?: string;
31
+ /**
32
+ * Class name to apply to the container.
33
+ */
34
+ className?: string;
35
+ /**
36
+ * Callback function to handle message change.
37
+ */
38
+ onMessageChange?: (message: string) => void;
27
39
  }
28
40
  export interface ChatInputRef {
29
41
  /**
30
42
  * Focus the input.
31
43
  */
32
44
  focus: () => void;
45
+ /**
46
+ * Send the message.
47
+ */
48
+ send: () => void;
49
+ /**
50
+ * Set the input value programmatically.
51
+ */
52
+ setValue: (value: string) => void;
53
+ /**
54
+ * Get the input value programmatically.
55
+ */
56
+ getValue: () => string;
33
57
  }
34
58
  export declare const ChatInput: import('react').ForwardRefExoticComponent<ChatInputProps & import('react').RefAttributes<ChatInputRef>>;
35
59
  export {};
@@ -1,4 +1,4 @@
1
- import { FC, ReactNode, ChangeEvent } from 'react';
1
+ import { ChangeEvent, FC, ReactNode } from 'react';
2
2
  interface FileInputProps {
3
3
  /**
4
4
  * Array of allowed file extensions.
@@ -1,6 +1,6 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
- import { S as SvgFile } from "./index-D7d92jbn.js";
3
2
  import { cn, Ellipsis } from "reablocks";
3
+ import { S as SvgFile } from "./index-BIrmxgH5.js";
4
4
  const DefaultFileRenderer = ({
5
5
  name,
6
6
  limit = 100,
@@ -12,4 +12,4 @@ const DefaultFileRenderer = ({
12
12
  export {
13
13
  DefaultFileRenderer as default
14
14
  };
15
- //# sourceMappingURL=DefaultFileRenderer-BQ9xzbrH.js.map
15
+ //# sourceMappingURL=DefaultFileRenderer-BVeS3GS1.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DefaultFileRenderer-BVeS3GS1.js","sources":["../src/SessionMessages/SessionMessage/MessageFile/renderers/DefaultFileRenderer.tsx"],"sourcesContent":["import { cn, Ellipsis } from 'reablocks';\nimport type { FC, ReactElement } from 'react';\n\nimport FileIcon from '@/assets/file.svg?react';\n\ninterface DefaultFileRendererProps {\n /**\n * Limit for the name.\n */\n limit?: number;\n\n /**\n * Name of the file.\n */\n name?: string;\n\n /**\n * URL of the file.\n */\n url: string;\n\n /**\n * Icon to for file type.\n */\n fileIcon?: ReactElement;\n}\n\n/**\n * Default renderer for unspecified file types.\n */\nconst DefaultFileRenderer: FC<DefaultFileRendererProps> = ({\n name,\n limit = 100,\n fileIcon = <FileIcon />\n}) => (\n <figure className=\"flex items-center gap-2\">\n {fileIcon}\n {name && (\n <figcaption className={cn('file-name-class')}>\n <Ellipsis value={name} limit={limit} />\n </figcaption>\n )}\n </figure>\n);\n\nexport default DefaultFileRenderer;\n"],"names":["FileIcon"],"mappings":";;;AA8BA,MAAM,sBAAoD,CAAC;AAAA,EACzD;AAAA,EACA,QAAQ;AAAA,EACR,+BAAYA,SAAA,CAAA,CAAS;AACvB,MACE,qBAAC,UAAA,EAAO,WAAU,2BACf,UAAA;AAAA,EAAA;AAAA,EACA,QACC,oBAAC,cAAA,EAAW,WAAW,GAAG,iBAAiB,GACzC,UAAA,oBAAC,UAAA,EAAS,OAAO,MAAM,MAAA,CAAc,EAAA,CACvC;AAAA,EAAA,CAEJ;"}
@@ -1 +1 @@
1
- {"version":3,"file":"ImageFileRenderer-C8tVW3I8.js","sources":["../src/SessionMessages/SessionMessage/MessageFile/renderers/ImageFileRenderer.tsx"],"sourcesContent":["import { FC } from 'react';\n\ninterface ImageFileRendererProps {\n /**\n * Name of the file.\n */\n name?: string;\n\n /**\n * URL of the file.\n */\n url: string;\n}\n\n/**\n * Renderer for image files.\n */\nconst ImageFileRenderer: FC<ImageFileRendererProps> = ({ url }) => (\n <img src={url} alt=\"Image\" className=\"size-10\" />\n);\n\nexport default ImageFileRenderer;\n"],"names":[],"mappings":";AAiBA,MAAM,oBAAgD,CAAC,EAAE,IACvD,MAAA,oBAAC,OAAI,EAAA,KAAK,KAAK,KAAI,SAAQ,WAAU,UAAU,CAAA;"}
1
+ {"version":3,"file":"ImageFileRenderer-C8tVW3I8.js","sources":["../src/SessionMessages/SessionMessage/MessageFile/renderers/ImageFileRenderer.tsx"],"sourcesContent":["import type { FC } from 'react';\n\ninterface ImageFileRendererProps {\n /**\n * Name of the file.\n */\n name?: string;\n\n /**\n * URL of the file.\n */\n url: string;\n}\n\n/**\n * Renderer for image files.\n */\nconst ImageFileRenderer: FC<ImageFileRendererProps> = ({ url }) => (\n <img src={url} alt=\"Image\" className=\"size-10\" />\n);\n\nexport default ImageFileRenderer;\n"],"names":[],"mappings":";AAiBA,MAAM,oBAAgD,CAAC,EAAE,IAAA,MACvD,oBAAC,OAAA,EAAI,KAAK,KAAK,KAAI,SAAQ,WAAU,UAAA,CAAU;"}
@@ -1,5 +1,6 @@
1
1
  import { FC, PropsWithChildren } from 'react';
2
2
  import { Plugin } from 'unified';
3
+ import { ChatTheme } from '../theme';
3
4
  interface MarkdownWrapperProps extends PropsWithChildren {
4
5
  /**
5
6
  * Remark plugins to apply to the markdown content.
@@ -9,6 +10,10 @@ interface MarkdownWrapperProps extends PropsWithChildren {
9
10
  * Rehype plugins to apply to the markdown content.
10
11
  */
11
12
  rehypePlugins?: Plugin[];
13
+ /**
14
+ * Theme to apply to the markdown content.
15
+ */
16
+ theme: ChatTheme;
12
17
  }
13
18
  export declare const Markdown: FC<MarkdownWrapperProps>;
14
19
  export {};
@@ -1,4 +1,4 @@
1
- import { default as React, FC, PropsWithChildren } from 'react';
1
+ import { FC, PropsWithChildren, default as React } from 'react';
2
2
  export declare const TableComponent: FC<PropsWithChildren<React.HTMLAttributes<HTMLTableElement>>>;
3
3
  export declare const TableHeaderCell: FC<PropsWithChildren<React.HTMLAttributes<HTMLTableHeaderCellElement>>>;
4
4
  export declare const TableDataCell: FC<PropsWithChildren<React.HTMLAttributes<HTMLTableDataCellElement>>>;
@@ -1,5 +1,5 @@
1
- export * from './Markdown';
2
- export * from './Table';
3
1
  export * from './CodeHighlighter';
2
+ export * from './Markdown';
4
3
  export * from './plugins';
4
+ export * from './Table';
5
5
  export * from './themes';
@@ -1 +1 @@
1
- export declare function remarkCve(): (tree: any, _file: any) => void;
1
+ export declare function remarkCve(): (tree: any) => void;
@@ -0,0 +1,16 @@
1
+ import { jsxs, jsx } from "react/jsx-runtime";
2
+ const PDFFileRenderer = ({ name, url, fileIcon }) => /* @__PURE__ */ jsxs(
3
+ "figure",
4
+ {
5
+ className: "csv-icon flex items-center gap-2",
6
+ onClick: () => window.open(url, "_blank"),
7
+ children: [
8
+ fileIcon,
9
+ name && /* @__PURE__ */ jsx("figcaption", { className: "file-name", children: name })
10
+ ]
11
+ }
12
+ );
13
+ export {
14
+ PDFFileRenderer as default
15
+ };
16
+ //# sourceMappingURL=PDFFileRenderer-BBn2EVrV.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PDFFileRenderer-BBn2EVrV.js","sources":["../src/SessionMessages/SessionMessage/MessageFile/renderers/PDFFileRenderer.tsx"],"sourcesContent":["import type { FC, ReactElement } from 'react';\n\ninterface PDFFileRendererProps {\n /**\n * Name of the file.\n */\n name?: string;\n\n /**\n * URL of the file.\n */\n url: string;\n\n /**\n * Icon to for file type.\n */\n fileIcon?: ReactElement;\n}\n\n/**\n * Renderer for PDF files.\n */\nconst PDFFileRenderer: FC<PDFFileRendererProps> = ({ name, url, fileIcon }) => (\n <figure\n className=\"csv-icon flex items-center gap-2\"\n onClick={() => window.open(url, '_blank')}\n >\n {fileIcon}\n {name && <figcaption className=\"file-name\">{name}</figcaption>}\n </figure>\n);\n\nexport default PDFFileRenderer;\n"],"names":[],"mappings":";AAsBA,MAAM,kBAA4C,CAAC,EAAE,MAAM,KAAK,eAC9D;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAU;AAAA,IACV,SAAS,MAAM,OAAO,KAAK,KAAK,QAAQ;AAAA,IAEvC,UAAA;AAAA,MAAA;AAAA,MACA,QAAQ,oBAAC,cAAA,EAAW,WAAU,aAAa,UAAA,KAAA,CAAK;AAAA,IAAA;AAAA,EAAA;AACnD;"}
@@ -1,5 +1,2 @@
1
1
  import { FC, PropsWithChildren } from 'react';
2
- interface SessionEmptyProps extends PropsWithChildren {
3
- }
4
- export declare const SessionEmpty: FC<SessionEmptyProps>;
5
- export {};
2
+ export declare const SessionEmpty: FC<PropsWithChildren>;
@@ -1,4 +1,4 @@
1
- export * from './DefaultFileRenderer';
2
1
  export * from './CSVFileRenderer';
2
+ export * from './DefaultFileRenderer';
3
3
  export * from './ImageFileRenderer';
4
4
  export * from './PDFFileRenderer';
@@ -1,5 +1,5 @@
1
- import { ConversationFile } from '../../types';
2
1
  import { FC, PropsWithChildren } from 'react';
2
+ import { ConversationFile } from '../../types';
3
3
  interface MessageFilesProps extends PropsWithChildren {
4
4
  /**
5
5
  * Files to render.
@@ -1,5 +1,5 @@
1
- import { ConversationSource } from '../../types';
2
1
  import { FC, PropsWithChildren } from 'react';
2
+ import { ConversationSource } from '../../types';
3
3
  interface MessageSourcesProps extends PropsWithChildren {
4
4
  /**
5
5
  * Sources to render.
@@ -1,6 +1,10 @@
1
1
  import { FC, PropsWithChildren } from 'react';
2
2
  import { Conversation } from '../../types';
3
3
  interface SessionMessageProps extends PropsWithChildren {
4
+ /**
5
+ * Class name to apply to the root element.
6
+ */
7
+ className?: string;
4
8
  /**
5
9
  * Conversation to render.
6
10
  */
@@ -1,8 +1,8 @@
1
- export * from './SessionMessage';
2
- export * from './MessageSource';
3
1
  export * from './MessageActions';
4
2
  export * from './MessageFile';
5
3
  export * from './MessageFiles';
6
4
  export * from './MessageQuestion';
7
5
  export * from './MessageResponse';
6
+ export * from './MessageSource';
8
7
  export * from './MessageSources';
8
+ export * from './SessionMessage';
@@ -1,6 +1,10 @@
1
- import { default as React, ReactNode } from 'react';
1
+ import { ReactNode, default as React } from 'react';
2
2
  import { Conversation } from '../types';
3
3
  interface SessionMessagesProps {
4
+ /**
5
+ * Class name to apply to the root element.
6
+ */
7
+ className?: string;
4
8
  /**
5
9
  * Content to display when there are no sessions selected or a new session is started.
6
10
  */
@@ -13,6 +17,10 @@ interface SessionMessagesProps {
13
17
  * Text to display for the show more button.
14
18
  */
15
19
  showMoreText?: string;
20
+ /**
21
+ * Whether to automatically scroll to the bottom of the content.
22
+ */
23
+ autoScroll?: boolean;
16
24
  /**
17
25
  * Render function for the session messages.
18
26
  */
@@ -1,5 +1,5 @@
1
1
  export * from './SessionEmpty';
2
- export * from './SessionMessagesHeader';
3
- export * from './SessionMessagePanel';
4
2
  export * from './SessionMessage';
3
+ export * from './SessionMessagePanel';
5
4
  export * from './SessionMessages';
5
+ export * from './SessionMessagesHeader';
@@ -1,5 +1,5 @@
1
- export * from './SessionsList';
2
- export * from './SessionListItem';
3
1
  export * from './NewSessionButton';
4
2
  export * from './SessionGroups';
3
+ export * from './SessionListItem';
5
4
  export * from './SessionsGroup';
5
+ export * from './SessionsList';