feat(Badge): handle icon and avatar props (#2497)

Co-authored-by: Benjamin Canac <canacb1@gmail.com>

docs/content/3.components/badge.md

@@ -68,6 +68,54 @@ slots:
 ---
 ::
 
+### Icon
+
+Use the `icon` prop to show an [Icon](/components/icon) inside the Badge.
+
+::component-code
+---
+props:
+  icon: i-heroicons-rocket-launch
+  size: md
+  color: primary
+  variant: solid
+slots:
+  default: Badge
+---
+::
+
+Use the `leading` and `trailing` props to set the icon position or the `leading-icon` and `trailing-icon` props to set a different icon for each position.
+
+::component-code
+---
+props:
+  trailingIcon: i-heroicons-arrow-right
+  size: md
+slots:
+  default: Badge
+---
+::
+
+### Avatar
+
+Use the `avatar` prop to show an [Avatar](/components/avatar) inside the Badge.
+
+::component-code
+---
+prettier: true
+props:
+  avatar:
+    src: 'https://github.com/nuxt.png'
+  size: md
+  color: neutral
+  variant: outline
+slots:
+  default: |
+
+    Badge
+---
+::
+
 ## Examples
 
 ### `class` prop