Fix DropdownMenuLabel: render plain div instead of Base UI GroupLabel

Base UI's Menu.GroupLabel requires a surrounding Menu.Group (unlike
Radix's standalone Label), so using DropdownMenuLabel as a bare heading
threw "MenuGroupContext is missing" at runtime. Render a <div> directly.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Khalid Abdi
2026-06-01 18:16:31 +03:00
parent 97bf9ed8cc
commit 2042a60b91
+5 -2
View File
@@ -57,11 +57,14 @@ function DropdownMenuLabel({
className, className,
inset, inset,
...props ...props
}: MenuPrimitive.GroupLabel.Props & { }: React.ComponentProps<"div"> & {
inset?: boolean inset?: boolean
}) { }) {
// Base UI's Menu.GroupLabel requires a surrounding Menu.Group (unlike Radix's
// standalone Label). These menus use the label as a plain heading, so render a
// <div> directly to avoid the "MenuGroupContext is missing" error.
return ( return (
<MenuPrimitive.GroupLabel <div
data-slot="dropdown-menu-label" data-slot="dropdown-menu-label"
data-inset={inset} data-inset={inset}
className={cn( className={cn(