import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import clsx from 'clsx';
import { useSidebarToggle } from './SidebarContext';
import { Dot } from 'lucide-react';
import { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } from '@vertesia/ui/core';
import { Nav } from "@vertesia/ui/router";
export function Sidebar({ children, logo, className }) {
    return (_jsxs("div", { className: clsx(className || "bg-indigo-600 dark:bg-indigo-950", "flex flex-col h-full"), children: [logo &&
                _jsx("div", { className: "-mx-2 flex h-auto my-4 shrink-0 self-start", children: logo }), _jsx("div", { className: "flex-1 min-h-0 overflow-hidden px-2", children: _jsx("nav", { className: "h-full flex flex-col", children: _jsx("ul", { role: "list", className: "flex flex-col gap-y-2 overflow-y-auto h-full", children: children }) }) })] }));
}
export function SidebarSection({ children, title, action, isFooter = false }) {
    const { isOpen } = useSidebarToggle();
    let header = isOpen ? _jsxs(_Fragment, { children: [title || "", action] }) : _jsx(Dot, { className: 'size-6' });
    return (_jsxs("li", { className: isFooter ? 'mt-auto' : '', children: [title && _jsx("div", { className: "text-xs font-medium h-8 flex items-center gap-x-2 px-2 text-sidebar-foreground/70", children: header }), _jsx("ul", { "data-sidebar": "menu", className: "flex w-full min-w-0 flex-col gap-1", children: children })] }));
}
export function SidebarTooltip({ children, text }) {
    const { isOpen } = useSidebarToggle();
    return (isOpen ? _jsx(_Fragment, { children: children }) :
        _jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: children }), _jsx(TooltipContent, { side: 'right', children: text })] }) }));
}
export function SidebarItem({ external, className, tools, children, icon: Icon, href, current, onClick }) {
    const { toggleMobile } = useSidebarToggle();
    const _closeSideBar = () => {
        setTimeout(() => {
            toggleMobile(false);
        }, 100);
    };
    const onClickWrapper = (event) => {
        if (external) {
            window.open(href, '_blank');
            event.preventDefault(); // Prevent default link behavior
            event.stopPropagation(); // Stop the event from propagating
        }
        else if (onClick) {
            onClick(event);
        }
    };
    return (_jsx("li", { children: _jsx(Nav, { onClick: _closeSideBar, children: _jsx(SidebarTooltip, { text: children, children: _jsxs("a", { href: href, onClick: onClickWrapper, className: clsx(current
                        ? 'bg-sidebar-accent text-sidebar-accent-foreground'
                        : 'text-sidebar-foreground hover:text-sidebar-accent-foreground hover:bg-sidebar-accent', 'group flex gap-x-3 rounded-md px-2 py-1.5 text-sm items-center h-8', className), children: [Icon &&
                            _jsx(Icon, { className: clsx(current
                                    ? 'bg-sidebar-accent text-sidebar-accent-foreground'
                                    : 'text-sidebar-foreground hover:text-sidebar-accent-foreground hover:bg-sidebar-accent', 'size-4 shrink-0'), "aria-hidden": "true" }), children, tools && _jsx("div", { className: 'flex items-center ml-auto', children: tools })] }) }) }) }));
}
//# sourceMappingURL=Sidebar.js.map