docs(button-group): update

docs/app/components/content/examples/avatar-group/AvatarGroupChipExample.vue

@@ -6,12 +6,14 @@
         alt="Benjamin Canac"
       />
     </UChip>
+
     <UChip inset color="amber">
       <UAvatar
         src="https://avatars.githubusercontent.com/u/25613751?v=4"
         alt="Romain Hamel"
       />
     </UChip>
+
     <UChip inset color="red">
       <UAvatar
         src="https://avatars.githubusercontent.com/u/19751938?v=4"

docs/app/components/content/examples/avatar-group/AvatarGroupLinkExample.vue

@@ -11,6 +11,7 @@
         alt="Benjamin Canac"
       />
     </ULink>
+
     <ULink
       to="https://github.com/romhml"
       target="_blank"
@@ -22,6 +23,7 @@
         alt="Romain Hamel"
       />
     </ULink>
+
     <ULink
       to="https://github.com/noook"
       target="_blank"

docs/app/components/content/examples/avatar-group/AvatarGroupTooltipExample.vue

@@ -6,12 +6,14 @@
         alt="Benjamin Canac"
       />
     </UTooltip>
+
     <UTooltip text="romhml">
       <UAvatar
         src="https://avatars.githubusercontent.com/u/25613751?v=4"
         alt="Romain Hamel"
       />
     </UTooltip>
+
     <UTooltip text="noook">
       <UAvatar
         src="https://avatars.githubusercontent.com/u/19751938?v=4"

docs/app/components/content/examples/button-group/ButtonGroupDropdownExample.vue

@@ -0,0 +1,33 @@
+<script setup lang="ts">
+const items = [{
+  label: 'Team',
+  icon: 'i-heroicons-users'
+}, {
+  label: 'Invite users',
+  icon: 'i-heroicons-user-plus',
+  children: [{
+    label: 'Invite by email',
+    icon: 'i-heroicons-paper-airplane'
+  }, {
+    label: 'Invite by link',
+    icon: 'i-heroicons-link'
+  }]
+}, {
+  label: 'New team',
+  icon: 'i-heroicons-plus'
+}]
+</script>
+
+<template>
+  <UButtonGroup>
+    <UButton color="gray" variant="subtle" label="Settings" />
+
+    <UDropdownMenu :items="items">
+      <UButton
+        color="gray"
+        variant="outline"
+        icon="i-heroicons-chevron-down-20-solid"
+      />
+    </UDropdownMenu>
+  </UButtonGroup>
+</template>

docs/app/components/content/examples/button-group/ButtonGroupTooltipExample.vue

@@ -0,0 +1,13 @@
+<template>
+  <UButtonGroup>
+    <UInput color="gray" variant="outline" placeholder="Enter token" />
+
+    <UTooltip text="Copy to clipboard">
+      <UButton
+        color="gray"
+        variant="subtle"
+        icon="i-heroicons-clipboard-document"
+      />
+    </UTooltip>
+  </UButtonGroup>
+</template>