fix: native button

web/app/components/app-sidebar/dataset-info/dropdown.tsx

@@ -89,9 +89,13 @@ const DropDown = ({
       setConfirmMessage(isUsedByApp ? t('datasetUsedByApp', { ns: 'dataset' })! : t('deleteDatasetConfirmContent', { ns: 'dataset' })!)
       setShowConfirmDelete(true)
     }
-    catch (e: any) {
+    catch (e: unknown) {
-      const res = await e.json()
+      let message = 'Unknown error'
-      toast(res?.message || 'Unknown error', { type: 'error' })
+      if (e instanceof Response) {
+        const res = await e.json() as { message?: string }
+        message = res?.message || message
+      }
+      toast(message, { type: 'error' })
     }
   }, [dataset.id, t])
 
@@ -112,10 +116,15 @@ const DropDown = ({
       open={open}
       onOpenChange={setOpen}
     >
-      <DropdownMenuTrigger render={<div />}>
+      <DropdownMenuTrigger
-        <ActionButton className={cn(expand ? 'size-8 rounded-lg' : 'size-6 rounded-md', open && 'bg-state-base-hover')}>
+        render={(
-          <span aria-hidden className="i-ri-more-fill size-4" />
+          <ActionButton
-        </ActionButton>
+            aria-label={t('operation.more', { ns: 'common' })}
+            className={cn(expand ? 'size-8 rounded-lg' : 'size-6 rounded-md', open && 'bg-state-base-hover')}
+          />
+        )}
+      >
+        <span aria-hidden className="i-ri-more-fill size-4" />
       </DropdownMenuTrigger>
       <DropdownMenuContent
         placement={expand ? 'bottom-end' : 'right-start'}

web/app/components/base/infotip/index.tsx

@@ -65,12 +65,13 @@ export function Infotip({
         delay={delay}
         closeDelay={closeDelay}
         aria-label={ariaLabel}
-        render={(
+        className={cn(
-          <span className={cn('inline-flex h-4 w-4 shrink-0 items-center justify-center', className)}>
+          'inline-flex h-4 w-4 shrink-0 cursor-pointer items-center justify-center border-0 bg-transparent p-0 focus-visible:ring-1 focus-visible:ring-components-input-border-hover focus-visible:outline-hidden',
-            <span aria-hidden className={cn('i-ri-question-line h-3.5 w-3.5 text-text-quaternary hover:text-text-tertiary', iconClassName)} />
+          className,
-          </span>
         )}
-      />
+      >
+        <span aria-hidden className={cn('i-ri-question-line h-3.5 w-3.5 text-text-quaternary hover:text-text-tertiary', iconClassName)} />
+      </PopoverTrigger>
       <PopoverContent
         placement={placement}
         popupClassName={cn('max-w-[300px] rounded-md px-3 py-2 system-xs-regular text-text-tertiary', popupClassName)}

web/app/components/workflow/block-selector/main.tsx

@@ -13,6 +13,7 @@ import type {
   OnSelectBlock,
   ToolWithProvider,
 } from '../types'
+import { cn } from '@langgenius/dify-ui/cn'
 import {
   Popover,
   PopoverContent,
@@ -177,18 +178,19 @@ const NodeSelector: FC<NodeSelectorProps> = ({
   }, [activeTab, t])
 
   const defaultTriggerElement = (
-    <div
+    <PopoverTrigger
-      className={`
+      aria-label={t('common.addBlock', { ns: 'workflow' })}
-        z-10 flex h-4
+      className={cn(
-        w-4 cursor-pointer items-center justify-center rounded-full bg-components-button-primary-bg text-text-primary-on-surface hover:bg-components-button-primary-bg-hover
+        'z-10 flex h-4 w-4 cursor-pointer items-center justify-center rounded-full border-0 bg-components-button-primary-bg p-0 text-text-primary-on-surface hover:bg-components-button-primary-bg-hover focus-visible:ring-1 focus-visible:ring-components-input-border-hover focus-visible:outline-hidden',
-        ${triggerClassName?.(open)}
+        triggerClassName?.(open),
-      `}
+      )}
       style={triggerStyle}
+      onClick={handleTrigger}
     >
-      <Plus02 className="h-2.5 w-2.5" />
+      <Plus02 aria-hidden className="h-2.5 w-2.5" />
-    </div>
+    </PopoverTrigger>
   )
-  const triggerElement = trigger ? trigger(open) : defaultTriggerElement
+  const triggerElement = trigger?.(open)
   const triggerElementProps = React.isValidElement(triggerElement)
     ? (triggerElement.props as {
         onClick?: MouseEventHandler<HTMLElement>
@@ -216,15 +218,17 @@ const NodeSelector: FC<NodeSelectorProps> = ({
   const sideOffset = typeof offset === 'number' ? offset : (resolvedOffset?.mainAxis ?? 0)
   const alignOffset = typeof offset === 'number' ? 0 : (resolvedOffset?.crossAxis ?? 0)
   const nativeButton = asChild
-    && React.isValidElement(triggerElement)
+    ? React.isValidElement(triggerElement) && (typeof triggerElement.type !== 'string' || triggerElement.type === 'button')
-    && (typeof triggerElement.type !== 'string' || triggerElement.type === 'button')
+    : false
 
   return (
     <Popover
       open={open}
       onOpenChange={handleOpenChange}
     >
-      <PopoverTrigger nativeButton={nativeButton} render={resolvedTriggerElement as React.ReactElement} />
+      {trigger
+        ? <PopoverTrigger nativeButton={nativeButton} render={resolvedTriggerElement as React.ReactElement} />
+        : defaultTriggerElement}
       <PopoverContent
         placement={placement}
         sideOffset={sideOffset}

web/app/components/workflow/nodes/_base/components/variable/var-reference-picker.trigger.tsx

@@ -230,6 +230,7 @@ const VarReferencePickerTrigger: FC<Props> = ({
           ? variablePicker
           : (
               <PopoverTrigger
+                nativeButton={false}
                 render={variablePicker}
                 onClick={handleTriggerReadonlyClick}
               />
@@ -344,6 +345,7 @@ const VarReferencePickerTrigger: FC<Props> = ({
 
     return (
       <PopoverTrigger
+        nativeButton={false}
         render={triggerContent}
         onClick={handleTriggerReadonlyClick}
       />