Content-Length: 20679 | pFad | http://github.com/lowcoder-org/lowcoder/pull/1699.patch

thub.com From 959a8869c969cd2e42e5a3a19b70867573283f5a Mon Sep 17 00:00:00 2001 From: Kamal Qureshi Date: Thu, 22 May 2025 15:17:53 +0500 Subject: [PATCH 1/4] Adds tooltips for button components --- .../src/comps/comps/buttonComp/buttonComp.tsx | 40 +++++----- .../comps/buttonComp/toggleButtonComp.tsx | 31 ++++---- .../comps/comps/meetingComp/controlButton.tsx | 79 ++++++++++--------- .../comps/comps/selectInputComp/radioComp.tsx | 7 +- 4 files changed, 84 insertions(+), 73 deletions(-) diff --git a/client/packages/lowcoder/src/comps/comps/buttonComp/buttonComp.tsx b/client/packages/lowcoder/src/comps/comps/buttonComp/buttonComp.tsx index 8b03c04925..5760a31694 100644 --- a/client/packages/lowcoder/src/comps/comps/buttonComp/buttonComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/buttonComp/buttonComp.tsx @@ -23,7 +23,7 @@ import { ButtonStyleControl, } from "./buttonCompConstants"; import { RefControl } from "comps/controls/refControl"; - +import { Tooltip } from "antd"; import React, { useContext, useEffect } from "react"; import { AnimationStyle } from "@lowcoder-ee/comps/controls/styleControlConstants"; import { styleControl } from "@lowcoder-ee/comps/controls/styleControl"; @@ -139,24 +139,26 @@ const ButtonTmpComp = (function () { {(editorState) => ( - - isDefault(props.type) ? props.onEvent("click") : submitForm(editorState, props.form) - } - > - {props.prefixIcon && {props.prefixIcon}} - { - props.text || (props.prefixIcon || props.suffixIcon ? undefined : " ") // Avoid button disappearing - } - {props.suffixIcon && {props.suffixIcon}} - + + + isDefault(props.type) ? props.onEvent("click") : submitForm(editorState, props.form) + } + > + {props.prefixIcon && {props.prefixIcon}} + { + props.text || (props.prefixIcon || props.suffixIcon ? undefined : " ") // Avoid button disappearing + } + {props.suffixIcon && {props.suffixIcon}} + + )} diff --git a/client/packages/lowcoder/src/comps/comps/buttonComp/toggleButtonComp.tsx b/client/packages/lowcoder/src/comps/comps/buttonComp/toggleButtonComp.tsx index f78fee7bb4..af9828e2af 100644 --- a/client/packages/lowcoder/src/comps/comps/buttonComp/toggleButtonComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/buttonComp/toggleButtonComp.tsx @@ -26,6 +26,7 @@ import { BoolControl } from "comps/controls/boolControl"; import { RefControl } from "comps/controls/refControl"; import React, { useContext, useEffect } from "react"; import { EditorContext } from "comps/editorState"; +import { Tooltip } from "antd"; const IconWrapper = styled.div` display: flex; @@ -78,20 +79,22 @@ const ToggleTmpComp = (function () { $showBorder={props.showBorder} $animationStyle={props.animationStyle} > - { - props.onEvent("change"); - props.value.onChange(!props.value.value); - }} - > - {props.iconPosition === "right" && text} - {{props.value.value ? props.trueIcon : props.falseIcon}} - {props.iconPosition === "left" && text} - + + { + props.onEvent("change"); + props.value.onChange(!props.value.value); + }} + > + {props.iconPosition === "right" && text} + {{props.value.value ? props.trueIcon : props.falseIcon}} + {props.iconPosition === "left" && text} + + ); }) diff --git a/client/packages/lowcoder/src/comps/comps/meetingComp/controlButton.tsx b/client/packages/lowcoder/src/comps/comps/meetingComp/controlButton.tsx index 28e318618c..e0cf843b62 100644 --- a/client/packages/lowcoder/src/comps/comps/meetingComp/controlButton.tsx +++ b/client/packages/lowcoder/src/comps/comps/meetingComp/controlButton.tsx @@ -39,6 +39,7 @@ import { useEffect, useRef, useState } from "react"; import ReactResizeDetector from "react-resize-detector"; import { useContext } from "react"; +import { Tooltip } from "antd"; const Container = styled.div<{ $style: any }>` height: 100%; @@ -242,48 +243,48 @@ let ButtonTmpComp = (function () { : undefined } > - - isDefault(props.type) - ? props.onEvent("click") - : submitForm(editorState, props.form) - } - > - {props.prefixIcon && ( - - {props.prefixIcon} - - )} - - + + + isDefault(props.type) + ? props.onEvent("click") + : submitForm(editorState, props.form) + } + > + {props.prefixIcon && ( + + {props.prefixIcon} + + )} + + )} - > - + > )} ); diff --git a/client/packages/lowcoder/src/comps/comps/selectInputComp/radioComp.tsx b/client/packages/lowcoder/src/comps/comps/selectInputComp/radioComp.tsx index 6bc4805cd1..671105eff8 100644 --- a/client/packages/lowcoder/src/comps/comps/selectInputComp/radioComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/selectInputComp/radioComp.tsx @@ -13,6 +13,7 @@ import { EllipsisTextCss, ValueFromOption } from "lowcoder-design"; import { trans } from "i18n"; import { fixOldInputCompData } from "../textInputComp/textInputConstants"; import { migrateOldData } from "comps/generators/simpleGenerators"; +import Tooltip from "antd/es/tooltip"; const getStyle = (style: RadioStyleType, inputFieldStyle?:RadioStyleType ) => { return css` @@ -122,7 +123,11 @@ let RadioBasicComp = (function () { options={props.options .filter((option) => option.value !== undefined && !option.hidden) .map((option) => ({ - label: option.label, + label: ( + + {option.label} + + ), value: option.value, disabled: option.disabled, }))} From f50ce811d64a7faa93c6b16f43fdcf5f097713cb Mon Sep 17 00:00:00 2001 From: Kamal Qureshi Date: Thu, 22 May 2025 16:18:59 +0500 Subject: [PATCH 2/4] - Added tooltip to control BUtton --- .../comps/comps/meetingComp/controlButton.tsx | 88 ++++++++++--------- 1 file changed, 45 insertions(+), 43 deletions(-) diff --git a/client/packages/lowcoder/src/comps/comps/meetingComp/controlButton.tsx b/client/packages/lowcoder/src/comps/comps/meetingComp/controlButton.tsx index 3888616942..f13dfbe69f 100644 --- a/client/packages/lowcoder/src/comps/comps/meetingComp/controlButton.tsx +++ b/client/packages/lowcoder/src/comps/comps/meetingComp/controlButton.tsx @@ -257,49 +257,51 @@ let ButtonTmpComp = (function () { : undefined } > - - isDefault(props.type) - ? props.onEvent("click") - : submitForm(editorState, props.form) - } - > - {props.sourceMode === 'standard' && props.prefixIcon && ( - - {props.prefixIcon} - - )} - {props.sourceMode === 'asset-library' && props.iconScoutAsset && ( - -

- - )} - + + + isDefault(props.type) + ? props.onEvent("click") + : submitForm(editorState, props.form) + } + > + {props.sourceMode === 'standard' && props.prefixIcon && ( + + {props.prefixIcon} + + )} + {props.sourceMode === 'asset-library' && props.iconScoutAsset && ( + +

+ + )} + + )} From 4ab8986261552c9be9257a6564e523ae61c5fb40 Mon Sep 17 00:00:00 2001 From: Kamal Qureshi Date: Thu, 22 May 2025 16:51:58 +0500 Subject: [PATCH 3/4] Added tooltips for checkboxes --- .../src/comps/comps/selectInputComp/checkboxComp.tsx | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/client/packages/lowcoder/src/comps/comps/selectInputComp/checkboxComp.tsx b/client/packages/lowcoder/src/comps/comps/selectInputComp/checkboxComp.tsx index d6eb38737c..e01699cf94 100644 --- a/client/packages/lowcoder/src/comps/comps/selectInputComp/checkboxComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/selectInputComp/checkboxComp.tsx @@ -24,6 +24,7 @@ import { trans } from "i18n"; import { RefControl } from "comps/controls/refControl"; import { migrateOldData } from "comps/generators/simpleGenerators"; import { fixOldInputCompData } from "../textInputComp/textInputConstants"; +import Tooltip from "antd/es/tooltip"; export const getStyle = (style: CheckboxStyleType) => { return css` @@ -182,7 +183,11 @@ let CheckboxBasicComp = (function () { options={props.options .filter((option) => option.value !== undefined && !option.hidden) .map((option) => ({ - label: option.label, + label: ( + + {option.label} + + ), value: option.value, disabled: option.disabled, }))} From 8974731399a3092779abc90cd111df509d0679f4 Mon Sep 17 00:00:00 2001 From: Kamal Qureshi Date: Fri, 23 May 2025 00:07:06 +0500 Subject: [PATCH 4/4] Fix merge conflicts --- .../comps/selectInputComp/checkboxComp.tsx | 18 +++++++----------- .../comps/comps/selectInputComp/radioComp.tsx | 14 ++++++-------- 2 files changed, 13 insertions(+), 19 deletions(-) diff --git a/client/packages/lowcoder/src/comps/comps/selectInputComp/checkboxComp.tsx b/client/packages/lowcoder/src/comps/comps/selectInputComp/checkboxComp.tsx index d2d9ade515..a14983cfa5 100644 --- a/client/packages/lowcoder/src/comps/comps/selectInputComp/checkboxComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/selectInputComp/checkboxComp.tsx @@ -156,7 +156,7 @@ const MemoizedCheckboxGroup = memo(({ disabled: boolean; style: CheckboxStyleType; layout: ValueFromOption; - options: Array<{ label: string; value: string; disabled?: boolean }>; + options: Array<{ label: any; value: string; disabled?: boolean }>; onChange: (values: string[]) => void; viewRef: React.Ref; tabIndex?: number @@ -231,7 +231,11 @@ let CheckboxBasicComp = (function () { return props.options .filter((option) => option.value !== undefined && !option.hidden) .map((option) => ({ - label: option.label, + label: ( + + {option.label} + + ), value: option.value, disabled: option.disabled, })); @@ -249,15 +253,7 @@ let CheckboxBasicComp = (function () { disabled={props.disabled} style={props.inputFieldStyle} layout={props.layout} - options={filteredOptions() - .map((option) => ({ - label: ( - - {option.label} - - ) - }) - )} + options={filteredOptions()} onChange={handleValidateChange} viewRef={props.viewRef} tabIndex={typeof props.tabIndex === 'number' ? props.tabIndex : undefined} diff --git a/client/packages/lowcoder/src/comps/comps/selectInputComp/radioComp.tsx b/client/packages/lowcoder/src/comps/comps/selectInputComp/radioComp.tsx index 27a53f0cd8..8bfe2a7b92 100644 --- a/client/packages/lowcoder/src/comps/comps/selectInputComp/radioComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/selectInputComp/radioComp.tsx @@ -134,7 +134,11 @@ const MemoizedRadio = memo(({ return options .filter((option) => option.value !== undefined && !option.hidden) .map((option) => ({ - label: option.label, + label: ( + + {option.label} + + ), value: option.value, disabled: option.disabled, })); @@ -196,13 +200,7 @@ let RadioBasicComp = (function () { style={props.style} inputFieldStyle={props.inputFieldStyle} layout={props.layout} - options={props.options.map((option) => ({ - label: ( - - {option.label} - - )} - ))} + options={props.options} onChange={handleValidateChange} viewRef={(el) => { if (!mountedRef.current) return;

pFad - (p)hone/(F)rame/(a)nonymizer/(d)eclutterfier! Saves Data!