import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useRef } from "react";
import { useClickOutside } from "../../../hooks/common";
import { Container, Button, Line, Content } from "./burger.styled";
const BurgerIcon = ({ opened, className, children, handleClickIcon, handleClickOutside = () => undefined, }) => {
    const ref = useRef(null);
    useClickOutside(ref, handleClickOutside);
    return (_jsxs(Container, { ref: ref, className: `ui-burger-icon ${className ?? ""}`, children: [_jsx(Button, { className: `ui-burger-icon__button${opened ? " opened" : ""}`, onClick: handleClickIcon, children: !opened && _jsx(Line, {}) }), _jsx(Content, { className: `ui-burger-icon__content${opened ? "" : " hidden"}`, children: children })] }));
};
export default BurgerIcon;
//# sourceMappingURL=burger.js.map