diff --git a/.changeset/tall-foxes-smile.md b/.changeset/tall-foxes-smile.md
new file mode 100644
index 0000000000..de2df28d41
--- /dev/null
+++ b/.changeset/tall-foxes-smile.md
@@ -0,0 +1,5 @@
+---
+'@commercetools-uikit/multiline-text-field': patch
+---
+
+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`
[See signature.](#signature-onInfoButtonClick) | | | Function called when info button is pressed.
Info button will only be visible when this prop is passed. |
| `hintIcon` | `ReactElement` | | | Icon to be displayed beside the hint text.
Will only get rendered when `hint` is passed as well. |
| `badge` | `string` | | | Badge to be displayed beside the label.
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.
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 {
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'}
/>
+
+ {}}
+ horizontalConstraint={7}
+ maxRows={3}
+ />
+
{/*