Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 4e21471

Browse files
removed tooltip from column types and placed in abstract level for all columns
1 parent 2ef23dd commit 4e21471

21 files changed

+144
-205
lines changed

‎client/packages/lowcoder/src/components/table/EditableCell.tsx

Lines changed: 45 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import styled from "styled-components";
77
import { JSONValue } from "util/jsonTypes";
88
import ColumnTypeView from "./columnTypeView";
99
import { TableCellContext } from "comps/comps/tableComp/tableContext";
10+
import Tooltip from "antd/es/tooltip";
1011

1112
type StatusType = PresetStatusColorType | "none";
1213
export const TABLE_EDITABLE_SWITCH_ON = true;
@@ -35,6 +36,7 @@ export interface CellProps {
3536
candidateTags?: string[];
3637
candidateStatus?: { text: string; status: StatusType }[];
3738
textOverflow?: boolean;
39+
cellTooltip?: string;
3840
onTableEvent?: (eventName: any) => void;
3941
}
4042

@@ -54,6 +56,25 @@ const BorderDiv = styled.div`
5456
left: 0;
5557
`;
5658

59+
const CellWrapper = ({
60+
children,
61+
tooltipTitle,
62+
}: {
63+
children: ReactNode,
64+
tooltipTitle?: string,
65+
}) => {
66+
if (tooltipTitle) {
67+
return (
68+
<Tooltip title={tooltipTitle} placement="topLeft">
69+
{children}
70+
</Tooltip>
71+
)
72+
}
73+
return (
74+
<>{children}</>
75+
)
76+
};
77+
5778
interface EditableCellProps<T> extends CellProps {
5879
normalView: ReactNode;
5980
dispatch: DispatchType;
@@ -123,28 +144,31 @@ export function EditableCell<T extends JSONValue>(props: EditableCellProps<T>) {
123144
</>
124145
);
125146
}
126-
147+
127148
return (
128-
<ColumnTypeView
129-
textOverflow={props.textOverflow}
130-
>
131-
{status === "toSave" && !isEditing && <EditableChip />}
132-
{!editable && normalView}
133-
{/* overlay on normal view to handle double click for editing */}
134-
{editable && (
135-
<div
136-
style={{
137-
position: 'absolute',
138-
top: 0,
139-
left: 0,
140-
width: '100%',
141-
height: '100%',
142-
}}
143-
onDoubleClick={enterEditFn}
144-
>
149+
<ColumnTypeView
150+
textOverflow={props.textOverflow}
151+
>
152+
{status === "toSave" && !isEditing && <EditableChip />}
153+
<CellWrapper tooltipTitle={props.cellTooltip}>
145154
{normalView}
146-
</div>
147-
)}
148-
</ColumnTypeView>
155+
</CellWrapper>
156+
{/* overlay on normal view to handle double click for editing */}
157+
{editable && (
158+
<CellWrapper tooltipTitle={props.cellTooltip}>
159+
<div
160+
style={{
161+
position: 'absolute',
162+
top: 0,
163+
left: 0,
164+
width: '100%',
165+
height: '100%',
166+
}}
167+
onDoubleClick={enterEditFn}
168+
>
169+
</div>
170+
</CellWrapper>
171+
)}
172+
</ColumnTypeView>
149173
);
150174
}

‎client/packages/lowcoder/src/comps/comps/tableComp/column/columnTypeComps/ColumnNumberComp.tsx

Lines changed: 2 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ import { withDefault } from "comps/generators";
88
import styled from "styled-components";
99
import { IconControl } from "comps/controls/iconControl";
1010
import { hasIcon } from "comps/utils";
11-
import Tooltip from "antd/es/tooltip";
1211

1312
const InputNumberWrapper = styled.div`
1413
.ant-input-number {
@@ -27,7 +26,6 @@ const InputNumberWrapper = styled.div`
2726

2827
const childrenMap = {
2928
text: NumberControl,
30-
tooltip: StringControl,
3129
step: withDefault(NumberControl, 1),
3230
precision: RangeControl.closed(0, 20, 0),
3331
float: BoolControl,
@@ -60,15 +58,13 @@ export const ColumnNumberComp = (function () {
6058
formattedValue = formattedValue.toFixed(precision + 1);
6159
}
6260
return (
63-
<Tooltip title={props.tooltip}>
64-
{hasIcon(props.prefixIcon) && (
61+
<>{hasIcon(props.prefixIcon) && (
6562
<span>{props.prefixIcon}</span>
6663
)}
6764
<span>{props.prefix + formattedValue + props.suffix}</span>
6865
{hasIcon(props.suffixIcon) && (
6966
<span>{props.suffixIcon}</span>
70-
)}
71-
</Tooltip>
67+
)} </>
7268
);
7369
},
7470
(nodeValue) => nodeValue.text.value,
@@ -99,10 +95,6 @@ export const ColumnNumberComp = (function () {
9995
label: trans("table.columnValue"),
10096
tooltip: ColumnValueTooltip,
10197
})}
102-
{children.tooltip.propertyView({
103-
label: trans("table.columnTooltip"),
104-
tooltip: ColumnValueTooltip,
105-
})}
10698
{children.step.propertyView({
10799
label: trans("table.numberStep"),
108100
tooltip: trans("table.numberStepTooltip"),

‎client/packages/lowcoder/src/comps/comps/tableComp/column/columnTypeComps/columnBooleanComp.tsx

Lines changed: 7 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { BoolCodeControl,StringControl } from "comps/controls/codeControl";
1+
import { BoolCodeControl } from "comps/controls/codeControl";
22
import { trans } from "i18n";
33
import { default as Checkbox } from "antd/es/checkbox";
44
import { ColumnTypeCompBuilder, ColumnTypeViewFn } from "../columnTypeCompBuilder";
@@ -11,7 +11,6 @@ import { dropdownControl } from "comps/controls/dropdownControl";
1111
import { TableCheckedIcon, TableUnCheckedIcon } from "lowcoder-design";
1212
import { IconControl } from "comps/controls/iconControl";
1313
import { hasIcon } from "comps/utils";
14-
import Tooltip from "antd/es/tooltip";
1514

1615
const CheckboxStyled = styled(Checkbox)<{ $style: CheckboxStyleType }>`
1716
${(props) => props.$style && getStyle(props.$style)}
@@ -52,7 +51,6 @@ const falseValuesOptions = [
5251

5352
const childrenMap = {
5453
text: BoolCodeControl,
55-
tooltip: StringControl,
5654
falseValues: dropdownControl(falseValuesOptions, ""),
5755
iconTrue: IconControl,
5856
iconFalse: IconControl,
@@ -96,14 +94,12 @@ export const BooleanComp = (function () {
9694
const CheckBoxComp = () => {
9795
const style = useStyle(CheckboxStyle);
9896
return (
99-
<Tooltip title={props.tooltip}>
100-
<IconWrapper $style={style} $ifChecked={value}>
101-
{value === true ? ( hasIcon(props.iconTrue) ? props.iconTrue : <TableCheckedIcon /> )
102-
: value === false ? ( hasIcon(props.iconFalse) ? props.iconFalse : ( props.falseValues === "x" ? <TableUnCheckedIcon /> : props.falseValues )
103-
) : ( hasIcon(props.iconNull) ? props.iconNull : "No Value"
104-
)}
105-
</IconWrapper>
106-
</Tooltip>
97+
<IconWrapper $style={style} $ifChecked={value}>
98+
{value === true ? ( hasIcon(props.iconTrue) ? props.iconTrue : <TableCheckedIcon /> )
99+
: value === false ? ( hasIcon(props.iconFalse) ? props.iconFalse : ( props.falseValues === "x" ? <TableUnCheckedIcon /> : props.falseValues )
100+
) : ( hasIcon(props.iconNull) ? props.iconNull : "No Value"
101+
)}
102+
</IconWrapper>
107103
);
108104
};
109105
return <CheckBoxComp />;
@@ -127,10 +123,6 @@ export const BooleanComp = (function () {
127123
label: trans("table.columnValue"),
128124
tooltip: ColumnValueTooltip,
129125
})}
130-
{children.tooltip.propertyView({
131-
label: trans("table.columnTooltip"),
132-
tooltip: ColumnValueTooltip,
133-
})}
134126
{children.falseValues.propertyView({
135127
label: trans("table.falseValues"),
136128
radioButton: true,

‎client/packages/lowcoder/src/comps/comps/tableComp/column/columnTypeComps/columnDateComp.tsx

Lines changed: 1 addition & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,6 @@ import { CalendarCompIconSmall, PrevIcon, SuperPrevIcon } from "lowcoder-design"
1515
import { useState } from "react";
1616
import styled from "styled-components";
1717
import { DateParser, DATE_FORMAT } from "util/dateTimeUtils";
18-
import Tooltip from "antd/es/tooltip";
1918

2019
dayjs.extend(utc)
2120

@@ -137,7 +136,6 @@ export function formatDate(date: string, format: string) {
137136

138137
const childrenMap = {
139138
text: StringControl,
140-
tooltip: StringControl,
141139
format: withDefault(StringControl, DATE_FORMAT),
142140
};
143141

@@ -197,12 +195,7 @@ export const DateComp = (function () {
197195
childrenMap,
198196
(props, dispatch) => {
199197
const value = props.changeValue ?? getBaseValue(props, dispatch);
200-
const view = formatDate(value, props.format);
201-
return (
202-
<Tooltip title={props.tooltip}>
203-
{view}
204-
</Tooltip>
205-
);
198+
return formatDate(value, props.format);
206199
},
207200
(nodeValue) => formatDate(nodeValue.text.value, nodeValue.format.value),
208201
getBaseValue
@@ -221,10 +214,6 @@ export const DateComp = (function () {
221214
label: trans("table.columnValue"),
222215
tooltip: ColumnValueTooltip,
223216
})}
224-
{children.tooltip.propertyView({
225-
label: trans("table.columnTooltip"),
226-
tooltip: ColumnValueTooltip,
227-
})}
228217
{formatPropertyView({ children, placeholder: DATE_FORMAT })}
229218
</>
230219
))

‎client/packages/lowcoder/src/comps/comps/tableComp/column/columnTypeComps/columnDateTimeComp.tsx

Lines changed: 1 addition & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,9 @@ import { formatPropertyView } from "comps/utils/propertyUtils";
99
import { trans } from "i18n";
1010
import { DATE_TIME_FORMAT } from "util/dateTimeUtils";
1111
import { DateEdit, formatDate } from "./columnDateComp";
12-
import Tooltip from "antd/es/tooltip";
1312

1413
const childrenMap = {
1514
text: StringControl,
16-
tooltip: StringControl,
1715
format: withDefault(StringControl, DATE_TIME_FORMAT),
1816
};
1917

@@ -24,12 +22,7 @@ export const DateTimeComp = (function () {
2422
childrenMap,
2523
(props, dispatch) => {
2624
const value = props.changeValue ?? getBaseValue(props, dispatch);
27-
const view = formatDate(value, props.format);
28-
return (
29-
<Tooltip title={props.tooltip}>
30-
{view}
31-
</Tooltip>
32-
)
25+
return formatDate(value, props.format);
3326
},
3427
(nodeValue) => formatDate(nodeValue.text.value, nodeValue.format.value),
3528
getBaseValue
@@ -48,10 +41,6 @@ export const DateTimeComp = (function () {
4841
label: trans("table.columnValue"),
4942
tooltip: ColumnValueTooltip,
5043
})}
51-
{children.tooltip.propertyView({
52-
label: trans("table.columnTooltip"),
53-
tooltip: ColumnValueTooltip,
54-
})}
5544
{formatPropertyView({ children, placeholder: DATE_TIME_FORMAT })}
5645
</>
5746
))

‎client/packages/lowcoder/src/comps/comps/tableComp/column/columnTypeComps/columnImgComp.tsx

Lines changed: 1 addition & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,12 @@ import { StringControl, NumberControl } from "comps/controls/codeControl";
77
import { trans } from "i18n";
88
import { withDefault } from "comps/generators";
99
import { TacoImage } from "lowcoder-design";
10-
import Tooltip from "antd/es/tooltip";
1110

1211
export const ColumnValueTooltip = trans("table.columnValueTooltip");
1312

1413
const childrenMap = {
1514
src: withDefault(StringControl, "{{currentCell}}"),
1615
size: withDefault(NumberControl, "50"),
17-
tooltip: StringControl,
1816
};
1917

2018
const getBaseValue: ColumnTypeViewFn<typeof childrenMap, string, string> = (props) => props.src;
@@ -24,11 +22,7 @@ export const ImageComp = (function () {
2422
childrenMap,
2523
(props, dispatch) => {
2624
const value = props.changeValue ?? getBaseValue(props, dispatch);
27-
return (
28-
<Tooltip title={props.tooltip}>
29-
<TacoImage style={{ pointerEvents: "auto" }} src={value} width={props.size} />;
30-
</Tooltip>
31-
);
25+
return <TacoImage style={{ pointerEvents: "auto" }} src={value} width={props.size} />;
3226
},
3327
(nodeValue) => nodeValue.src.value,
3428
getBaseValue
@@ -53,10 +47,6 @@ export const ImageComp = (function () {
5347
label: trans("table.imageSrc"),
5448
tooltip: ColumnValueTooltip,
5549
})}
56-
{children.tooltip.propertyView({
57-
label: trans("table.columnTooltip"),
58-
tooltip: ColumnValueTooltip,
59-
})}
6050
{children.size.propertyView({
6151
label: trans("table.imageSize"),
6252
})}

‎client/packages/lowcoder/src/comps/comps/tableComp/column/columnTypeComps/columnLinkComp.tsx

Lines changed: 3 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -10,13 +10,11 @@ import { disabledPropertyView } from "comps/utils/propertyUtils";
1010
import styled, { css } from "styled-components";
1111
import { styleControl } from "comps/controls/styleControl";
1212
import { TableColumnLinkStyle } from "comps/controls/styleControlConstants";
13-
import Tooltip from "antd/es/tooltip";
1413

1514
export const ColumnValueTooltip = trans("table.columnValueTooltip");
1615

1716
const childrenMap = {
1817
text: StringControl,
19-
tooltip: StringControl,
2018
onClick: ActionSelectorControlInContext,
2119
disabled: BoolCodeControl,
2220
style: styleControl(TableColumnLinkStyle),
@@ -34,16 +32,14 @@ const StyledLink = styled.a<{ $disabled: boolean }>`
3432
${(props) => props.$disabled && disableCss};
3533
`;
3634

37-
export const ColumnLink = (props: { disabled: boolean; label: string; tooltip?: string,onClick?: () => void }) => (
35+
export const ColumnLink = (props: { disabled: boolean; label: string; onClick?: () => void }) => (
3836
<StyledLink
3937
$disabled={props.disabled}
4038
onClick={() => {
4139
!props.disabled && props.onClick && props.onClick();
4240
}}
4341
>
44-
<Tooltip title={props.tooltip}>
45-
{props.label}
46-
</Tooltip>
42+
{props.label}
4743
</StyledLink>
4844
);
4945

@@ -54,7 +50,7 @@ export const LinkComp = (function () {
5450
childrenMap,
5551
(props, dispatch) => {
5652
const value = props.changeValue ?? getBaseValue(props, dispatch);
57-
return <ColumnLink disabled={props.disabled} label={value} tooltip={props.tooltip}onClick={props.onClick} />;
53+
return <ColumnLink disabled={props.disabled} label={value} onClick={props.onClick} />;
5854
},
5955
(nodeValue) => nodeValue.text.value,
6056
getBaseValue
@@ -78,10 +74,6 @@ export const LinkComp = (function () {
7874
label: trans("table.columnValue"),
7975
tooltip: ColumnValueTooltip,
8076
})}
81-
{children.tooltip.propertyView({
82-
label: trans("table.columnTooltip"),
83-
tooltip: ColumnValueTooltip,
84-
})}
8577
{disabledPropertyView(children)}
8678
{children.onClick.propertyView({
8779
label: trans("table.action"),

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /