docs: use new prose component Tabs (#920)

docs/content/2.elements/11.meter.md

@@ -165,14 +165,14 @@ The `label` slot can be used to change how the label below the meter bar is show
 
 ## Props
 
-:component-props
-
-:u-divider{label="MeterGroup" type="dashed" class="my-12"}
-
-:component-props{slug="UMeterGroup"}
+::tabs
+  :component-props{label="Meter"}
+  :component-props{label="MeterGroup" slug="UMeterGroup"}
+::
 
 ## Config
 
-:component-preset
-
-:component-preset{slug="MeterGroup"}
+::tabs
+  :component-preset{label="Meter"}
+  :component-preset{label="MeterGroup" slug="MeterGroup"}
+::

docs/content/2.elements/3.avatar.md

@@ -109,14 +109,14 @@ code: |
 
 ## Props
 
-:component-props
-
-:u-divider{label="AvatarGroup" type="dashed" class="my-12"}
-
-:component-props{slug="UAvatarGroup"}
+::tabs
+  :component-props{label="Avatar"}
+  :component-props{label="AvatarGroup" slug="UAvatarGroup"}
+::
 
 ## Config
 
-:component-preset
-
-:component-preset{slug="AvatarGroup"}
+::tabs
+  :component-preset{label="Avatar"}
+  :component-preset{label="AvatarGroup" slug="AvatarGroup"}
+::

docs/content/2.elements/5.button.md

@@ -371,14 +371,14 @@ excludedProps:
 
 ## Props
 
-:component-props
-
-:u-divider{label="ButtonGroup" type="dashed" class="my-12"}
-
-:component-props{slug="UButtonGroup"}
+::tabs
+  :component-props{label="Button"}
+  :component-props{label="ButtonGroup" slug="UButtonGroup"}
+::
 
 ## Config
 
-:component-preset
-
-:component-preset{slug="ButtonGroup"}
+::tabs
+  :component-preset{label="Button"}
+  :component-preset{label="ButtonGroup" slug="ButtonGroup"}
+::