fix(client): fix variable component disabled height (#6197)

* fix(client): fix variable component disabled height

* fix(client): fix type
This commit is contained in:
Junyi 2025-02-18 22:25:13 +08:00 committed by GitHub
parent 418a27bf41
commit 211e688547
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 15 additions and 11 deletions

View File

@ -9,7 +9,7 @@
import { css, cx } from '@emotion/css'; import { css, cx } from '@emotion/css';
import { useForm } from '@formily/react'; import { useForm } from '@formily/react';
import { Space } from 'antd'; import { Space, theme } from 'antd';
import useInputStyle from 'antd/es/input/style'; import useInputStyle from 'antd/es/input/style';
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'; import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import { renderToString } from 'react-dom/server'; import { renderToString } from 'react-dom/server';
@ -238,6 +238,7 @@ export function TextArea(props) {
// NOTE: e.g. [startElementIndex, startOffset, endElementIndex, endOffset] // NOTE: e.g. [startElementIndex, startOffset, endElementIndex, endOffset]
const [range, setRange] = useState<[number, number, number, number]>([-1, 0, -1, 0]); const [range, setRange] = useState<[number, number, number, number]>([-1, 0, -1, 0]);
useInputStyle('ant-input'); useInputStyle('ant-input');
const { token } = theme.useToken();
const delimitersString = delimiters.join(' '); const delimitersString = delimiters.join(' ');
useEffect(() => { useEffect(() => {
@ -440,6 +441,7 @@ export function TextArea(props) {
{ 'ant-input-disabled': disabled }, { 'ant-input-disabled': disabled },
// NOTE: `pre-wrap` here for avoid the `&nbsp;` (\x160) issue when paste content, we need normal space (\x32). // NOTE: `pre-wrap` here for avoid the `&nbsp;` (\x160) issue when paste content, we need normal space (\x32).
css` css`
min-height: ${token.controlHeight}px;
overflow: auto; overflow: auto;
white-space: pre-wrap; white-space: pre-wrap;
@ -461,15 +463,14 @@ export function TextArea(props) {
contentEditable={!disabled} contentEditable={!disabled}
dangerouslySetInnerHTML={{ __html: html }} dangerouslySetInnerHTML={{ __html: html }}
/> />
{!disabled ? (
<VariableSelect <VariableSelect
options={options} options={options}
setOptions={setOptions} setOptions={setOptions}
onInsert={onInsert} onInsert={onInsert}
changeOnSelect={changeOnSelect} changeOnSelect={changeOnSelect}
fieldNames={fieldNames || defaultFieldNames} fieldNames={fieldNames || defaultFieldNames}
disabled={disabled}
/> />
) : null}
</Space.Compact>, </Space.Compact>,
); );
} }

View File

@ -22,6 +22,7 @@ export function VariableSelect({
changeOnSelect = false, changeOnSelect = false,
fieldNames = {}, fieldNames = {},
className, className,
disabled,
}: { }: {
options: any[]; options: any[];
setOptions: (options: any) => void; setOptions: (options: any) => void;
@ -29,6 +30,7 @@ export function VariableSelect({
changeOnSelect?: boolean; changeOnSelect?: boolean;
fieldNames?: any; fieldNames?: any;
className?: string; className?: string;
disabled?: boolean;
}): JSX.Element { }): JSX.Element {
const { t } = useTranslation(); const { t } = useTranslation();
const [selectedVar, setSelectedVar] = useState<string[]>([]); const [selectedVar, setSelectedVar] = useState<string[]>([]);
@ -44,8 +46,9 @@ export function VariableSelect({
} }
return wrapSSR( return wrapSSR(
<XButton className={cx('x-button', componentCls, hashId, className)}> <XButton disabled={disabled} className={cx('x-button', componentCls, hashId, className)}>
<Cascader <Cascader
disabled={disabled}
placeholder={t('Select a variable')} placeholder={t('Select a variable')}
value={[]} value={[]}
options={options} options={options}