From 55332cb23e650aa249d18701b9f00bef1b088805 Mon Sep 17 00:00:00 2001
From: Joel <iamjoel007@gmail.com>
Date: Mon, 24 Mar 2025 14:56:58 +0800
Subject: [PATCH] fix: handle var full path panel popup in wrong position and
 style

---
 .../plugins/workflow-variable-block/component.tsx         | 6 +++---
 .../_base/components/variable/var-full-path-panel.tsx     | 8 ++++----
 .../_base/components/variable/var-reference-picker.tsx    | 4 ++--
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/web/app/components/base/prompt-editor/plugins/workflow-variable-block/component.tsx b/web/app/components/base/prompt-editor/plugins/workflow-variable-block/component.tsx
index a31f605514..47217eae58 100644
--- a/web/app/components/base/prompt-editor/plugins/workflow-variable-block/component.tsx
+++ b/web/app/components/base/prompt-editor/plugins/workflow-variable-block/component.tsx
@@ -86,7 +86,7 @@ const WorkflowVariableBlockComponent = ({
   const Item = (
     <div
       className={cn(
-        'mx-0.5 relative group/wrap flex items-center h-[18px] pl-0.5 pr-[3px] rounded-[5px] border select-none hover:border-state-accent-solid hover:bg-state-accent-hover',
+        'group/wrap relative mx-0.5 flex h-[18px] select-none items-center rounded-[5px] border pl-0.5 pr-[3px] hover:border-state-accent-solid hover:bg-state-accent-hover',
         isSelected ? ' border-state-accent-solid bg-state-accent-hover' : ' border-components-panel-border-subtle bg-components-badge-white-to-dark',
         !node && !isEnv && !isChatVar && '!border-state-destructive-solid !bg-state-destructive-hover',
       )}
@@ -111,7 +111,7 @@ const WorkflowVariableBlockComponent = ({
       )}
       {isShowAPart && (
         <div className='flex items-center'>
-          <RiMoreLine className='w-3 h-3 text-text-secondary' />
+          <RiMoreLine className='h-3 w-3 text-text-secondary' />
           <Line3 className='mr-0.5 text-divider-deep'></Line3>
         </div>
       )}
@@ -158,7 +158,7 @@ const WorkflowVariableBlockComponent = ({
         />}
       disabled={!isShowAPart}
     >
-      {Item}
+      <div>{Item}</div>
     </Tooltip>
   )
 }
diff --git a/web/app/components/workflow/nodes/_base/components/variable/var-full-path-panel.tsx b/web/app/components/workflow/nodes/_base/components/variable/var-full-path-panel.tsx
index 8742fae526..54e27b5e38 100644
--- a/web/app/components/workflow/nodes/_base/components/variable/var-full-path-panel.tsx
+++ b/web/app/components/workflow/nodes/_base/components/variable/var-full-path-panel.tsx
@@ -42,13 +42,13 @@ const VarFullPathPanel: FC<Props> = ({
     }
   })()
   return (
-    <div className='w-[280px] pb-0 rounded-xl border-[0.5px] border-components-panel-border bg-components-panel-bg-blur shadow-lg backdrop-blur-[5px]'>
-      <div className='flex p-3 pb-2 border-b-[0.5px] border-divider-subtle space-x-1 '>
+    <div className='w-[280px] rounded-xl border-[0.5px] border-components-panel-border bg-components-panel-bg-blur pb-0 shadow-lg backdrop-blur-[5px]'>
+      <div className='flex space-x-1 border-b-[0.5px] border-divider-subtle p-3 pb-2 '>
         <BlockIcon size='xs' type={nodeType} />
-        <div className='w-0 grow system-xs-medium text-text-secondary truncate'>{nodeName}</div>
+        <div className='system-xs-medium w-0 grow truncate text-text-secondary'>{nodeName}</div>
       </div>
       <Panel
-        className='pt-2 pb-3 px-1'
+        className='px-1 pb-3 pt-2'
         root={{ attrName: path[0] }}
         payload={schema}
         readonly
diff --git a/web/app/components/workflow/nodes/_base/components/variable/var-reference-picker.tsx b/web/app/components/workflow/nodes/_base/components/variable/var-reference-picker.tsx
index 66113e30c6..60ab18d342 100644
--- a/web/app/components/workflow/nodes/_base/components/variable/var-reference-picker.tsx
+++ b/web/app/components/workflow/nodes/_base/components/variable/var-reference-picker.tsx
@@ -348,7 +348,7 @@ const VarReferencePicker: FC<Props> = ({
                       className='h-full grow'
                     >
                       <div ref={isSupportConstantValue ? triggerRef : null} className={cn('h-full', isSupportConstantValue && 'flex items-center rounded-lg bg-gray-100 py-1 pl-1')}>
-                        <Tooltip popupContent={tooltipPopup}>
+                        <Tooltip noDecoration={isShowAPart} popupContent={tooltipPopup}>
                           <div className={cn('h-full items-center rounded-[5px] px-1.5', hasValue ? 'inline-flex bg-white' : 'flex')}>
                             {hasValue
                               ? (
@@ -369,7 +369,7 @@ const VarReferencePicker: FC<Props> = ({
                                   )}
                                   {isShowAPart && (
                                     <div className='flex items-center'>
-                                      <RiMoreLine className='w-3 h-3 text-text-secondary' />
+                                      <RiMoreLine className='h-3 w-3 text-text-secondary' />
                                       <Line3 className='mr-0.5 text-divider-deep'></Line3>
                                     </div>
                                   )}