@xo-union/tk-component-header-nav
Version:
55 lines (54 loc) • 1.86 kB
JavaScript
"use strict";
var _Object$defineProperty = require("@babel/runtime-corejs3/core-js/object/define-property");
var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
_Object$defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _tkComponentOverlay = _interopRequireDefault(require("@xo-union/tk-component-overlay"));
var _ContextCjs = require("../Context.cjs.js");
// Render plain div during SSR to avoid disabling UIs while app loads
const SSRFriendlyOverlayDiv = props => {
const {
children
} = props;
const [mounted, setMounted] = _react.default.useState(false);
_react.default.useEffect(() => {
setMounted(true);
}, []);
if (mounted) {
return /*#__PURE__*/_react.default.createElement("div", props);
}
return /*#__PURE__*/_react.default.createElement("div", null, children);
};
process.env.NODE_ENV !== "production" ? SSRFriendlyOverlayDiv.propTypes = {
children: _propTypes.default.node
} : void 0;
const Overlay = _ref => {
let {
children
} = _ref;
const {
classes,
mobileMedia,
navMenuState,
navMenuActions,
navMenuRefs
} = (0, _ContextCjs.useHeaderNavContext)();
return /*#__PURE__*/_react.default.createElement("div", {
className: classes['overlay-container']
}, /*#__PURE__*/_react.default.createElement(_tkComponentOverlay.default, {
as: SSRFriendlyOverlayDiv,
color: "light",
fixedToRelative: true,
enabled: navMenuState.isHamburgerOpenInMobile || mobileMedia.no,
className: classes.overlay
}, children));
};
process.env.NODE_ENV !== "production" ? Overlay.propTypes = {
children: _propTypes.default.node
} : void 0;
var _default = Overlay;
exports.default = _default;