2025-12-20 12:44:59 +01:00
|
|
|
<script lang="ts">
|
|
|
|
|
import { NavigationMenu as NavigationMenuPrimitive } from 'bits-ui';
|
|
|
|
|
import { cn } from '../../tools';
|
|
|
|
|
|
|
|
|
|
let { ref = $bindable(null), class: className, ...restProps }: NavigationMenuPrimitive.ViewportProps = $props();
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<div class={cn('ui:absolute ui:start-0 ui:top-full ui:isolate ui:z-50 ui:flex ui:justify-center')}>
|
|
|
|
|
<NavigationMenuPrimitive.Viewport
|
|
|
|
|
bind:ref
|
|
|
|
|
data-slot="navigation-menu-viewport"
|
|
|
|
|
class={cn(
|
2026-03-09 11:18:22 +01:00
|
|
|
'ui:origin-top-center ui:bg-popover ui:text-popover-foreground ui:data-[state=open]:animate-in ui:data-[state=closed]:animate-out ui:data-[state=closed]:zoom-out-95 ui:data-[state=open]:zoom-in-90 ui:relative ui:mt-1.5 ui:h-(--bits-navigation-menu-viewport-height) ui:w-full ui:overflow-hidden ui:rounded-md ui:border ui:shadow ui:md:ui:w-[var(--bits-navigation-menu-viewport-width)]',
|
2025-12-20 12:44:59 +01:00
|
|
|
className
|
|
|
|
|
)}
|
|
|
|
|
{...restProps}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
