chore: merged

.changeset/nice-beds-battle.md

@@ -0,0 +1,5 @@
+---
+"@heroui/navbar": patch
+---
+
+fixed NavbarMenu React.Fragment prop error when animation is disabled (#4501)

.changeset/stale-bears-wink.md

@@ -0,0 +1,5 @@
+---
+"@heroui/theme": patch
+---
+
+add missing shadow none (#4586)

packages/components/navbar/src/navbar-menu.tsx

@@ -32,25 +32,28 @@ const NavbarMenu = forwardRef<"ul", NavbarMenuProps>((props, ref) => {
 
   const styles = clsx(classNames?.menu, className);
 
-  // only apply overlay when menu is open
-  const OverlayComponent = isMenuOpen ? Overlay : React.Fragment;
+  if (disableAnimation) {
+    if (!isMenuOpen) return null;
 
-  const contents = disableAnimation ? (
-    <OverlayComponent portalContainer={portalContainer}>
-      <ul
-        ref={domRef}
-        className={slots.menu?.({class: styles})}
-        data-open={dataAttr(isMenuOpen)}
-        style={{
-          // @ts-expect-error
-          "--navbar-height": typeof height === "number" ? `${height}px` : height,
-        }}
-        {...otherProps}
-      >
-        {children}
-      </ul>
-    </OverlayComponent>
-  ) : (
+    return (
+      <Overlay portalContainer={portalContainer}>
+        <ul
+          ref={domRef}
+          className={slots.menu?.({class: styles})}
+          data-open={dataAttr(isMenuOpen)}
+          style={{
+            // @ts-expect-error
+            "--navbar-height": typeof height === "number" ? `${height}px` : height,
+          }}
+          {...otherProps}
+        >
+          {children}
+        </ul>
+      </Overlay>
+    );
+  }
+
+  return (
     <AnimatePresence mode="wait">
       {isMenuOpen ? (
         <Overlay portalContainer={portalContainer}>
@@ -78,8 +81,6 @@ const NavbarMenu = forwardRef<"ul", NavbarMenuProps>((props, ref) => {
       ) : null}
     </AnimatePresence>
   );
-
-  return contents;
 });
 
 NavbarMenu.displayName = "HeroUI.NavbarMenu";

packages/core/theme/src/components/modal.ts

@@ -130,6 +130,9 @@ const modal = tv({
       },
     },
     shadow: {
+      none: {
+        base: "shadow-none",
+      },
       sm: {
         base: "shadow-small",
       },

packages/core/theme/src/components/popover.ts

@@ -132,6 +132,9 @@ const popover = tv({
       full: {content: "rounded-full"},
     },
     shadow: {
+      none: {
+        content: "shadow-none",
+      },
       sm: {
         content: "shadow-small",
       },