Skip to content

Commit 0ccbd38

Browse files
freddysundownerfreddysundowner
committed
Merge branch 'dev' of https://github.com/lowcoder-org/lowcoder into dev
2 parents 1a7cfec + dea9f65 commit 0ccbd38

File tree

64 files changed

+301
-2229
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

64 files changed

+301
-2229
lines changed

‎client/packages/lowcoder-comps/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "lowcoder-comps",
3-
"version": "2.4.5",
3+
"version": "2.4.6",
44
"type": "module",
55
"license": "MIT",
66
"dependencies": {

‎client/packages/lowcoder-design/src/components/Section.tsx

Lines changed: 33 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import styled from "styled-components";
44
import { ReactComponent as Packup } from "icons/icon-Pack-up.svg";
55
import { labelCss } from "./Label";
66
import { controlItem, ControlNode } from "./control";
7+
import { Tooltip } from "./toolTip";
78

89
const SectionItem = styled.div<{ $width?: number }>`
910
width: ${(props) => (props.$width ? props.$width : 312)}px;
@@ -73,6 +74,12 @@ const ShowChildren = styled.div<{ $show?: string; $noMargin?: boolean }>`
7374
padding-right: ${(props) => (props.$noMargin ? 0 : "16px")};
7475
`;
7576

77+
const TooltipWrapper = styled.span`
78+
word-wrap: break-word;
79+
word-break: break-word;
80+
white-space: pre-wrap;
81+
color:#fff;
82+
`;
7683
interface ISectionConfig<T> {
7784
name?: string;
7885
open?: boolean;
@@ -81,6 +88,7 @@ interface ISectionConfig<T> {
8188
style?: React.CSSProperties;
8289
children: T;
8390
additionalButton?: React.ReactNode;
91+
hasTooltip?: boolean;
8492
}
8593

8694
export interface PropertySectionState {
@@ -102,7 +110,7 @@ export const PropertySectionContext = React.createContext<PropertySectionContext
102110
});
103111

104112
export const BaseSection = (props: ISectionConfig<ReactNode>) => {
105-
const { name } = props;
113+
const { name,hasTooltip } = props;
106114
const { compName, state, toggle } = useContext(PropertySectionContext);
107115
const open = props.open !== undefined ? props.open : name ? state[compName]?.[name] !== false : true;
108116

@@ -118,17 +126,35 @@ export const BaseSection = (props: ISectionConfig<ReactNode>) => {
118126
return (
119127
<SectionItem $width={props.width} style={props.style}>
120128
{props.name && (
121-
<SectionLabelDiv onClick={handleToggle} className={"section-header"}>
129+
<SectionLabelDiv onClick={handleToggle} className={'section-header'}>
122130
<SectionLabel>{props.name}</SectionLabel>
123-
<div style={{ display: "flex" }}>
131+
<div style={{display: 'flex'}}>
124132
{open && props.additionalButton}
125-
<PackupIcon deg={open ? "rotate(0deg)" : "rotate(180deg)"} />
133+
<PackupIcon deg={open ? 'rotate(0deg)' : 'rotate(180deg)'} />
126134
</div>
127135
</SectionLabelDiv>
128136
)}
129-
<ShowChildren $show={open ? "flex" : "none"} $noMargin={props.noMargin}>
130-
{props.children}
131-
</ShowChildren>
137+
<Tooltip
138+
title={
139+
hasTooltip && (
140+
<TooltipWrapper>
141+
Here you can enter the animation type codes. Like bounce, swing or
142+
tada. Read more about all possible codes at:{" "}
143+
<a href="https://animate.style">https://animate.style</a>
144+
</TooltipWrapper>
145+
)
146+
}
147+
arrow={{
148+
pointAtCenter: true,
149+
}}
150+
placement="top"
151+
color="#2c2c2c"
152+
getPopupContainer={(node: any) => node.closest('.react-grid-item')}
153+
>
154+
<ShowChildren $show={open ? 'flex' : 'none'} $noMargin={props.noMargin}>
155+
{props.children}
156+
</ShowChildren>
157+
</Tooltip>
132158
</SectionItem>
133159
);
134160
};

‎client/packages/lowcoder/package.json

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,6 @@
2929
"@rjsf/core": "^5.15.1",
3030
"@rjsf/utils": "^5.15.1",
3131
"@rjsf/validator-ajv8": "^5.15.1",
32-
"@stoplight/elements": "^8.1.3",
3332
"@types/lodash": "^4.14.194",
3433
"@types/node": "^16.7.13",
3534
"@types/react": "^18.2.45",

‎client/packages/lowcoder/src/comps/comps/autoCompleteComp/autoCompleteComp.tsx

Lines changed: 24 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ import {
1616
withExposingConfigs,
1717
} from "comps/generators/withExposing";
1818
import styled, { css } from "styled-components";
19-
import { UICompBuilder } from "../../generators";
19+
import { UICompBuilder, withDefault } from "../../generators";
2020
import { FormDataPropertyView } from "../formComp/formDataConstants";
2121
import { jsonControl } from "comps/controls/codeControl";
2222
import { dropdownControl } from "comps/controls/dropdownControl";
@@ -58,7 +58,8 @@ import {
5858

5959

6060

61-
const InputStyle = styled(Input)<{ $style: InputLikeStyleType }>`
61+
const InputStyle = styled(Input) <{ $style: InputLikeStyleType }>`
62+
box-shadow: ${props=>`${props.$style?.boxShadow} ${props.$style?.boxShadowColor}`};
6263
${(props) => css`
6364
${getStyle(props.$style)}
6465
input {
@@ -75,7 +76,7 @@ const childrenMap = {
7576
...textInputChildren,
7677
viewRef: RefControl<InputRef>,
7778
allowClear: BoolControl.DEFAULT_TRUE,
78-
style: styleControl(InputFieldStyle),
79+
style: withDefault(styleControl(InputFieldStyle),{background:'transparent'}),
7980
labelStyle:styleControl(LabelStyle),
8081
prefixIcon: IconControl,
8182
suffixIcon: IconControl,
@@ -89,7 +90,7 @@ const childrenMap = {
8990
autocompleteIconColor: dropdownControl(autocompleteIconColor, "blue"),
9091
componentSize: dropdownControl(componentSize, "small"),
9192
valueInItems: booleanExposingStateControl("valueInItems"),
92-
inputFieldStyle: styleControl(InputLikeStyle),
93+
inputFieldStyle: withDefault(styleControl(InputLikeStyle),{borderWidth:'1px'}),
9394
animationStyle: styleControl(AnimationStyle),
9495
};
9596

@@ -293,38 +294,38 @@ let AutoCompleteCompBase = (function () {
293294
return (
294295
<>
295296
<Section>
296-
{children.autoCompleteType.getView() === "normal" &&
297+
{children.autoCompleteType.getView() === 'normal' &&
297298
children.prefixIcon.propertyView({
298-
label: trans("button.prefixIcon"),
299+
label: trans('button.prefixIcon'),
299300
})}
300-
{children.autoCompleteType.getView() === "normal" &&
301+
{children.autoCompleteType.getView() === 'normal' &&
301302
children.suffixIcon.propertyView({
302-
label: trans("button.suffixIcon"),
303+
label: trans('button.suffixIcon'),
303304
})}
304-
{allowClearPropertyView(children)}
305+
{allowClearPropertyView(children)}
305306
</Section>
306-
<Section name={trans("autoComplete.SectionDataName")}>
307+
<Section name={trans('autoComplete.SectionDataName')}>
307308
{children.items.propertyView({
308-
label: trans("autoComplete.value"),
309+
label: trans('autoComplete.value'),
309310
tooltip: itemsDataTooltip,
310-
placeholder: "[]",
311+
placeholder: '[]',
311312
})}
312-
{getDayJSLocale() === "zh-cn" &&
313+
{getDayJSLocale() === 'zh-cn' &&
313314
children.searchFirstPY.propertyView({
314-
label: trans("autoComplete.searchFirstPY"),
315+
label: trans('autoComplete.searchFirstPY'),
315316
})}
316-
{getDayJSLocale() === "zh-cn" &&
317+
{getDayJSLocale() === 'zh-cn' &&
317318
children.searchCompletePY.propertyView({
318-
label: trans("autoComplete.searchCompletePY"),
319+
label: trans('autoComplete.searchCompletePY'),
319320
})}
320321
{children.searchLabelOnly.propertyView({
321-
label: trans("autoComplete.searchLabelOnly"),
322+
label: trans('autoComplete.searchLabelOnly'),
322323
})}
323324
{children.ignoreCase.propertyView({
324-
label: trans("autoComplete.ignoreCase"),
325+
label: trans('autoComplete.ignoreCase'),
325326
})}
326327
{children.valueOrLabel.propertyView({
327-
label: trans("autoComplete.checkedValueFrom"),
328+
label: trans('autoComplete.checkedValueFrom'),
328329
radioButton: true,
329330
})}
330331
</Section>
@@ -350,7 +351,10 @@ let AutoCompleteCompBase = (function () {
350351
<Section name={sectionNames.inputFieldStyle}>
351352
{children.inputFieldStyle.getPropertyView()}
352353
</Section>
353-
<Section name={sectionNames.animationStyle}>
354+
<Section
355+
name={sectionNames.animationStyle}
356+
hasTooltip={true}
357+
>
354358
{children.animationStyle.getPropertyView()}
355359
</Section>
356360
</>

‎client/packages/lowcoder/src/comps/comps/buttonComp/floatButtonComp.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,7 @@ let FloatButtonBasicComp = (function () {
150150
<Section name={sectionNames.style}>
151151
{children.style.getPropertyView()}
152152
</Section>
153-
<Section name={sectionNames.animationStyle}>
153+
<Section name={sectionNames.animationStyle} hasTooltip={true}>
154154
{children.animationStyle.getPropertyView()}
155155
</Section>
156156
</>

‎client/packages/lowcoder/src/comps/comps/buttonComp/linkComp.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -139,7 +139,7 @@ const LinkTmpComp = (function () {
139139
{(useContext(EditorContext).editorModeStatus === "layout" || useContext(EditorContext).editorModeStatus === "both") && (
140140
<>
141141
<Section name={sectionNames.style}>{children.style.getPropertyView()}</Section>
142-
<Section name={sectionNames.animationStyle}>{children.animationStyle.getPropertyView()}</Section>
142+
<Section name={sectionNames.animationStyle} hasTooltip={true}>{children.animationStyle.getPropertyView()}</Section>
143143
</>
144144
)}
145145
</>

‎client/packages/lowcoder/src/comps/comps/buttonComp/toggleButtonComp.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -139,7 +139,7 @@ const ToggleTmpComp = (function () {
139139
})}
140140
{children.style.getPropertyView()}
141141
</Section>
142-
<Section name={sectionNames.animationStyle}>
142+
<Section name={sectionNames.animationStyle} hasTooltip={true}>
143143
{children.animationStyle.getPropertyView()}
144144
</Section>
145145
</>

‎client/packages/lowcoder/src/comps/comps/carouselComp.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,7 @@ let CarouselBasicComp = (function () {
105105
<Section name={sectionNames.style}>
106106
{children.style.getPropertyView()}
107107
</Section>
108-
<Section name={sectionNames.animationStyle}>
108+
<Section name={sectionNames.animationStyle} hasTooltip={true}>
109109
{children.animationStyle.getPropertyView()}
110110
</Section>
111111
</>

‎client/packages/lowcoder/src/comps/comps/commentComp/commentComp.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -424,7 +424,7 @@ let CommentBasicComp = (function () {
424424
<Section name={sectionNames.style}>
425425
{children.style.getPropertyView()}
426426
</Section>
427-
<Section name={sectionNames.animationStyle}>
427+
<Section name={sectionNames.animationStyle} hasTooltip={true}>
428428
{children.animationStyle.getPropertyView()}
429429
</Section></>
430430
)}

‎client/packages/lowcoder/src/comps/comps/containerComp/cardComp.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -333,7 +333,7 @@ export const ContainerBaseComp = (function () {
333333
<Section name={sectionNames.bodyStyle}>
334334
{children.bodyStyle.getPropertyView()}
335335
</Section>
336-
<Section name={sectionNames.animationStyle}>
336+
<Section name={sectionNames.animationStyle} hasTooltip={true}>
337337
{children.animationStyle.getPropertyView()}
338338
</Section>
339339
</>

0 commit comments

Comments
 (0)