"use client";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { forwardRef } from "react";
import { useCollapseTransition } from "../transition/useCollapseTransition.js";
import { NavGroup } from "./NavGroup.js";
import { NavItem } from "./NavItem.js";
import { NavItemButton } from "./NavItemButton.js";
const noop = ()=>{
// do nothing
};
/**
 * **Client Component**
 *
 * @see {@link https://react-md.dev/components/navigation | Navigation Demos}
 * @since 6.0.0
 */ export const CollapsibleNavGroup = /*#__PURE__*/ forwardRef(function CollapsibleNavGroup(props, ref) {
    const { liProps, buttonProps, buttonChildren, icon, iconRotatorProps, disableIconRotator, className, children, collapsed, toggleCollapsed, collapseOptions, ...remaining } = props;
    const { rendered, elementProps } = useCollapseTransition({
        ...collapseOptions,
        nodeRef: ref,
        className,
        transitionIn: !collapsed
    });
    const onButtonClick = buttonProps?.onClick ?? noop;
    return /*#__PURE__*/ _jsxs(NavItem, {
        ...liProps,
        children: [
            /*#__PURE__*/ _jsx(NavItemButton, {
                ...buttonProps,
                onClick: (event)=>{
                    onButtonClick(event);
                    toggleCollapsed();
                },
                collapsed: collapsed,
                icon: icon,
                iconRotatorProps: iconRotatorProps,
                disableIconRotator: disableIconRotator,
                children: buttonChildren
            }),
            rendered && /*#__PURE__*/ _jsx(NavGroup, {
                ...remaining,
                ...elementProps,
                children: children
            })
        ]
    });
});

//# sourceMappingURL=CollapsibleNavGroup.js.map