<script setup lang="ts">
import { cn } from '@/lib/utils';
import { Button } from '@/components/core/button';
import { useSidebar } from './utils';
import UiIcon from '@/components/UiIcon/UiIcon.vue';

defineOptions({ inheritAttrs: false });

const { toggleSidebar } = useSidebar();
</script>

<template>
  <Button
    v-bind="$attrs"
    data-sidebar="trigger"
    data-slot="sidebar-trigger"
    variant="ghost"
    size="icon-sm"
    aria-label="Toggle Sidebar"
    :class="cn('h-8 w-8', $attrs.class ?? '')"
    @click="toggleSidebar"
  >
    <UiIcon name="panel-left" />
  </Button>
</template>
