From 1e6346b59cac7cbc0f458f4a499daf486f6e89a4 Mon Sep 17 00:00:00 2001
From: Dany Castillo <31006608+dcastil@users.noreply.github.com>
Date: Sun, 20 Aug 2023 11:50:02 +0200
Subject: [PATCH] adjust docs to mergeConfigs usage

---
 docs/api-reference.md   | 16 +++++++++++-----
 docs/writing-plugins.md |  6 ++++--
 2 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/docs/api-reference.md b/docs/api-reference.md
index ff0d41f0..7ec6fc26 100644
--- a/docs/api-reference.md
+++ b/docs/api-reference.md
@@ -200,16 +200,22 @@ But don't merge configs like that. Use [`mergeConfigs`](#mergeconfigs) instead.
 function mergeConfigs(baseConfig: Config, configExtension: Partial<Config>): Config
 ```
 
-Helper function to merge multiple config objects. Objects are merged, arrays are concatenated, scalar values are overridden and `undefined` does nothing. The function assumes that both parameters are tailwind-merge config objects and shouldn't be used as a generic merge function.
+Helper function to merge multiple tailwind-merge configs. Properties with the value `undefined` are skipped.
 
 ```ts
 const customTwMerge = createTailwindMerge(getDefaultConfig, (config) =>
     mergeConfigs(config, {
-        classGroups: {
-            // ↓ Adding new class group
-            mySpecialClassGroup: [{ special: ['1', '2'] }],
+        override: {
+            classGroups: {
+                // ↓ Overriding existing class group
+                shadow: [{ shadow: ['100', '200', '300', '400', '500'] }],
+            },
+        }
+        extend: {
             // ↓ Adding value to existing class group
-            animate: ['animate-magic'],
+            animate: ['animate-shimmer'],
+            // ↓ Adding new class group
+            prose: [{ prose: ['', validators.isTshirtSize] }],
         },
     }),
 )
diff --git a/docs/writing-plugins.md b/docs/writing-plugins.md
index 1d00dae5..cf452a39 100644
--- a/docs/writing-plugins.md
+++ b/docs/writing-plugins.md
@@ -14,8 +14,10 @@ import { mergeConfigs, validators, Config } from 'tailwind-merge'
 
 export function withMagic(config: Config): Config {
     return mergeConfigs(config, {
-        classGroups: {
-            'magic.my-group': [{ magic: [validators.isLength, 'wow'] }],
+        extend: {
+            classGroups: {
+                'magic.my-group': [{ magic: [validators.isLength, 'wow'] }],
+            },
         },
     })
 }