@thecb/components 11.2.14-beta.0 → 11.2.14-beta.1

package/dist/index.cjs.js

@@ -44712,7 +44712,7 @@ var NavMenuDesktop = function NavMenuDesktop(_ref) {
 };
 var NavMenuDesktop$1 = themeComponent(NavMenuDesktop, "NavMenu", fallbackValues$M, "profile");
 
-// Use transforms (x) rather than left/right
+// Animate with transforms (x) instead of left/right
 var menuVariants = {
   invisible: {
     x: "-100vw",
@@ -44732,9 +44732,9 @@ var menuVariants = {
 var ImposterMenu = styled__default(Motion).withConfig({
   displayName: "NavMenuMobile__ImposterMenu",
   componentId: "sc-1pf0qp7-0"
-})(["position:fixed;top:", ";left:0;right:0;"], function (_ref) {
-  var headerSize = _ref.headerSize;
-  return headerSize;
+})(["position:fixed;top:0;left:0;right:0;bottom:0;background:", ";z-index:9999;"], function (_ref) {
+  var themeValues = _ref.themeValues;
+  return (themeValues === null || themeValues === void 0 ? void 0 : themeValues.overlayColor) || "rgba(0, 0, 0, 0.5)";
 });
 var NavMenuMobile = function NavMenuMobile(_ref2) {
   var id = _ref2.id,
@@ -44743,18 +44743,18 @@ var NavMenuMobile = function NavMenuMobile(_ref2) {
     _ref2$visible = _ref2.visible,
     visible = _ref2$visible === void 0 ? false : _ref2$visible,
     _ref2$headerSize = _ref2.headerSize,
-    headerSize = _ref2$headerSize === void 0 ? "72px" : _ref2$headerSize,
     themeValues = _ref2.themeValues;
   return /*#__PURE__*/React__default.createElement(ImposterMenu, {
     id: id,
     variants: menuVariants,
     initial: "invisible",
     animate: visible ? "visible" : "invisible",
-    headerSize: headerSize
+    themeValues: themeValues
   }, /*#__PURE__*/React__default.createElement(Box, {
-    width: "100vw",
+    width: "100%",
+    maxWidth: "400px",
     padding: "1rem 0.5rem",
-    extraStyles: "\n          position: relative;\n          max-width: 400px;\n          height: calc(100vh - 72px);\n        ",
+    extraStyles: "\n          position: relative;\n          height: 100%;\n        ",
     background: themeValues.backgroundColor
   }, menuContent));
 };