@veracity/vui 2.26.0-beta.5 → 2.26.0-beta.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veracity/vui",
-  "version": "2.26.0-beta.5",
+  "version": "2.26.0-beta.6",
   "description": "Veracity UI is a React component library crafted for use within Veracity applications and pages. Based on Styled Components and @xstyled.",
   "module": "./dist/esm/index.js",
   "main": "./dist/cjs/index.js",

package/src/chat/chat.tsx

@@ -18,6 +18,7 @@ export const Chat = vui<'div', ChatProps>((props, ref) => {
     inputStatus = ChatInputStatus.Default,
     messages,
     helpText,
+    maxTextareaHeight = 120,
     processingMessage,
     suggestions,
     onNewTopicClick,
@@ -67,6 +68,7 @@ export const Chat = vui<'div', ChatProps>((props, ref) => {
         )}
         <ChatInput
           helpText={helpText}
+          maxTextareaHeight={maxTextareaHeight}
           onNewTopicClick={onNewTopicClick}
           onSend={onSend}
           onStop={onStop}

package/src/chat/chat.types.ts

@@ -1,4 +1,3 @@
-import { AvatarProps } from '../avatar'
 import { BoxProps } from '../box'
 import { ButtonProps } from '../button'
 import { MessageProps } from '../message'
@@ -12,45 +11,52 @@ export enum ChatInputStatus {
 
 export type ChatProps = Omit<BoxProps, 'size' | 'variant'> &
   ThemingProps<'Chat'> & {
-    // Status of the chat input @default 'default'
+    /** Status of the chat input @default 'default' */
     inputStatus?: ChatInputStatus
-    // An array of chat messages
-    messages?: ChatMessageProps[]
-    // Optional string indicating a help text
+    /** An array of chat messages */
+    messages?: MessageProps[]
+    /** Optional string indicating a help text */
     helpText?: string
-    // Optional string indicating a message being processed
+    /** Max height for the textarea @default 120 */
+    maxTextareaHeight?: number
+    /** Optional string indicating a message being processed */
     processingMessage?: string
-    // An array of suggestion strings
+    /** An array of suggestion strings */
     suggestions?: string[]
-    // Callback function for when a new topic is clicked
+    /** Callback function for when a new topic is clicked */
     onNewTopicClick?: () => void
-    // Callback function for when a suggestion is clicked
+    /** Callback function for when a suggestion is clicked */
     onSuggestionClick?: (suggestion: string) => void
-    // Optional callback function for sending a message
+    /** Optional callback function for sending a message */
     onSend?: (message: string) => void
-    // Optional callback function for stopping an action
+    /** Optional callback function for stopping an action */
     onStop?: () => void
   }
 
 export type ChatInputProps = Omit<BoxProps, 'size' | 'variant'> & {
+  /** Placeholder text for the input */
   placeholder?: string
+  /** Status of the chat input */
   status?: ChatInputStatus
+  /** Optional string indicating a help text */
   helpText?: string
-  /** @default 120 */
+  /** Max height for the textarea @default 120 */
   maxTextareaHeight?: number
   /** @default 'Generating message' */
   processingMessage?: string
+  /** Callback function for when a new topic is clicked */
   onNewTopicClick?: () => void
+  /** Optional callback function for sending a message */
   onSend?: (message: string) => void
+  /** Optional callback function for stopping an action */
   onStop?: () => void
 }
 
 export type ChatInputButtonProps = Omit<ButtonProps, 'size'> & {
+  /** Status of the chat input */
   status?: ChatInputStatus
+  /** Callback function for sending a message */
   onSend?: () => void
+  /** Callback function for stopping an action */
   onStop?: () => void
 }
-
-export type ChatMessageProps = MessageProps & {
-  avatar?: AvatarProps
-}

package/src/chat/chatMessage.tsx

@@ -1,8 +1,7 @@
 import { AvatarProps } from '../avatar'
 import { useStyleConfig, vui } from '../core'
-import Message from '../message'
+import Message, { MessageProps } from '../message'
 import { cs } from '../utils'
-import { ChatMessageProps } from './chat.types'
 
 const defaultAvatar: AvatarProps = {
   variant: 'solidDarkBlue',
@@ -12,7 +11,7 @@ const defaultAvatar: AvatarProps = {
 /**
  * Displays a chat interface with messages and actions.
  */
-export const ChatMessage = vui<'div', ChatMessageProps>((props, ref) => {
+export const ChatMessage = vui<'div', MessageProps>((props, ref) => {
   const styles = useStyleConfig('Chat', props)
   const { avatar = defaultAvatar, ...rest } = props
 

package/src/chat/theme.ts

@@ -1,8 +1,7 @@
 const baseStyle = {
   chat: { flexDirection: 'column', w: '100%', height: '100%' },
-  messages: { flexDirection: 'column', overflowY: 'auto' },
+  messages: { flexDirection: 'column', overflowY: 'auto', position: 'relative', w: '100%' },
   suggestions: { display: 'block', textAlign: 'right', width: '100%' },
-  input: {},
 }
 
 const defaultProps = {}