import { jsxs, jsx } from 'react/jsx-runtime';
import React__default from 'react';
import { cn } from '../../../utils/cn.js';
import { useSidebarContext } from './SidebarContext.js';

const SidebarNavGroup = React__default.forwardRef(({ title, showTitleWhenCollapsed = false, children, className, ...props }, ref) => {
    const sidebarContext = useSidebarContext();
    const collapsed = (sidebarContext === null || sidebarContext === void 0 ? void 0 : sidebarContext.collapsed) || false;
    const isMobile = (sidebarContext === null || sidebarContext === void 0 ? void 0 : sidebarContext.isMobile) || false;
    const isCollapsedView = collapsed && !isMobile;
    const showTitle = title && (!isCollapsedView || showTitleWhenCollapsed);
    return (jsxs("div", { ref: ref, className: cn("space-y-1", className), ...props, children: [showTitle && (jsx("div", { className: "px-2 py-2", children: jsx("h3", { className: "text-sm font-semibold text-[var(--color-text-muted)] uppercase tracking-wider", children: title }) })), isCollapsedView && !showTitleWhenCollapsed && (jsx("div", { className: "h-px bg-[var(--color-border)] mx-2 my-2" })), jsx("div", { className: "space-y-1", children: children })] }));
});
SidebarNavGroup.displayName = "SidebarNavGroup";

export { SidebarNavGroup };
