From 211e6885478b5756ff3a42d420dcfa77cfe89656 Mon Sep 17 00:00:00 2001
From: Junyi <mytharcher@users.noreply.github.com>
Date: Tue, 18 Feb 2025 22:25:13 +0800
Subject: [PATCH] fix(client): fix variable component disabled height (#6197)

* fix(client): fix variable component disabled height

* fix(client): fix type
---
 .../antd/variable/TextArea.tsx                | 21 ++++++++++---------
 .../antd/variable/VariableSelect.tsx          |  5 ++++-
 2 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/packages/core/client/src/schema-component/antd/variable/TextArea.tsx b/packages/core/client/src/schema-component/antd/variable/TextArea.tsx
index 226da709e5..23d74a7760 100644
--- a/packages/core/client/src/schema-component/antd/variable/TextArea.tsx
+++ b/packages/core/client/src/schema-component/antd/variable/TextArea.tsx
@@ -9,7 +9,7 @@
 
 import { css, cx } from '@emotion/css';
 import { useForm } from '@formily/react';
-import { Space } from 'antd';
+import { Space, theme } from 'antd';
 import useInputStyle from 'antd/es/input/style';
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { renderToString } from 'react-dom/server';
@@ -238,6 +238,7 @@ export function TextArea(props) {
   // NOTE: e.g. [startElementIndex, startOffset, endElementIndex, endOffset]
   const [range, setRange] = useState<[number, number, number, number]>([-1, 0, -1, 0]);
   useInputStyle('ant-input');
+  const { token } = theme.useToken();
   const delimitersString = delimiters.join(' ');
 
   useEffect(() => {
@@ -440,6 +441,7 @@ export function TextArea(props) {
           { 'ant-input-disabled': disabled },
           // NOTE: `pre-wrap` here for avoid the `&nbsp;` (\x160) issue when paste content, we need normal space (\x32).
           css`
+            min-height: ${token.controlHeight}px;
             overflow: auto;
             white-space: pre-wrap;
 
@@ -461,15 +463,14 @@ export function TextArea(props) {
         contentEditable={!disabled}
         dangerouslySetInnerHTML={{ __html: html }}
       />
-      {!disabled ? (
-        <VariableSelect
-          options={options}
-          setOptions={setOptions}
-          onInsert={onInsert}
-          changeOnSelect={changeOnSelect}
-          fieldNames={fieldNames || defaultFieldNames}
-        />
-      ) : null}
+      <VariableSelect
+        options={options}
+        setOptions={setOptions}
+        onInsert={onInsert}
+        changeOnSelect={changeOnSelect}
+        fieldNames={fieldNames || defaultFieldNames}
+        disabled={disabled}
+      />
     </Space.Compact>,
   );
 }
diff --git a/packages/core/client/src/schema-component/antd/variable/VariableSelect.tsx b/packages/core/client/src/schema-component/antd/variable/VariableSelect.tsx
index 10ce848410..b5d442df68 100644
--- a/packages/core/client/src/schema-component/antd/variable/VariableSelect.tsx
+++ b/packages/core/client/src/schema-component/antd/variable/VariableSelect.tsx
@@ -22,6 +22,7 @@ export function VariableSelect({
   changeOnSelect = false,
   fieldNames = {},
   className,
+  disabled,
 }: {
   options: any[];
   setOptions: (options: any) => void;
@@ -29,6 +30,7 @@ export function VariableSelect({
   changeOnSelect?: boolean;
   fieldNames?: any;
   className?: string;
+  disabled?: boolean;
 }): JSX.Element {
   const { t } = useTranslation();
   const [selectedVar, setSelectedVar] = useState<string[]>([]);
@@ -44,8 +46,9 @@ export function VariableSelect({
   }
 
   return wrapSSR(
-    <XButton className={cx('x-button', componentCls, hashId, className)}>
+    <XButton disabled={disabled} className={cx('x-button', componentCls, hashId, className)}>
       <Cascader
+        disabled={disabled}
         placeholder={t('Select a variable')}
         value={[]}
         options={options}