<script lang="ts" setup>
import { cn } from '@/lib/utils'

import type { LayoutHeaderProps } from './types'

defineProps<LayoutHeaderProps>()
</script>

<template>
  <header
    :class="cn(
      'flex flex-col md:flex-row gap-2 justify-end py-2',
      sticky ? 'sticky top-0 z-40 bg-background' : '',
    )"
  >
    <aside class="flex items-center gap-2 flex-wrap">
      <slot name="actions" />
    </aside>
  </header>
</template>
