arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-27 18:30:35 +01:00
Code Issues Packages Projects Releases Wiki Activity

playground(collapsible): use #trailing slot

Browse Source
This commit is contained in:
Benjamin Canac
2024-03-13 12:27:24 +01:00
parent 959b1295f2
commit e07088068f
1 changed files with 6 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
playground/pages/collapsible.vue
View File

@@ -1,16 +1,13 @@
<template> <template>
<UCollapsible class="space-y-2 w-48"> <UCollapsible class="space-y-2 w-48">
<UButton <UButton class="group" color="gray" label="Open" block>
class="group" <template #trailing="trailingProps">
color="gray" <UIcon name="i-heroicons-chevron-right-20-solid" :class="trailingProps.class" class="group-data-[state=open]:rotate-90 transition duration-200" />
label="Open" </template>
block </UButton>
trailing-icon="i-heroicons-chevron-right-20-solid"
:ui="{ trailingIcon: 'group-data-[state=open]:rotate-90 transition' }"
/>
<template #content> <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> </template>
</UCollapsible> </UCollapsible>
</template> </template>