brightyui
Version:
Brighty UI library
33 lines • 1.59 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useEffect, useRef } from 'react';
import styles from '../../../src/styles/NavigationBar.module.scss';
import { CloseIcon } from '../../images/IconComponents/CloseIcon';
import Typography from '../Typography/Typography';
import useOutsideClick from '../../hooks/useOutsideClick';
import { cnb } from 'cnbuilder';
var NavigationBar = function (_a) {
var _b;
var title = _a.title, onClose = _a.onClose, open = _a.open, children = _a.children, noOverlay = _a.noOverlay;
var ref = useRef(null);
useOutsideClick([ref], onClose);
useEffect(function () {
var scrollY = window.scrollY;
if (open) {
document.body.style.position = 'fixed';
document.body.style.top = "-".concat(scrollY, "px");
}
else {
document.body.style.position = '';
document.body.style.top = '';
window.scrollTo(0, scrollY);
}
}, [open]);
if (!open) {
return null;
}
return (_jsx("div", { className: cnb(styles.wrapper, (_b = {},
_b[styles.wrapper__transparent] = noOverlay,
_b)), children: _jsxs("div", { className: styles.root, ref: ref, children: [_jsxs("div", { className: styles.top, children: [_jsx(Typography, { children: title }), _jsx("button", { className: styles.closeButton, onClick: onClose, children: _jsx(CloseIcon, {}) })] }), _jsx("div", { className: styles.content, children: children })] }) }));
};
export default NavigationBar;
//# sourceMappingURL=NavigationBar.js.map