Skip to content

Commit 4968106

Browse files
FredLL-AvaigaFred Lefévère-Laoide
andauthored
hover_text not working on tgb.number control (#2792)
* Bug 2791 Tooltip need to have one "real" children * errorFallback props --------- Co-authored-by: Fred Lefévère-Laoide <Fred.Lefevere-Laoide@Taipy.io>
1 parent 0aa3cc5 commit 4968106

File tree

12 files changed

+1112
-1260
lines changed

12 files changed

+1112
-1260
lines changed

frontend/taipy-gui/dom/package-lock.json

Lines changed: 7 additions & 7 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

frontend/taipy-gui/package-lock.json

Lines changed: 545 additions & 604 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

frontend/taipy-gui/src/components/Taipy/Field.tsx

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -47,32 +47,32 @@ const Field = (props: TaipyFieldProps) => {
4747

4848
const style = useMemo(
4949
() => ({ overflow: "auto", width: props.width ? getCssSize(props.width) : undefined }),
50-
[props.width]
50+
[props.width],
5151
);
5252
const typoSx = useMemo(
5353
() =>
5454
props.width
5555
? { ...unsetWeightSx, overflow: "auto", width: getCssSize(props.width), display: "inline-block" }
5656
: unsetWeightSx,
57-
[props.width]
57+
[props.width],
5858
);
5959

6060
const value = useMemo(() => {
6161
return formatWSValue(
6262
props.value !== undefined ? props.value : defaultValue || "",
6363
dataType,
6464
format,
65-
formatConfig
65+
formatConfig,
6666
);
6767
}, [defaultValue, props.value, dataType, format, formatConfig]);
6868

6969
return (
70-
<Tooltip title={hover || ""}>
71-
<>
70+
<>
71+
<Tooltip title={hover || ""}>
7272
{mode == "pre" ? (
7373
<pre
7474
className={`${className} ${getSuffixedClassNames(className, "-pre")} ${getComponentClassName(
75-
props.children
75+
props.children,
7676
)}`}
7777
id={id}
7878
style={style}
@@ -83,7 +83,7 @@ const Field = (props: TaipyFieldProps) => {
8383
<div
8484
className={`${className} ${getSuffixedClassNames(
8585
className,
86-
"-markdown"
86+
"-markdown",
8787
)} ${getComponentClassName(props.children)}`}
8888
>
8989
<Suspense fallback={<div>Loading Markdown...</div>}>
@@ -93,7 +93,7 @@ const Field = (props: TaipyFieldProps) => {
9393
) : raw || mode == "raw" ? (
9494
<span
9595
className={`${className} ${getSuffixedClassNames(className, "-raw")} ${getComponentClassName(
96-
props.children
96+
props.children,
9797
)}`}
9898
id={id}
9999
style={style}
@@ -103,7 +103,7 @@ const Field = (props: TaipyFieldProps) => {
103103
) : mode == "latex" ? (
104104
<MathJax
105105
className={`${className} ${getSuffixedClassNames(className, "-latex")} ${getComponentClassName(
106-
props.children
106+
props.children,
107107
)}`}
108108
id={id}
109109
dynamic={true}
@@ -122,9 +122,9 @@ const Field = (props: TaipyFieldProps) => {
122122
{value}
123123
</Typography>
124124
)}
125-
{props.children}
126-
</>
127-
</Tooltip>
125+
</Tooltip>
126+
{props.children}
127+
</>
128128
);
129129
};
130130

frontend/taipy-gui/src/components/Taipy/Image.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ const Image = (props: ImageProps) => {
6666
display: inlineSvg ? "inline-flex" : undefined,
6767
verticalAlign: inlineSvg ? "middle" : undefined,
6868
}),
69-
[width, height, inlineSvg]
69+
[width, height, inlineSvg],
7070
);
7171

7272
useEffect(() => {
@@ -78,8 +78,8 @@ const Image = (props: ImageProps) => {
7878
}, [svg, svgContent]);
7979

8080
return (
81-
<Tooltip title={hover || label}>
82-
<>
81+
<>
82+
<Tooltip title={hover || label}>
8383
{onAction ? (
8484
<span>
8585
<Button
@@ -115,9 +115,9 @@ const Image = (props: ImageProps) => {
115115
alt={label}
116116
/>
117117
)}
118-
{props.children}
119-
</>
120-
</Tooltip>
118+
</Tooltip>
119+
{props.children}
120+
</>
121121
);
122122
};
123123

frontend/taipy-gui/src/components/Taipy/Input.tsx

Lines changed: 44 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -97,7 +97,7 @@ const Input = (props: TaipyInputProps) => {
9797
maxWidth: getCssSize(props.width),
9898
}
9999
: numberSx,
100-
[props.width]
100+
[props.width],
101101
);
102102

103103
// 0 if value is not a number, 1 means general number, 2 means integer
@@ -128,7 +128,7 @@ const Input = (props: TaipyInputProps) => {
128128
dispatch(createSendUpdateAction(updateVarName, value, module, onChange, propagate));
129129
}, changeDelay);
130130
},
131-
[changeDelay, numberType, dispatch, updateVarName, module, onChange, propagate]
131+
[changeDelay, numberType, dispatch, updateVarName, module, onChange, propagate],
132132
);
133133

134134
const handleInput = useCallback(
@@ -144,7 +144,13 @@ const Input = (props: TaipyInputProps) => {
144144
if (changeDelay === 0) {
145145
Promise.resolve().then(() => {
146146
dispatch(
147-
createSendUpdateAction(updateVarName, valToNumber(val, numberType), module, onChange, propagate)
147+
createSendUpdateAction(
148+
updateVarName,
149+
valToNumber(val, numberType),
150+
module,
151+
onChange,
152+
propagate,
153+
),
148154
);
149155
});
150156
}
@@ -154,11 +160,11 @@ const Input = (props: TaipyInputProps) => {
154160
delayCall.current = window.setTimeout(() => {
155161
delayCall.current = -1;
156162
dispatch(
157-
createSendUpdateAction(updateVarName, valToNumber(val, numberType), module, onChange, propagate)
163+
createSendUpdateAction(updateVarName, valToNumber(val, numberType), module, onChange, propagate),
158164
);
159165
}, changeDelay);
160166
},
161-
[changeDelay, numberType, dispatch, updateVarName, module, onChange, propagate]
167+
[changeDelay, numberType, dispatch, updateVarName, module, onChange, propagate],
162168
);
163169

164170
const handleBlur = useCallback(
@@ -189,7 +195,7 @@ const Input = (props: TaipyInputProps) => {
189195
});
190196
evt.preventDefault();
191197
},
192-
[dispatch, numberType, min, max, updateVarName, module, onChange, propagate, changeDelay, id, onAction]
198+
[dispatch, numberType, min, max, updateVarName, module, onChange, propagate, changeDelay, id, onAction],
193199
);
194200

195201
const handleAction = useCallback(
@@ -220,10 +226,10 @@ const Input = (props: TaipyInputProps) => {
220226
const val = multiline
221227
? evt.currentTarget.querySelector("textarea")?.value
222228
: numberType
223-
? numberType === IsInteger
224-
? Math.round(Number(evt.currentTarget.querySelector("input")?.value))
225-
: Number(evt.currentTarget.querySelector("input")?.value)
226-
: evt.currentTarget.querySelector("input")?.value;
229+
? numberType === IsInteger
230+
? Math.round(Number(evt.currentTarget.querySelector("input")?.value))
231+
: Number(evt.currentTarget.querySelector("input")?.value)
232+
: evt.currentTarget.querySelector("input")?.value;
227233

228234
if (changeDelay > 0 && delayCall.current > 0) {
229235
clearTimeout(delayCall.current);
@@ -253,7 +259,7 @@ const Input = (props: TaipyInputProps) => {
253259
changeDelay,
254260
onChange,
255261
propagate,
256-
]
262+
],
257263
);
258264

259265
const roundBasedOnStep = useMemo(() => {
@@ -279,7 +285,7 @@ const Input = (props: TaipyInputProps) => {
279285
step || 1,
280286
stepMultiplier || 10,
281287
event.shiftKey,
282-
increment
288+
increment,
283289
);
284290

285291
if (min !== undefined && Number(newValue) < min) {
@@ -296,29 +302,29 @@ const Input = (props: TaipyInputProps) => {
296302
return newValue;
297303
});
298304
},
299-
[calculateNewValue, step, stepMultiplier, min, max, updateValueWithDelay]
305+
[calculateNewValue, step, stepMultiplier, min, max, updateValueWithDelay],
300306
);
301307

302308
const handleUpStepperMouseDown = useCallback(
303309
(event: React.MouseEvent<HTMLButtonElement>) => {
304310
handleStepperMouseDown(event, true);
305311
},
306-
[handleStepperMouseDown]
312+
[handleStepperMouseDown],
307313
);
308314

309315
const handleDownStepperMouseDown = useCallback(
310316
(event: React.MouseEvent<HTMLButtonElement>) => {
311317
handleStepperMouseDown(event, false);
312318
},
313-
[handleStepperMouseDown]
319+
[handleStepperMouseDown],
314320
);
315321

316322
// password
317323
const [showPassword, setShowPassword] = useState(false);
318324
const handleClickShowPassword = useCallback(() => setShowPassword((show) => !show), []);
319325
const handleMouseDownPassword = useCallback(
320326
(event: React.MouseEvent<HTMLButtonElement>) => event.preventDefault(),
321-
[]
327+
[],
322328
);
323329
const inputProps = useMemo(
324330
() =>
@@ -355,22 +361,22 @@ const Input = (props: TaipyInputProps) => {
355361
},
356362
}
357363
: type == "password"
358-
? {
359-
htmlInput: { autoComplete: "current-password" },
360-
input: {
361-
endAdornment: (
362-
<IconButton
363-
aria-label="Toggle password visibility"
364-
onClick={handleClickShowPassword}
365-
onMouseDown={handleMouseDownPassword}
366-
edge="end"
367-
>
368-
{showPassword ? <VisibilityOff /> : <Visibility />}
369-
</IconButton>
370-
),
371-
},
372-
}
373-
: undefined,
364+
? {
365+
htmlInput: { autoComplete: "current-password" },
366+
input: {
367+
endAdornment: (
368+
<IconButton
369+
aria-label="Toggle password visibility"
370+
onClick={handleClickShowPassword}
371+
onMouseDown={handleMouseDownPassword}
372+
edge="end"
373+
>
374+
{showPassword ? <VisibilityOff /> : <Visibility />}
375+
</IconButton>
376+
),
377+
},
378+
}
379+
: undefined,
374380
[
375381
active,
376382
type,
@@ -382,7 +388,7 @@ const Input = (props: TaipyInputProps) => {
382388
handleMouseDownPassword,
383389
handleUpStepperMouseDown,
384390
handleDownStepperMouseDown,
385-
]
391+
],
386392
);
387393

388394
useEffect(() => {
@@ -392,8 +398,8 @@ const Input = (props: TaipyInputProps) => {
392398
}, [props.value]);
393399

394400
return (
395-
<Tooltip title={hover || ""}>
396-
<>
401+
<>
402+
<Tooltip title={hover || ""}>
397403
<TextField
398404
sx={textSx}
399405
margin="dense"
@@ -413,9 +419,9 @@ const Input = (props: TaipyInputProps) => {
413419
maxRows={linesShown}
414420
size={size}
415421
/>
416-
{props.children}
417-
</>
418-
</Tooltip>
422+
</Tooltip>
423+
{props.children}
424+
</>
419425
);
420426
};
421427
export default Input;

frontend/taipy-gui/src/components/Taipy/Menu.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
* specific language governing permissions and limitations under the License.
1212
*/
1313

14-
import React, { useCallback, useMemo, useState, MouseEvent, CSSProperties,useEffect } from "react";
14+
import React, { useCallback, useMemo, useState, MouseEvent, CSSProperties, useEffect } from "react";
1515
import MenuIco from "@mui/icons-material/Menu";
1616
import ListItemButton from "@mui/material/ListItemButton";
1717
import Drawer from "@mui/material/Drawer";

0 commit comments

Comments
 (0)