fix(toast): 修复 Toast 点击交互
- 为可点击的 Toast 添加指针样式,提升交互反馈。 - 阻止关闭按钮点击事件冒泡,避免触发外层点击逻辑。
This commit is contained in:
@@ -48,7 +48,7 @@ const Toast = React.forwardRef<
|
||||
return (
|
||||
<ToastPrimitives.Root
|
||||
ref={ref}
|
||||
className={cn(toastVariants({ variant }), className)}
|
||||
className={cn(toastVariants({ variant }), props.onClick && "cursor-pointer", className)}
|
||||
{...props}
|
||||
/>
|
||||
)
|
||||
@@ -76,6 +76,10 @@ const ToastClose = React.forwardRef<
|
||||
>(({ className, ...props }, ref) => (
|
||||
<ToastPrimitives.Close
|
||||
ref={ref}
|
||||
onClick={(event) => {
|
||||
event.stopPropagation()
|
||||
props.onClick?.(event)
|
||||
}}
|
||||
className={cn(
|
||||
"absolute right-1 top-1 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-1 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
|
||||
className
|
||||
|
||||
Reference in New Issue
Block a user