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

chore(Collapsible): update

Browse Source
This commit is contained in:
Benjamin Canac
2024-03-11 17:38:56 +01:00
parent 037a2fc8fa
commit 83f311a004
2 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/runtime/components/Collapsible.vue
View File

@@ -32,13 +32,13 @@ const props = defineProps<CollapsibleProps>()
const emits = defineEmits<CollapsibleEmits>()
defineSlots<CollapsibleSlots>()
const forward = useForwardPropsEmits(reactivePick(props, 'as', 'defaultOpen', 'open', 'disabled'), emits)
const rootProps = useForwardPropsEmits(reactivePick(props, 'as', 'defaultOpen', 'open', 'disabled'), emits)
const ui = computed(() => tv({ extend: collapsible, slots: props.ui })())
</script>
<template>
<CollapsibleRoot v-bind="forward" :class="ui.root({ class: props.class })">
<CollapsibleRoot v-bind="rootProps" :class="ui.root({ class: props.class })">
<CollapsibleTrigger as-child>
<slot />
</CollapsibleTrigger>
@@ -52,7 +52,7 @@ const ui = computed(() => tv({ extend: collapsible, slots: props.ui })())
</template>
<style>
@keyframes collapsibleSlideDown {
@keyframes collapsible-down {
from {
height: 0;
}
@@ -61,7 +61,7 @@ const ui = computed(() => tv({ extend: collapsible, slots: props.ui })())
}
}
@keyframes collapsibleSlideUp {
@keyframes collapsible-up {
from {
height: var(--radix-collapsible-content-height);
}

2
src/theme/collapsible.ts
View File

@@ -1,6 +1,6 @@
export default {
slots: {
root: '',
content: 'data-[state=open]:animate-[collapsibleSlideDown_200ms_ease-out] data-[state=closed]:animate-[collapsibleSlideUp_200ms_ease-out] overflow-hidden'
content: 'data-[state=open]:animate-[collapsible-down_200ms_ease-out] data-[state=closed]:animate-[collapsible-up_200ms_ease-out] overflow-hidden'
}
}