From e0225443f30ace79ef7eae6f00b7013fedac4daf Mon Sep 17 00:00:00 2001
From: Ilya Marozau <girilliamor@outlook.com>
Date: Mon, 6 Jan 2025 12:07:04 +0100
Subject: [PATCH 1/2] feat(multiline-text-field): pass maxRows props to the
 MultilineTextInput component

---
 .changeset/tall-foxes-smile.md                           | 5 +++++
 .../components/fields/multiline-text-field/README.md     | 1 +
 .../multiline-text-field/src/multiline-text-field.tsx    | 6 ++++++
 .../src/multiline-text-field.visualroute.jsx             | 9 +++++++++
 4 files changed, 21 insertions(+)
 create mode 100644 .changeset/tall-foxes-smile.md

diff --git a/.changeset/tall-foxes-smile.md b/.changeset/tall-foxes-smile.md
new file mode 100644
index 0000000000..cfc2e08814
--- /dev/null
+++ b/.changeset/tall-foxes-smile.md
@@ -0,0 +1,5 @@
+---
+'@commercetools-uikit/multiline-text-field': major
+---
+
+Adds `maxRows` prop to MultilineTextField.
diff --git a/packages/components/fields/multiline-text-field/README.md b/packages/components/fields/multiline-text-field/README.md
index 71f285c893..cfac24aa89 100644
--- a/packages/components/fields/multiline-text-field/README.md
+++ b/packages/components/fields/multiline-text-field/README.md
@@ -72,6 +72,7 @@ export default Example;
 | `onInfoButtonClick`          | `Function`<br/>[See signature.](#signature-onInfoButtonClick)                                |          |           | Function called when info button is pressed.&#xA;<br />&#xA;Info button will only be visible when this prop is passed.                                                                                                                                                |
 | `hintIcon`                   | `ReactElement`                                                                               |          |           | Icon to be displayed beside the hint text.&#xA;<br />&#xA;Will only get rendered when `hint` is passed as well.                                                                                                                                                       |
 | `badge`                      | `string`                                                                                     |          |           | Badge to be displayed beside the label.&#xA;<br />&#xA;Might be used to display additional information about the content of the field (E.g verified email)                                                                                                            |
+| `maxRows`                    | `number`                                                                                     |          |           | Set this to value to determine the maximum text rows of the text area.&#xA;Any text overflow past this row number would implement a scroll                                                                                                                            |
 
 ## Signatures
 
diff --git a/packages/components/fields/multiline-text-field/src/multiline-text-field.tsx b/packages/components/fields/multiline-text-field/src/multiline-text-field.tsx
index 4b9b645654..5a5ac8f682 100644
--- a/packages/components/fields/multiline-text-field/src/multiline-text-field.tsx
+++ b/packages/components/fields/multiline-text-field/src/multiline-text-field.tsx
@@ -157,6 +157,11 @@ export type TMultiTextFieldProps = {
    * Might be used to display additional information about the content of the field (E.g verified email)
    */
   badge?: string;
+  /**
+   * Set this to value to determine the maximum text rows of the text area.
+   * Any text overflow past this row number would implement a scroll
+   */
+  maxRows?: number;
 };
 
 type TState = {
@@ -253,6 +258,7 @@ class MultilineTextField extends Component<TMultiTextFieldProps, TState> {
             hasWarning={hasWarning}
             placeholder={this.props.placeholder}
             horizontalConstraint="scale"
+            maxRows={this.props.maxRows}
             {...filterDataAttributes(this.props)}
             aria-invalid={hasError}
             aria-errormessage={errorsContainerId}
diff --git a/packages/components/fields/multiline-text-field/src/multiline-text-field.visualroute.jsx b/packages/components/fields/multiline-text-field/src/multiline-text-field.visualroute.jsx
index 19ee863607..38e110c800 100644
--- a/packages/components/fields/multiline-text-field/src/multiline-text-field.visualroute.jsx
+++ b/packages/components/fields/multiline-text-field/src/multiline-text-field.visualroute.jsx
@@ -93,6 +93,15 @@ export const component = () => (
         renderWarning={() => 'Custom warning'}
       />
     </Spec>
+    <Spec label="with max rows">
+      <MultilineTextField
+        title="Welcome Text"
+        value={value}
+        onChange={() => {}}
+        horizontalConstraint={7}
+        maxRows={3}
+      />
+    </Spec>
     {/* <Spec label="when expanded by default">
       <MultilineTextField
         title="Welcome Text"

From 59d4a928db495455b05cd4ad04c85c07c7c08d63 Mon Sep 17 00:00:00 2001
From: Ilya Marozau <girilliamor@outlook.com>
Date: Mon, 6 Jan 2025 12:15:10 +0100
Subject: [PATCH 2/2] chore: change changeset type to patch

---
 .changeset/tall-foxes-smile.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.changeset/tall-foxes-smile.md b/.changeset/tall-foxes-smile.md
index cfc2e08814..de2df28d41 100644
--- a/.changeset/tall-foxes-smile.md
+++ b/.changeset/tall-foxes-smile.md
@@ -1,5 +1,5 @@
 ---
-'@commercetools-uikit/multiline-text-field': major
+'@commercetools-uikit/multiline-text-field': patch
 ---
 
 Adds `maxRows` prop to MultilineTextField.