You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

31 lines
729 B
Vue

<script setup lang="ts">
import { SidebarProvider } from '@/components/ui/sidebar';
import { onMounted, ref } from 'vue';
interface Props {
variant?: 'header' | 'sidebar';
}
defineProps<Props>();
const isOpen = ref(true);
onMounted(() => {
isOpen.value = localStorage.getItem('sidebar') !== 'false';
});
const handleSidebarChange = (open: boolean) => {
isOpen.value = open;
localStorage.setItem('sidebar', String(open));
};
</script>
<template>
<div v-if="variant === 'header'" class="flex min-h-screen w-full flex-col">
<slot />
</div>
<SidebarProvider v-else :default-open="isOpen" :open="isOpen" @update:open="handleSidebarChange">
<slot />
</SidebarProvider>
</template>