perf: all plugin variables type support referense & replace input and textarea with prompt editor (#2950)

* support reference as plugin variables

* replace input and textarea with prompt editor

* adjust height & optimize textarea and input

* input select

projects/app/src/components/core/app/VariableEdit.tsx

@@ -36,7 +36,7 @@ export const defaultVariable: VariableItemType = {
   id: nanoid(),
   key: '',
   label: '',
-  type: VariableInputEnum.input,
+  type: VariableInputEnum.textInput,
   description: '',
   required: true,
   valueType: WorkflowIOValueTypeEnum.string
@@ -72,13 +72,18 @@ const VariableEdit = ({
 
   const inputTypeList = useMemo(
     () =>
-      Object.values(variableMap).map((item) => ({
-        icon: item.icon,
-        label: t(item.label as any),
-        value: item.value,
-        defaultValueType: item.defaultValueType,
-        description: item.description ? t(item.description as any) : ''
-      })),
+      Object.values(variableMap)
+        .filter(
+          (item) =>
+            item.value !== VariableInputEnum.input && item.value !== VariableInputEnum.textarea
+        )
+        .map((item) => ({
+          icon: item.icon,
+          label: t(item.label as any),
+          value: item.value,
+          defaultValueType: item.defaultValueType,
+          description: item.description ? t(item.description as any) : ''
+        })),
     [t]
   );
 

projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariableInput.tsx

@@ -24,6 +24,7 @@ import { ChatBoxContext } from '../Provider';
 import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip';
 import { useDeepCompareEffect } from 'ahooks';
 import { VariableItemType } from '@fastgpt/global/core/app/type';
+import PromptEditor from '@fastgpt/web/components/common/Textarea/PromptEditor';
 
 export const VariableInputItem = ({
   item,
@@ -77,6 +78,16 @@ export const VariableInputItem = ({
           maxLength={item.maxLength || 4000}
         />
       )}
+      {item.type === VariableInputEnum.textInput && (
+        <PromptEditor
+          value={item.defaultValue}
+          onChange={(e) => setValue(item.key, e)}
+          bg={'myGray.50'}
+          minH={50}
+          maxH={150}
+          showOpenModal={false}
+        />
+      )}
       {item.type === VariableInputEnum.select && (
         <Controller
           key={item.key}

projects/app/src/components/core/chat/components/AIResponseBox.tsx

@@ -38,6 +38,7 @@ import { FlowNodeInputTypeEnum } from '@fastgpt/global/core/workflow/node/consta
 import { useTranslation } from 'react-i18next';
 import { Controller, useForm } from 'react-hook-form';
 import MySelect from '@fastgpt/web/components/common/MySelect';
+import PromptEditor from '@fastgpt/web/components/common/Textarea/PromptEditor';
 
 type props = {
   value: UserChatItemValueItemType | AIChatItemValueItemType;
@@ -240,6 +241,15 @@ const RenderUserFormInteractive = React.memo(function RenderFormInput({
               maxLength={input.maxLength || 4000}
             />
           )}
+          {input.type === FlowNodeInputTypeEnum.textInput && (
+            <PromptEditor
+              value={input.value}
+              onChange={(e) => setValue(input.label, e)}
+              minH={40}
+              maxH={100}
+              showOpenModal={false}
+            />
+          )}
           {input.type === FlowNodeInputTypeEnum.numberInput && (
             <NumberInput
               step={1}