fix(web): add destructive hover background to menu item components (#35322)

This commit is contained in:
yyh 2026-04-16 20:26:06 +08:00 committed by GitHub
parent 3445469385
commit e507675860
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 8 additions and 7 deletions

View File

@ -124,7 +124,7 @@ export function ContextMenuItem({
}: ContextMenuItemProps) {
return (
<BaseContextMenu.Item
className={cn(overlayRowClassName, destructive && 'text-text-destructive', className)}
className={cn(overlayRowClassName, destructive && 'text-text-destructive data-highlighted:bg-state-destructive-hover', className)}
{...props}
/>
)
@ -142,7 +142,7 @@ export function ContextMenuLinkItem({
}: ContextMenuLinkItemProps) {
return (
<BaseContextMenu.LinkItem
className={cn(overlayRowClassName, destructive && 'text-text-destructive', className)}
className={cn(overlayRowClassName, destructive && 'text-text-destructive data-highlighted:bg-state-destructive-hover', className)}
closeOnClick={closeOnClick}
{...props}
/>
@ -213,7 +213,7 @@ export function ContextMenuSubTrigger({
}: ContextMenuSubTriggerProps) {
return (
<BaseContextMenu.SubmenuTrigger
className={cn(overlayRowClassName, destructive && 'text-text-destructive', className)}
className={cn(overlayRowClassName, destructive && 'text-text-destructive data-highlighted:bg-state-destructive-hover', className)}
{...props}
>
{children}

View File

@ -182,7 +182,7 @@ export function DropdownMenuSubTrigger({
}: DropdownMenuSubTriggerProps) {
return (
<Menu.SubmenuTrigger
className={cn(overlayRowClassName, destructive && 'text-text-destructive', className)}
className={cn(overlayRowClassName, destructive && 'text-text-destructive data-highlighted:bg-state-destructive-hover', className)}
{...props}
>
{children}
@ -235,7 +235,7 @@ export function DropdownMenuItem({
}: DropdownMenuItemProps) {
return (
<Menu.Item
className={cn(overlayRowClassName, destructive && 'text-text-destructive', className)}
className={cn(overlayRowClassName, destructive && 'text-text-destructive data-highlighted:bg-state-destructive-hover', className)}
{...props}
/>
)
@ -253,7 +253,7 @@ export function DropdownMenuLinkItem({
}: DropdownMenuLinkItemProps) {
return (
<Menu.LinkItem
className={cn(overlayRowClassName, destructive && 'text-text-destructive', className)}
className={cn(overlayRowClassName, destructive && 'text-text-destructive data-highlighted:bg-state-destructive-hover', className)}
closeOnClick={closeOnClick}
{...props}
/>

View File

@ -48,7 +48,8 @@ const EdgeContextmenu = () => {
popupClassName="rounded-lg"
>
<ContextMenuItem
className="justify-between gap-4 px-3 text-text-secondary data-highlighted:bg-state-destructive-hover data-highlighted:text-text-destructive"
destructive
className="justify-between gap-4 px-3"
onClick={() => handleEdgeDeleteById(edgeMenu.edgeId)}
>
<span>{t('common:operation.delete')}</span>