merge tw-Classes from Textarea props using twMerge

creativetimofficial · Nov 7, 2023 · 994a6ea · 994a6ea
1 parent 8666902
commit 994a6ea
Showing 1 changed file with 26 additions and 18 deletions.
diff --git a/packages/material-tailwind-react/src/components/Textarea/index.tsx b/packages/material-tailwind-react/src/components/Textarea/index.tsx
@@ -3,6 +3,7 @@ import PropTypes from "prop-types";
 
 // utils
 import classnames from "classnames";
+import { twMerge } from "tailwind-merge";
 import findMatch from "../../utils/findMatch";
 import objectsToString from "../../utils/objectsToString";
 
@@ -98,26 +99,33 @@ export const Textarea = React.forwardRef<HTMLDivElement, TextareaProps>(
     const labelColor = objectsToString(
       textareaVariant.colors.label[findMatch(valid.colors, color, "gray")],
     );
-    const containerClasses = classnames(objectsToString(base.container), containerProps?.className);
-    const textareaClasses = classnames(
-      objectsToString(base.textarea),
-      objectsToString(textareaVariant.base.textarea),
-      objectsToString(textareaVariant.sizes[findMatch(valid.sizes, size, "md")].textarea),
-      { [textareaColor]: !error && !success },
-      { [textareaError]: error },
-      { [textareaSuccess]: success },
-      { [textareaShrink]: shrink },
-      !resize ? "!resize-none" : "",
+    const containerClasses = twMerge(
+      classnames(objectsToString(base.container)),
+      containerProps?.className,
+    );
+    const textareaClasses = twMerge(
+      classnames(
+        objectsToString(base.textarea),
+        objectsToString(textareaVariant.base.textarea),
+        objectsToString(textareaVariant.sizes[findMatch(valid.sizes, size, "md")].textarea),
+        { [textareaColor]: !error && !success },
+        { [textareaError]: error },
+        { [textareaSuccess]: success },
+        { [textareaShrink]: shrink },
+        !resize ? "!resize-none" : "",
+      ),
       className,
     );
-    const labelClasses = classnames(
-      objectsToString(base.label),
-      objectsToString(textareaVariant.base.label),
-      objectsToString(textareaVariant.sizes[findMatch(valid.sizes, size, "md")].label),
-      { [labelColor]: !error && !success },
-      { [labelError]: error },
-      { [labelSuccess]: success },
-      { [labelShrink]: shrink },
+    const labelClasses = twMerge(
+      classnames(
+        objectsToString(base.label),
+        objectsToString(textareaVariant.base.label),
+        objectsToString(textareaVariant.sizes[findMatch(valid.sizes, size, "md")].label),
+        { [labelColor]: !error && !success },
+        { [labelError]: error },
+        { [labelSuccess]: success },
+        { [labelShrink]: shrink },
+      ),
       labelProps?.className,
     );