<script setup lang="ts">
import { computed, useAttrs } from 'vue';
import { cn, omitClass } from '@/lib/utils';

defineOptions({ inheritAttrs: false });

const attrs = useAttrs();
const passthroughAttrs = computed(() =>
  omitClass(attrs as Record<string, unknown>),
);
const attrClass = computed(() => (attrs.class as string | undefined) ?? '');
</script>

<template>
  <ul
    v-bind="passthroughAttrs"
    data-slot="sidebar-menu"
    data-sidebar="menu"
    :class="
      cn(
        'flex w-full min-w-0 flex-col gap-1 group-data-[collapsible=icon]:items-center',
        attrClass,
      )
    "
  >
    <slot />
  </ul>
</template>
