import { jsx as _jsx } from "@emotion/react/jsx-runtime";
import { useCallback, forwardRef, } from 'react';
import { ListWrapperStyled } from './list-wrapper.style';
export const ListWrapper = forwardRef(({ children, onClickOutside, }, ref) => {
    const handleClick = useCallback((event) => {
        if (event.target === event.currentTarget) {
            onClickOutside === null || onClickOutside === void 0 ? void 0 : onClickOutside();
        }
    }, [onClickOutside]);
    return (_jsx(ListWrapperStyled, { ref: ref, role: "presentation", onClick: handleClick, children: children }));
});
