reachat 2.0.2 → 2.1.0-alpha.2

package/dist/{CSVFileRenderer-fklKR5lg.js → CSVFileRenderer-CpB8ngRc.js}

@@ -2,7 +2,7 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import * as React from "react";
 import { useState, useRef, useEffect } from "react";
 import { AnimatePresence, motion } from "motion/react";
-import { a as SvgCopy } from "./index-D7d92jbn.js";
+import { a as SvgCopy } from "./index-DVFyp_Cz.js";
 import { IconButton } from "reablocks";
 const sanitizeSVGCell = (cell) => {
   const trimmed = cell.trim();
@@ -138,4 +138,4 @@ const CSVFileRenderer = ({ name, url, fileIcon }) => {
 export {
   CSVFileRenderer as default
 };
-//# sourceMappingURL=CSVFileRenderer-fklKR5lg.js.map
+//# sourceMappingURL=CSVFileRenderer-CpB8ngRc.js.map

package/dist/{CSVFileRenderer-fklKR5lg.js.map → CSVFileRenderer-CpB8ngRc.js.map}

@@ -1 +1 @@
-{"version":3,"file":"CSVFileRenderer-fklKR5lg.js","sources":["../src/utils/sanitize.ts","../src/utils/parseCSV.ts","../src/assets/download.svg?react","../src/SessionMessages/SessionMessage/MessageFile/renderers/CSVFileRenderer.tsx"],"sourcesContent":["\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 * as React from \"react\";\nconst 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\" }));\nexport default SvgDownload;\n","import { FC, useEffect, useState, ReactElement, useRef } from 'react';\nimport { motion, AnimatePresence } from 'motion/react';\nimport { parseCSV } from '@/utils/parseCSV';\nimport DownloadIcon from '@/assets/download.svg?react';\nimport PlaceholderIcon from '@/assets/copy.svg?react';\nimport { IconButton } from 'reablocks';\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 [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=\"flex flex-col gap-2\">\n      <div className=\"flex justify-between items-center gap-4\">\n        <div className=\"csv-icon flex items-center\">\n          {fileIcon}\n          {name && <figcaption className=\"ml-1\">{name}</figcaption>}\n        </div>\n        <div className=\"csv-icon flex items-center gap-6\">\n          <IconButton size=\"small\" variant=\"text\" onClick={downloadCSV}>\n            <DownloadIcon />\n          </IconButton>\n          <IconButton size=\"small\" 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=\"flex justify-between\">\n        {!error && csvData.length > 0 && renderTable(csvData, 6)}\n      </div>\n\n      <AnimatePresence>\n        {isModalOpen && (\n          <motion.div\n            className=\"fixed inset-0 bg-black/70 flex justify-center items-center z-50\"\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=\"bg-white dark:bg-gray-900 rounded-md w-11/12 h-5/6 overflow-auto\"\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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"}
+{"version":3,"file":"CSVFileRenderer-CpB8ngRc.js","sources":["../src/utils/sanitize.ts","../src/utils/parseCSV.ts","../src/assets/download.svg?react","../src/SessionMessages/SessionMessage/MessageFile/renderers/CSVFileRenderer.tsx"],"sourcesContent":["\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 * as React from \"react\";\nconst 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\" }));\nexport default SvgDownload;\n","import { FC, useEffect, useState, ReactElement, useRef } from 'react';\nimport { motion, AnimatePresence } from 'motion/react';\nimport { parseCSV } from '@/utils/parseCSV';\nimport DownloadIcon from '@/assets/download.svg?react';\nimport PlaceholderIcon from '@/assets/copy.svg?react';\nimport { IconButton } from 'reablocks';\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 [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=\"flex flex-col gap-2\">\n      <div className=\"flex justify-between items-center gap-4\">\n        <div className=\"csv-icon flex items-center\">\n          {fileIcon}\n          {name && <figcaption className=\"ml-1\">{name}</figcaption>}\n        </div>\n        <div className=\"csv-icon flex items-center gap-6\">\n          <IconButton size=\"small\" variant=\"text\" onClick={downloadCSV}>\n            <DownloadIcon />\n          </IconButton>\n          <IconButton size=\"small\" 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=\"flex justify-between\">\n        {!error && csvData.length > 0 && renderTable(csvData, 6)}\n      </div>\n\n      <AnimatePresence>\n        {isModalOpen && (\n          <motion.div\n            className=\"fixed inset-0 bg-black/70 flex justify-center items-center z-50\"\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=\"bg-white dark:bg-gray-900 rounded-md w-11/12 h-5/6 overflow-auto\"\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/ChatInput/ChatInput.d.ts

@@ -24,12 +24,24 @@ interface ChatInputProps {
      * Icon to show for attach.
      */
     attachIcon?: ReactElement;
+    /**
+     * Message to be displayed in the input field.
+     */
+    message?: string;
+    /**
+     * Callback function to handle message change.
+     */
+    onMessageChange?: (message: string) => void;
 }
 export interface ChatInputRef {
     /**
      * Focus the input.
      */
     focus: () => void;
+    /**
+     * Send the message.
+     */
+    send: () => void;
 }
 export declare const ChatInput: import('react').ForwardRefExoticComponent<ChatInputProps & import('react').RefAttributes<ChatInputRef>>;
 export {};

package/dist/{DefaultFileRenderer-BQ9xzbrH.js → DefaultFileRenderer-DEgyNAd4.js}

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { S as SvgFile } from "./index-D7d92jbn.js";
+import { S as SvgFile } from "./index-DVFyp_Cz.js";
 import { cn, Ellipsis } from "reablocks";
 const DefaultFileRenderer = ({
   name,
@@ -12,4 +12,4 @@ const DefaultFileRenderer = ({
 export {
   DefaultFileRenderer as default
 };
-//# sourceMappingURL=DefaultFileRenderer-BQ9xzbrH.js.map
+//# sourceMappingURL=DefaultFileRenderer-DEgyNAd4.js.map

package/dist/{DefaultFileRenderer-BQ9xzbrH.js.map → DefaultFileRenderer-DEgyNAd4.js.map}

@@ -1 +1 @@
-{"version":3,"file":"DefaultFileRenderer-BQ9xzbrH.js","sources":["../src/SessionMessages/SessionMessage/MessageFile/renderers/DefaultFileRenderer.tsx"],"sourcesContent":["import { FC, ReactElement } from 'react';\nimport FileIcon from '@/assets/file.svg?react';\nimport { Ellipsis, cn } from 'reablocks';\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":";;;AA6BA,MAAM,sBAAoD,CAAC;AAAA,EACzD;AAAA,EACA,QAAQ;AAAA,EACR,+BAAYA,SAAS,CAAA,CAAA;AACvB,MACE,qBAAC,UAAO,EAAA,WAAU,2BACf,UAAA;AAAA,EAAA;AAAA,EACA,QACC,oBAAC,cAAW,EAAA,WAAW,GAAG,iBAAiB,GACzC,UAAA,oBAAC,UAAS,EAAA,OAAO,MAAM,MAAc,CAAA,EACvC,CAAA;AAAA,EAEJ,CAAA;"}
+{"version":3,"file":"DefaultFileRenderer-DEgyNAd4.js","sources":["../src/SessionMessages/SessionMessage/MessageFile/renderers/DefaultFileRenderer.tsx"],"sourcesContent":["import { FC, ReactElement } from 'react';\nimport FileIcon from '@/assets/file.svg?react';\nimport { Ellipsis, cn } from 'reablocks';\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":";;;AA6BA,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;"}

package/dist/ImageFileRenderer-C8tVW3I8.js.map

@@ -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;"}
+{"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,IAAA,MACvD,oBAAC,OAAA,EAAI,KAAK,KAAK,KAAI,SAAQ,WAAU,UAAA,CAAU;"}

package/dist/PDFFileRenderer-DQdFS2l6.js.map

@@ -1 +1 @@
-{"version":3,"file":"PDFFileRenderer-DQdFS2l6.js","sources":["../src/SessionMessages/SessionMessage/MessageFile/renderers/PDFFileRenderer.tsx"],"sourcesContent":["import { 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 className=\"csv-icon flex items-center gap-2\" onClick={() => window.open(url, '_blank')}>\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,SAC9D,MAAA,qBAAC,UAAO,EAAA,WAAU,oCAAmC,SAAS,MAAM,OAAO,KAAK,KAAK,QAAQ,GAC1F,UAAA;AAAA,EAAA;AAAA,EACA,QAAQ,oBAAC,cAAW,EAAA,WAAU,aAAa,UAAK,KAAA,CAAA;AAAA,EACnD,CAAA;"}
+{"version":3,"file":"PDFFileRenderer-DQdFS2l6.js","sources":["../src/SessionMessages/SessionMessage/MessageFile/renderers/PDFFileRenderer.tsx"],"sourcesContent":["import { 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 className=\"csv-icon flex items-center gap-2\" onClick={() => window.open(url, '_blank')}>\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,qBAAC,UAAA,EAAO,WAAU,oCAAmC,SAAS,MAAM,OAAO,KAAK,KAAK,QAAQ,GAC1F,UAAA;AAAA,EAAA;AAAA,EACA,QAAQ,oBAAC,cAAA,EAAW,WAAU,aAAa,UAAA,KAAA,CAAK;AAAA,EAAA,CACnD;"}

package/dist/docs.json

@@ -104,7 +104,9 @@
         }
       },
       "theme": {
-        "defaultValue": null,
+        "defaultValue": {
+          "value": "{\n  base: 'dark:text-white text-gray-500',\n  console: 'flex w-full gap-4 h-full',\n  companion: 'w-full h-full overflow-hidden',\n  empty: 'text-center flex-1',\n  appbar: 'flex p-5',\n  sessions: {\n    base: 'overflow-auto',\n    console:\n      'min-w-[150px] w-[30%] max-w-[300px] dark:bg-[#11111F] bg-[#F2F3F7] p-5 rounded-3xl',\n    companion: 'w-full h-full',\n    group:\n      'text-xs dart:text-gray-400 text-gray-700 mt-4 hover:bg-transparent mb-1',\n    create: 'relative mb-4 rounded-[10px] text-white',\n    session: {\n      base: [\n        'group my-1 rounded-[10px] p-2 text-gray-500 border border-transparent hover:bg-gray-300 hover:border-gray-400 [&_svg]:text-gray-500',\n        'dark:text-typography dark:text-gray-400 dark:hover:bg-gray-800/50 dark:hover:border-gray-700/50 dark:[&_svg]:text-gray-200'\n      ].join(' '),\n      active: [\n        'border border-gray-300 hover:border-gray-400 text-gray-700 bg-gray-200 hover:bg-gray-300 ',\n        'dark:text-gray-500 dark:bg-gray-800/70 dark:border-gray-700/50 dark:text-white dark:border-gray-700/70 dark:hover:bg-gray-800/50',\n        '[&_button]:opacity-100!'\n      ].join(' '),\n      delete: '[&>svg]:w-4 [&>svg]:h-4 opacity-0 group-hover:opacity-50!'\n    }\n  },\n  messages: {\n    base: '',\n    console: 'flex flex-col mx-5 flex-1 overflow-hidden',\n    companion: 'flex w-full h-full',\n    back: 'self-start p-0 my-2',\n    inner: 'flex-1 h-full flex flex-col',\n    title: ['text-base font-bold text-gray-500', 'dark:text-gray-200'].join(\n      ' '\n    ),\n    date: 'text-xs whitespace-nowrap text-gray-400',\n    content: [\n      'mt-2 flex-1 overflow-auto [&_hr]:bg-gray-200',\n      'dark:[&_hr]:bg-gray-800/60'\n    ].join(' '),\n    header: 'flex justify-between items-center gap-2',\n    showMore: 'mb-4',\n    message: {\n      base: 'mt-4 mb-4 flex flex-col p-0 rounded-sm border-none bg-transparent',\n      question: [\n        'relative font-semibold mb-4 px-4 py-4 pb-2 rounded-3xl rounded-br-none text-typography border bg-gray-200 border-gray-300 text-gray-900',\n        'dark:bg-gray-900/60 dark:border-gray-700/50 dark:text-gray-100'\n      ].join(' '),\n      response: [\n        'relative data-[compact=false]:px-4 text-gray-900',\n        'dark:text-gray-100'\n      ].join(' '),\n      overlay:\n        \"overflow-y-hidden max-h-[350px] after:content-[''] after:absolute after:inset-x-0 after:bottom-0 after:h-16 after:bg-linear-to-b after:from-transparent dark:after:to-gray-900 after:to-gray-200\",\n      cursor: 'inline-block w-1 h-4 bg-current',\n      expand: 'absolute bottom-1 right-1 z-10',\n      files: {\n        base: 'mb-2 flex flex-wrap gap-3 ',\n        file: {\n          base: [\n            'flex items-center gap-2 border border-gray-300 px-3 py-2 rounded-lg cursor-pointer',\n            'dark:border-gray-700'\n          ].join(' '),\n          name: ['text-sm text-gray-500', 'dark:text-gray-200'].join(' ')\n        }\n      },\n      sources: {\n        base: 'my-4 flex flex-wrap gap-3',\n        source: {\n          base: [\n            'flex gap-2 border border-gray-200 px-4 py-2 rounded-lg cursor-pointer',\n            'dark:border-gray-700'\n          ].join(' '),\n          companion: 'flex-1 px-3 py-1.5',\n          image: 'max-w-10 max-h-10 rounded-md w-full h-fit self-center',\n          title: 'text-md block',\n          url: 'text-sm text-blue-400 underline'\n        }\n      },\n      markdown: {\n        copy: 'sticky py-1 [&>svg]:w-4 [&>svg]:h-4 opacity-50',\n        p: 'mb-2',\n        a: 'text-blue-400 underline',\n        table: 'table-auto w-full m-2',\n        th: 'px-4 py-2 text-left font-bold border-b border-gray-500',\n        td: 'px-4 py-2',\n        code: 'm-2 rounded-b relative',\n        toolbar:\n          'text-xs dark:bg-gray-700/50 flex items-center justify-between px-2 py-1 rounded-t sticky top-0 backdrop-blur-md bg-gray-200 ',\n        li: 'mb-2 ml-6',\n        ul: 'mb-4 list-disc',\n        ol: 'mb-4 list-decimal'\n      },\n      footer: {\n        base: 'mt-3 flex gap-1.5',\n        copy: [\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-200 hover:text-gray-500',\n          'dark:hover:bg-gray-800 dark:hover:text-white text-gray-400'\n        ].join(' '),\n        upvote:\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-700/40 hover:text-white text-gray-400',\n        downvote:\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-700/40 hover:text-white text-gray-400',\n        refresh:\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-700/40 hover:text-white text-gray-400'\n      }\n    }\n  },\n  input: {\n    base: 'flex mt-4 relative',\n    upload: ['px-5 py-2 text-gray-400 size-10', 'dark:gray-500'].join(' '),\n    input: [\n      'w-full border rounded-3xl px-3 py-2 pr-16 text-gray-500 border-gray-200 hover:bg-blue-100 hover:border-blue-500 after:hidden after:mx-10! bg-white [&>textarea]:w-full [&>textarea]:flex-none',\n      'dark:border-gray-700/50 dark:text-gray-200 dark:bg-gray-950 dark:hover:bg-blue-950/40'\n    ].join(' '),\n    actions: {\n      base: 'absolute flex gap-2 items-center right-5 inset-y-1/2 -translate-y-1/2 z-10',\n      send: [\n        'px-3 py-3 hover:bg-primary-hover rounded-full bg-gray-200 hover:bg-gray-300 text-gray-500',\n        'dark:text-white light:text-gray-500 dark:bg-gray-800 dark:hover:bg-gray-700'\n      ].join(' '),\n      stop: 'px-2 py-2 bg-red-500 text-white rounded-full hover:bg-red-700 '\n    }\n  }\n}"
+        },
         "description": "Custom theme for the chat.",
         "name": "theme",
         "parent": {
@@ -324,7 +326,9 @@
         }
       },
       "theme": {
-        "defaultValue": null,
+        "defaultValue": {
+          "value": "{\n  base: 'dark:text-white text-gray-500',\n  console: 'flex w-full gap-4 h-full',\n  companion: 'w-full h-full overflow-hidden',\n  empty: 'text-center flex-1',\n  appbar: 'flex p-5',\n  sessions: {\n    base: 'overflow-auto',\n    console:\n      'min-w-[150px] w-[30%] max-w-[300px] dark:bg-[#11111F] bg-[#F2F3F7] p-5 rounded-3xl',\n    companion: 'w-full h-full',\n    group:\n      'text-xs dart:text-gray-400 text-gray-700 mt-4 hover:bg-transparent mb-1',\n    create: 'relative mb-4 rounded-[10px] text-white',\n    session: {\n      base: [\n        'group my-1 rounded-[10px] p-2 text-gray-500 border border-transparent hover:bg-gray-300 hover:border-gray-400 [&_svg]:text-gray-500',\n        'dark:text-typography dark:text-gray-400 dark:hover:bg-gray-800/50 dark:hover:border-gray-700/50 dark:[&_svg]:text-gray-200'\n      ].join(' '),\n      active: [\n        'border border-gray-300 hover:border-gray-400 text-gray-700 bg-gray-200 hover:bg-gray-300 ',\n        'dark:text-gray-500 dark:bg-gray-800/70 dark:border-gray-700/50 dark:text-white dark:border-gray-700/70 dark:hover:bg-gray-800/50',\n        '[&_button]:opacity-100!'\n      ].join(' '),\n      delete: '[&>svg]:w-4 [&>svg]:h-4 opacity-0 group-hover:opacity-50!'\n    }\n  },\n  messages: {\n    base: '',\n    console: 'flex flex-col mx-5 flex-1 overflow-hidden',\n    companion: 'flex w-full h-full',\n    back: 'self-start p-0 my-2',\n    inner: 'flex-1 h-full flex flex-col',\n    title: ['text-base font-bold text-gray-500', 'dark:text-gray-200'].join(\n      ' '\n    ),\n    date: 'text-xs whitespace-nowrap text-gray-400',\n    content: [\n      'mt-2 flex-1 overflow-auto [&_hr]:bg-gray-200',\n      'dark:[&_hr]:bg-gray-800/60'\n    ].join(' '),\n    header: 'flex justify-between items-center gap-2',\n    showMore: 'mb-4',\n    message: {\n      base: 'mt-4 mb-4 flex flex-col p-0 rounded-sm border-none bg-transparent',\n      question: [\n        'relative font-semibold mb-4 px-4 py-4 pb-2 rounded-3xl rounded-br-none text-typography border bg-gray-200 border-gray-300 text-gray-900',\n        'dark:bg-gray-900/60 dark:border-gray-700/50 dark:text-gray-100'\n      ].join(' '),\n      response: [\n        'relative data-[compact=false]:px-4 text-gray-900',\n        'dark:text-gray-100'\n      ].join(' '),\n      overlay:\n        \"overflow-y-hidden max-h-[350px] after:content-[''] after:absolute after:inset-x-0 after:bottom-0 after:h-16 after:bg-linear-to-b after:from-transparent dark:after:to-gray-900 after:to-gray-200\",\n      cursor: 'inline-block w-1 h-4 bg-current',\n      expand: 'absolute bottom-1 right-1 z-10',\n      files: {\n        base: 'mb-2 flex flex-wrap gap-3 ',\n        file: {\n          base: [\n            'flex items-center gap-2 border border-gray-300 px-3 py-2 rounded-lg cursor-pointer',\n            'dark:border-gray-700'\n          ].join(' '),\n          name: ['text-sm text-gray-500', 'dark:text-gray-200'].join(' ')\n        }\n      },\n      sources: {\n        base: 'my-4 flex flex-wrap gap-3',\n        source: {\n          base: [\n            'flex gap-2 border border-gray-200 px-4 py-2 rounded-lg cursor-pointer',\n            'dark:border-gray-700'\n          ].join(' '),\n          companion: 'flex-1 px-3 py-1.5',\n          image: 'max-w-10 max-h-10 rounded-md w-full h-fit self-center',\n          title: 'text-md block',\n          url: 'text-sm text-blue-400 underline'\n        }\n      },\n      markdown: {\n        copy: 'sticky py-1 [&>svg]:w-4 [&>svg]:h-4 opacity-50',\n        p: 'mb-2',\n        a: 'text-blue-400 underline',\n        table: 'table-auto w-full m-2',\n        th: 'px-4 py-2 text-left font-bold border-b border-gray-500',\n        td: 'px-4 py-2',\n        code: 'm-2 rounded-b relative',\n        toolbar:\n          'text-xs dark:bg-gray-700/50 flex items-center justify-between px-2 py-1 rounded-t sticky top-0 backdrop-blur-md bg-gray-200 ',\n        li: 'mb-2 ml-6',\n        ul: 'mb-4 list-disc',\n        ol: 'mb-4 list-decimal'\n      },\n      footer: {\n        base: 'mt-3 flex gap-1.5',\n        copy: [\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-200 hover:text-gray-500',\n          'dark:hover:bg-gray-800 dark:hover:text-white text-gray-400'\n        ].join(' '),\n        upvote:\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-700/40 hover:text-white text-gray-400',\n        downvote:\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-700/40 hover:text-white text-gray-400',\n        refresh:\n          'p-3 rounded-[10px] [&>svg]:w-4 [&>svg]:h-4 opacity-50 hover:opacity-100! hover:bg-gray-700/40 hover:text-white text-gray-400'\n      }\n    }\n  },\n  input: {\n    base: 'flex mt-4 relative',\n    upload: ['px-5 py-2 text-gray-400 size-10', 'dark:gray-500'].join(' '),\n    input: [\n      'w-full border rounded-3xl px-3 py-2 pr-16 text-gray-500 border-gray-200 hover:bg-blue-100 hover:border-blue-500 after:hidden after:mx-10! bg-white [&>textarea]:w-full [&>textarea]:flex-none',\n      'dark:border-gray-700/50 dark:text-gray-200 dark:bg-gray-950 dark:hover:bg-blue-950/40'\n    ].join(' '),\n    actions: {\n      base: 'absolute flex gap-2 items-center right-5 inset-y-1/2 -translate-y-1/2 z-10',\n      send: [\n        'px-3 py-3 hover:bg-primary-hover rounded-full bg-gray-200 hover:bg-gray-300 text-gray-500',\n        'dark:text-white light:text-gray-500 dark:bg-gray-800 dark:hover:bg-gray-700'\n      ].join(' '),\n      stop: 'px-2 py-2 bg-red-500 text-white rounded-full hover:bg-red-700 '\n    }\n  }\n}"
+        },
         "description": "Custom theme for the appbar",
         "name": "theme",
         "parent": {
@@ -576,6 +580,44 @@
         "type": {
           "name": "ReactElement<any, string | JSXElementConstructor<any>>"
         }
+      },
+      "message": {
+        "defaultValue": null,
+        "description": "Message to be displayed in the input field.",
+        "name": "message",
+        "parent": {
+          "fileName": "src/ChatInput/ChatInput.tsx",
+          "name": "ChatInputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/ChatInput.tsx",
+            "name": "ChatInputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "string"
+        }
+      },
+      "onMessageChange": {
+        "defaultValue": null,
+        "description": "Callback function to handle message change.",
+        "name": "onMessageChange",
+        "parent": {
+          "fileName": "src/ChatInput/ChatInput.tsx",
+          "name": "ChatInputProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/ChatInput/ChatInput.tsx",
+            "name": "ChatInputProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "(message: string) => void"
+        }
       }
     }
   },

package/dist/{index-D7d92jbn.js → index-DVFyp_Cz.js}

@@ -1,7 +1,7 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import * as React from "react";
-import { createContext, useContext, useRef, forwardRef, useState, useEffect, useImperativeHandle, lazy, useMemo, Suspense, useCallback, memo } from "react";
-import { Button, cn, Textarea, Ellipsis, DateFormat, IconButton, Card, Divider, useInfinityList, useComponentTheme, ListItem, List, ConnectedOverlay } from "reablocks";
+import { createContext, useContext, useRef, forwardRef, useState, useEffect, useImperativeHandle, useCallback, lazy, useMemo, Suspense, memo } from "react";
+import { Button, cn, Textarea, Ellipsis, DateFormat, IconButton, Card, Divider, useInfinityList, ListItem, List, ConnectedOverlay } from "reablocks";
 import { Slot } from "@radix-ui/react-slot";
 import { motion, AnimatePresence } from "motion/react";
 import ReactMarkdown from "react-markdown";
@@ -62,97 +62,125 @@ const FileInput = ({
     )
   ] });
 };
-const ChatInput = forwardRef(({
-  allowedFiles,
-  placeholder,
-  defaultValue,
-  sendIcon = /* @__PURE__ */ jsx(SvgSend, {}),
-  stopIcon = /* @__PURE__ */ jsx(SvgStop, {}),
-  attachIcon
-}, ref) => {
-  const { theme, isLoading, disabled, sendMessage, stopMessage, fileUpload, activeSessionId } = useContext(ChatContext);
-  const [message, setMessage] = useState("");
-  const inputRef = useRef(null);
-  useEffect(() => {
-    if (inputRef.current) {
-      inputRef.current.focus();
-    }
-  }, [activeSessionId, inputRef]);
-  useImperativeHandle(ref, () => ({
-    focus: () => {
-      var _a;
-      (_a = inputRef.current) == null ? void 0 : _a.focus();
-    }
-  }));
-  const handleSendMessage = () => {
-    if (message.trim()) {
-      sendMessage == null ? void 0 : sendMessage(message);
-      setMessage("");
-    }
-  };
-  const handleKeyPress = (e) => {
-    if (e.key === "Enter" && !e.shiftKey) {
-      e.preventDefault();
-      handleSendMessage();
-    }
-  };
-  const handleFileUpload = (event) => {
-    var _a;
-    const file = (_a = event.target.files) == null ? void 0 : _a[0];
-    if (file && fileUpload) {
-      fileUpload(file);
-    }
-  };
-  return /* @__PURE__ */ jsxs("div", { className: cn(theme.input.base), children: [
-    /* @__PURE__ */ jsx(
-      Textarea,
-      {
-        ref: inputRef,
-        containerClassName: cn(theme.input.input),
-        minRows: 1,
-        autoFocus: true,
-        value: message,
-        defaultValue,
-        onKeyPress: handleKeyPress,
-        placeholder,
-        disabled: isLoading || disabled,
-        onChange: (e) => setMessage(e.target.value)
+const ChatInput = forwardRef(
+  ({
+    allowedFiles,
+    placeholder,
+    defaultValue,
+    message,
+    sendIcon = /* @__PURE__ */ jsx(SvgSend, {}),
+    stopIcon = /* @__PURE__ */ jsx(SvgStop, {}),
+    attachIcon,
+    onMessageChange
+  }, ref) => {
+    const {
+      theme,
+      isLoading,
+      disabled,
+      sendMessage,
+      stopMessage,
+      fileUpload,
+      activeSessionId
+    } = useContext(ChatContext);
+    const [internalMessage, setInternalMessage] = useState("");
+    const inputRef = useRef(null);
+    useEffect(() => {
+      setInternalMessage(message || "");
+    }, [message]);
+    useEffect(() => {
+      if (inputRef.current) {
+        inputRef.current.focus();
       }
-    ),
-    /* @__PURE__ */ jsxs("div", { className: cn(theme.input.actions.base), children: [
-      (allowedFiles == null ? void 0 : allowedFiles.length) > 0 && /* @__PURE__ */ jsx(
-        FileInput,
-        {
-          allowedFiles,
-          onFileUpload: handleFileUpload,
-          isLoading,
-          disabled,
-          attachIcon
-        }
-      ),
-      isLoading && /* @__PURE__ */ jsx(
-        Button,
-        {
-          title: "Stop",
-          className: cn(theme.input.actions.stop),
-          onClick: stopMessage,
-          disabled,
-          children: stopIcon
+    }, [activeSessionId, inputRef]);
+    useImperativeHandle(ref, () => ({
+      focus: () => {
+        var _a;
+        (_a = inputRef.current) == null ? void 0 : _a.focus();
+      },
+      send: () => {
+        if (internalMessage.trim()) {
+          sendMessage == null ? void 0 : sendMessage(internalMessage);
+          setInternalMessage("");
         }
-      ),
+      }
+    }));
+    const handleSendMessage = () => {
+      if (internalMessage.trim()) {
+        sendMessage == null ? void 0 : sendMessage(internalMessage);
+        setInternalMessage("");
+      }
+    };
+    const handleKeyPress = (e) => {
+      if (e.key === "Enter" && !e.shiftKey) {
+        e.preventDefault();
+        handleSendMessage();
+      }
+    };
+    const handleFileUpload = (event) => {
+      var _a;
+      const file = (_a = event.target.files) == null ? void 0 : _a[0];
+      if (file && fileUpload) {
+        fileUpload(file);
+      }
+    };
+    const handleMessageChange = useCallback(
+      (event) => {
+        setInternalMessage(event.target.value);
+        onMessageChange == null ? void 0 : onMessageChange(event.target.value);
+      },
+      [onMessageChange]
+    );
+    return /* @__PURE__ */ jsxs("div", { className: cn(theme.input.base), children: [
       /* @__PURE__ */ jsx(
-        Button,
+        Textarea,
         {
-          title: "Send",
-          className: cn(theme.input.actions.send),
-          onClick: handleSendMessage,
+          ref: inputRef,
+          containerClassName: cn(theme.input.input),
+          minRows: 1,
+          autoFocus: true,
+          value: internalMessage,
+          defaultValue,
+          onKeyPress: handleKeyPress,
+          placeholder,
           disabled: isLoading || disabled,
-          children: sendIcon
+          onChange: handleMessageChange
         }
-      )
-    ] })
-  ] });
-});
+      ),
+      /* @__PURE__ */ jsxs("div", { className: cn(theme.input.actions.base), children: [
+        (allowedFiles == null ? void 0 : allowedFiles.length) > 0 && /* @__PURE__ */ jsx(
+          FileInput,
+          {
+            allowedFiles,
+            onFileUpload: handleFileUpload,
+            isLoading,
+            disabled,
+            attachIcon
+          }
+        ),
+        isLoading && /* @__PURE__ */ jsx(
+          Button,
+          {
+            title: "Stop",
+            className: cn(theme.input.actions.stop),
+            onClick: stopMessage,
+            disabled,
+            children: stopIcon
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            title: "Send",
+            className: cn(theme.input.actions.send),
+            onClick: handleSendMessage,
+            disabled: isLoading || disabled,
+            children: sendIcon
+          }
+        )
+      ] })
+    ] });
+  }
+);
 const SessionEmpty = ({
   children
 }) => {
@@ -1340,8 +1368,8 @@ function remarkCve() {
   }
 }
 const SvgFile = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 16, height: 16, viewBox: "0 0 16 16", fill: "currentColor", ...props }, /* @__PURE__ */ React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M2.7036 1.37034C3.04741 1.02653 3.51373 0.833374 3.99996 0.833374H9.33329H9.33331C9.47275 0.833374 9.59885 0.890449 9.68954 0.98251L13.6843 4.97722C13.7763 5.0679 13.8333 5.19398 13.8333 5.33337L13.8333 5.3379V13.3334C13.8333 13.8196 13.6401 14.2859 13.2963 14.6297C12.9525 14.9736 12.4862 15.1667 12 15.1667H3.99996C3.51373 15.1667 3.04741 14.9736 2.7036 14.6297C2.35978 14.2859 2.16663 13.8196 2.16663 13.3334V2.66671C2.16663 2.18048 2.35978 1.71416 2.7036 1.37034ZM3.99996 1.83337H8.83331V5.33337C8.83331 5.60952 9.05717 5.83337 9.33331 5.83337H12.8333V13.3334C12.8333 13.5544 12.7455 13.7663 12.5892 13.9226C12.4329 14.0789 12.221 14.1667 12 14.1667H3.99996C3.77895 14.1667 3.56698 14.0789 3.4107 13.9226C3.25442 13.7663 3.16663 13.5544 3.16663 13.3334V2.66671C3.16663 2.44569 3.25442 2.23373 3.4107 2.07745C3.56698 1.92117 3.77895 1.83337 3.99996 1.83337ZM9.83331 2.5405L12.1262 4.83337H9.83331V2.5405ZM5.33331 8.16663C5.05717 8.16663 4.83331 8.39048 4.83331 8.66663C4.83331 8.94277 5.05717 9.16663 5.33331 9.16663H10.6666C10.9428 9.16663 11.1666 8.94277 11.1666 8.66663C11.1666 8.39048 10.9428 8.16663 10.6666 8.16663H5.33331ZM4.83331 11.3334C4.83331 11.0572 5.05717 10.8334 5.33331 10.8334H10.6666C10.9428 10.8334 11.1666 11.0572 11.1666 11.3334C11.1666 11.6095 10.9428 11.8334 10.6666 11.8334H5.33331C5.05717 11.8334 4.83331 11.6095 4.83331 11.3334ZM5.33331 5.5C5.05717 5.5 4.83331 5.72386 4.83331 6C4.83331 6.27614 5.05717 6.5 5.33331 6.5H6.66665C6.94279 6.5 7.16665 6.27614 7.16665 6C7.16665 5.72386 6.94279 5.5 6.66665 5.5H5.33331Z" }));
-const DefaultFileRenderer = lazy(() => import("./DefaultFileRenderer-BQ9xzbrH.js"));
-const CSVFileRenderer = lazy(() => import("./CSVFileRenderer-fklKR5lg.js"));
+const DefaultFileRenderer = lazy(() => import("./DefaultFileRenderer-DEgyNAd4.js"));
+const CSVFileRenderer = lazy(() => import("./CSVFileRenderer-CpB8ngRc.js"));
 const ImageFileRenderer = lazy(() => import("./ImageFileRenderer-C8tVW3I8.js"));
 const PDFFileRenderer = lazy(() => import("./PDFFileRenderer-DQdFS2l6.js"));
 const FILE_TYPE_RENDERER_MAP = {
@@ -1875,14 +1903,13 @@ const Chat = ({
   onFileUpload,
   isLoading,
   activeSessionId,
-  theme: customTheme = chatTheme,
+  theme = chatTheme,
   onNewSession,
   remarkPlugins = [remarkGfm, remarkYoutube, remarkMath],
   disabled,
   style,
   className
 }) => {
-  const theme = useComponentTheme("chat", customTheme);
   const [internalActiveSessionID, setInternalActiveSessionID] = useState(activeSessionId);
   const { width, observe } = useDimensions();
   const isCompact = viewType === "companion" || width && width < 767;
@@ -2160,11 +2187,7 @@ const SessionGroups = ({ children }) => {
   const groups = useMemo(() => groupSessionsByDate(sessions), [sessions]);
   return /* @__PURE__ */ jsx(Fragment, { children: children ? children(groups) : groups.map(({ heading, sessions: sessions2 }) => /* @__PURE__ */ jsx(SessionsGroup, { heading, children: sessions2.map((session) => /* @__PURE__ */ jsx(SessionListItem, { session }, session.id)) })) });
 };
-const AppBar = ({
-  content,
-  theme: customTheme = chatTheme
-}) => {
-  const theme = useComponentTheme("chat", customTheme);
+const AppBar = ({ content, theme = chatTheme }) => {
   return /* @__PURE__ */ jsx("div", { className: cn(theme.appbar), children: content });
 };
 const ChatBubble = memo(
@@ -2238,4 +2261,4 @@ export {
   light as y,
   ChatContext as z
 };
-//# sourceMappingURL=index-D7d92jbn.js.map
+//# sourceMappingURL=index-DVFyp_Cz.js.map