From e07088068f56fc4ec0fbad78d9aa8059c4cbabbd Mon Sep 17 00:00:00 2001
From: Benjamin Canac <canacb1@gmail.com>
Date: Wed, 13 Mar 2024 12:27:24 +0100
Subject: [PATCH] playground(collapsible): use `#trailing` slot

---
 playground/pages/collapsible.vue | 15 ++++++---------
 1 file changed, 6 insertions(+), 9 deletions(-)

diff --git a/playground/pages/collapsible.vue b/playground/pages/collapsible.vue
index e6d13181..f91ca397 100644
--- a/playground/pages/collapsible.vue
+++ b/playground/pages/collapsible.vue
@@ -1,16 +1,13 @@
 <template>
   <UCollapsible class="space-y-2 w-48">
-    <UButton
-      class="group"
-      color="gray"
-      label="Open"
-      block
-      trailing-icon="i-heroicons-chevron-right-20-solid"
-      :ui="{ trailingIcon: 'group-data-[state=open]:rotate-90 transition' }"
-    />
+    <UButton class="group" color="gray" label="Open" block>
+      <template #trailing="trailingProps">
+        <UIcon name="i-heroicons-chevron-right-20-solid" :class="trailingProps.class" class="group-data-[state=open]:rotate-90 transition duration-200" />
+      </template>
+    </UButton>
 
     <template #content>
-      <div class="bg-primary-500 dark:bg-primary-400 h-12 w-full" />
+      <div class="bg-primary-500 dark:bg-primary-400 rounded-md h-12 w-full" />
     </template>
   </UCollapsible>
 </template>
\ No newline at end of file