fix: allow to pass minRows prop to MessageInput (#2411)

GetStream · Jun 12, 2024 · e6bfd40 · e6bfd40
1 parent 46968a6
commit e6bfd40
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 1 deletion.
diff --git a/docusaurus/docs/React/components/contexts/message-input-context.mdx b/docusaurus/docs/React/components/contexts/message-input-context.mdx
@@ -350,6 +350,14 @@ If provided, the existing message will be edited on submit.
 | ------ |
 | object |
 
+### minRows
+
+Min number of rows the underlying `textarea` will start with. The [`grow`](./#grow) on MessageInput prop has to be enabled for `minRows` to take effect.
+
+| Type   | Default |
+| ------ | ------- |
+| number | 1       |
+
 ### noFiles
 
 If true, disables file uploads for all attachments except for those with type 'image'.

diff --git a/docusaurus/docs/React/components/message-input-components/message-input.mdx b/docusaurus/docs/React/components/message-input-components/message-input.mdx
@@ -128,7 +128,7 @@ If true, expands the text input vertically for new lines.
 Allows to hide MessageInput's send button. Used by `MessageSimple` to hide the send button in `EditMessageForm`.
 
 | Type    | Default |
-|---------|---------|
+| ------- | ------- |
 | boolean | false   |
 
 ### Input
@@ -171,6 +171,14 @@ If provided, the existing message will be edited on submit.
 | ------ |
 | object |
 
+### minRows
+
+Min number of rows the underlying `textarea` will start with. The [`grow`](./#grow) on MessageInput prop has to be enabled for `minRows` to take effect.
+
+| Type   | Default |
+| ------ | ------- |
+| number | 1       |
+
 ### noFiles
 
 If true, disables file uploads for all attachments except for those with type 'image'.

diff --git a/src/components/ChatAutoComplete/ChatAutoComplete.tsx b/src/components/ChatAutoComplete/ChatAutoComplete.tsx
@@ -181,6 +181,7 @@ const UnMemoizedChatAutoComplete = <
       loadingComponent={LoadingIndicator}
       maxRows={messageInput.maxRows}
       minChar={0}
+      minRows={messageInput.minRows}
       onBlur={props.onBlur}
       onChange={props.onChange || messageInput.handleChange}
       onFocus={props.onFocus}

diff --git a/src/components/MessageInput/MessageInput.tsx b/src/components/MessageInput/MessageInput.tsx
@@ -94,6 +94,8 @@ export type MessageInputProps<
   mentionQueryParams?: SearchQueryParams<StreamChatGenerics>['userFilters'];
   /** If provided, the existing message will be edited on submit */
   message?: StreamMessage<StreamChatGenerics>;
+  /** Min number of rows the underlying `textarea` will start with. The `grow` on MessageInput prop has to be enabled for `minRows` to take effect. */
+  minRows?: number;
   /** If true, disables file uploads for all attachments except for those with type 'image'. Default: false */
   noFiles?: boolean;
   /** Function to override the default submit handler */

diff --git a/src/components/MessageInput/hooks/useCreateMessageInputContext.ts b/src/components/MessageInput/hooks/useCreateMessageInputContext.ts
@@ -47,6 +47,7 @@ export const useCreateMessageInputContext = <
     mentioned_users,
     mentionQueryParams,
     message,
+    minRows,
     noFiles,
     numberOfUploads,
     onPaste,
@@ -127,6 +128,7 @@ export const useCreateMessageInputContext = <
       mentioned_users,
       mentionQueryParams,
       message,
+      minRows,
       noFiles,
       numberOfUploads,
       onPaste,
@@ -172,6 +174,7 @@ export const useCreateMessageInputContext = <
       isUploadEnabled,
       linkPreviewsValue,
       mentionedUsersLength,
+      minRows,
       parentId,
       publishTypingEvent,
       recordingController,