From 6946c2dfecaf0788c7971cf372f9838b03acfc32 Mon Sep 17 00:00:00 2001
From: Benjamin Canac <canacb1@gmail.com>
Date: Thu, 21 Mar 2024 18:41:28 +0100
Subject: [PATCH] playground(collapsible): handle `trailingIcon` differently

---
 playground/pages/collapsible.vue | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/playground/pages/collapsible.vue b/playground/pages/collapsible.vue
index 1c6f5db4..1dd9bb54 100644
--- a/playground/pages/collapsible.vue
+++ b/playground/pages/collapsible.vue
@@ -1,10 +1,13 @@
 <template>
   <UCollapsible class="space-y-2 w-48">
-    <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-transform duration-200" />
-      </template>
-    </UButton>
+    <UButton
+      class="group"
+      trailing-icon="i-heroicons-chevron-right-20-solid"
+      color="gray"
+      label="Open"
+      block
+      :ui="{ trailingIcon: 'group-data-[state=open]:rotate-90 transition-transform duration-200' }"
+    />
 
     <template #content>
       <Placeholder class="h-24 w-full" />