import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
import React__default from 'react';
import { cn } from '../../../utils/cn.js';
import { useDropdownContext } from './DropdownContext.js';

/**
 * DropdownSection component - groups related menu items
 */
const DropdownSection = React__default.forwardRef(({ children, className, title, showDivider = false, ...props }, ref) => {
    const { theme } = useDropdownContext();
    return (jsxs(Fragment, { children: [showDivider && jsx("div", { className: theme.separatorStyle, role: "separator" }), jsxs("div", { ref: ref, role: "group", "aria-label": typeof title === 'string' ? title : undefined, className: cn(theme.sectionStyle, className), ...props, children: [title && (typeof title === 'string'
                        ? jsx("div", { className: theme.sectionTitleStyle, role: "presentation", children: title })
                        : title), children] })] }));
});
DropdownSection.displayName = "Dropdown.Section";

export { DropdownSection };
