<script>
    import { cn } from "$lib/utils";
    import SidebarButton from "./sidebar/sidebar-button.svelte";

    /**
     * @typedef {Object} Props
     * @property {string} [title]
     * @property {boolean} [noBMargin]
     */

    /** @type {Props} */
    let { title = "Dashboard", noBMargin = false } = $props();
</script>

<div class={cn("flex items-center gap-1 p-2 md:p-0", noBMargin ? "" : "mb-8 ")}>
    <div class="hidden md:block">
        <SidebarButton />
    </div>
    <h1 class="text-lg tracking-wider dark:text-primary-foreground/80 lg:text-xl">
        {title}
    </h1>
</div>
