Movatterモバイル変換


[0]ホーム

URL:


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

Commit4d44daf

Browse files
authored
Merge branch 'dev' into master
2 parents34f09be +ce067ec commit4d44daf

File tree

214 files changed

+2315
-4385
lines changed

Some content is hidden

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

214 files changed

+2315
-4385
lines changed

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -146,6 +146,7 @@ export const sectionNames = {
146146
layout:trans("prop.layout"),
147147
style:trans("prop.style"),
148148
labelStyle:trans("prop.labelStyle"),
149+
animationStyle:trans("prop.animationStyle"),
149150
data:trans("prop.data"),
150151
meetings:trans("prop.meetings"),// added by Falk Wolsky
151152
field:trans("prop.field"),

‎client/packages/lowcoder-design/src/i18n/design/locales/en.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ export const en = {
2323
advanced:"Advanced",
2424
validation:"Validation",
2525
layout:"Layout",
26+
animationStyle:"Animation Style",
2627
labelStyle:"Label Style",
2728
style:"Style",
2829
meetings:"Meeting Settings",

‎client/packages/lowcoder-design/src/icons/index.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -161,6 +161,10 @@ export { ReactComponent as ResetIcon } from "./icon-style-reset.svg";
161161
export{ReactComponentasEditIcon}from"./icon-edit.svg";
162162
export{ReactComponentasEditableIcon}from"./icon-editable.svg";
163163
export{ReactComponentasLeftStateIcon}from"./remix/node-tree.svg";
164+
export{ReactComponentasStarSmileIcon}from"./remix/star-smile-line.svg";
165+
export{ReactComponentasTimer2Icon}from"./remix/timer-2-line.svg";
166+
export{ReactComponentasTimerFlashIcon}from"./remix/timer-flash-line.svg";
167+
export{ReactComponentasRefreshLineIcon}from"./remix/refresh-line.svg";
164168
export{ReactComponentasLeftSettingIcon}from"./remix/tools-fill.svg";
165169
export{ReactComponentasLeftLayersIcon}from"./remix/stack-line.svg";
166170
export{ReactComponentasLeftHelpIcon}from"./icon-left-help.svg";

‎client/packages/lowcoder/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,7 @@
3636
"@types/react-signature-canvas":"^1.0.2",
3737
"@types/react-test-renderer":"^18.0.0",
3838
"@types/react-virtualized":"^9.21.21",
39+
"animate.css":"^4.1.1",
3940
"antd":"5.13.2",
4041
"axios":"^1.6.2",
4142
"buffer":"^6.0.3",

‎client/packages/lowcoder/src/api/commonSettingApi.ts

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,10 +44,17 @@ export interface ThemeDetail {
4444
primarySurface:string;// comp bg-color
4545
borderRadius:string;
4646
chart?:string;
47-
margin?:string;
47+
margin?:string;
4848
padding?:string;
4949
gridColumns?:string;//Added By Aqib Mirza
5050
textSize?:string;
51+
animation?:string;
52+
animationDelay?:string;
53+
animationDuration?:string;
54+
opacity?:string;
55+
boxShadow?:string;
56+
boxShadowColor?:string;
57+
animationIterationCount?:string;
5158
}
5259

5360
exportfunctiongetThemeDetailName(key:keyofThemeDetail){

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

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { Input, Section, sectionNames } from "lowcoder-design";
33
import{BoolControl}from"comps/controls/boolControl";
44
import{styleControl}from"comps/controls/styleControl";
55
import{
6+
AnimationStyle,
67
InputFieldStyle,
78
InputLikeStyle,
89
InputLikeStyleType,
@@ -62,6 +63,7 @@ const InputStyle = styled(Input)<{ $style: InputLikeStyleType }>`
6263
${getStyle(props.$style)}
6364
input {
6465
padding:${props.style?.padding};
66+
rotate:${props?.$style?.rotation};
6567
}
6668
.ant-select-single {
6769
width:100%!important;
@@ -89,6 +91,7 @@ const childrenMap = {
8991
componentSize:dropdownControl(componentSize,"small"),
9092
valueInItems:booleanExposingStateControl("valueInItems"),
9193
inputFieldStyle:styleControl(InputLikeStyle),
94+
animationStyle:styleControl(AnimationStyle),
9295
};
9396

9497
constgetValidate=(value:any):""|"warning"|"error"|undefined=>{
@@ -283,6 +286,7 @@ let AutoCompleteCompBase = (function () {
283286
style:props.style,
284287
labelStyle:props.labelStyle,
285288
inputFieldStyle:props.inputFieldStyle,
289+
animationStyle:props.animationStyle,
286290
...validateState,
287291
});
288292
})
@@ -347,6 +351,9 @@ let AutoCompleteCompBase = (function () {
347351
<Sectionname={sectionNames.inputFieldStyle}>
348352
{children.inputFieldStyle.getPropertyView()}
349353
</Section>
354+
<Sectionname={sectionNames.animationStyle}>
355+
{children.animationStyle.getPropertyView()}
356+
</Section>
350357
</>
351358
);
352359
})

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

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { ButtonCompWrapper, buttonRefMethods } from "comps/comps/buttonComp/butt
33
import{BoolCodeControl,StringControl}from"comps/controls/codeControl";
44
import{ButtonEventHandlerControl}from"comps/controls/eventHandlerControl";
55
import{styleControl}from"comps/controls/styleControl";
6-
import{LinkStyle,LinkStyleType}from"comps/controls/styleControlConstants";
6+
import{AnimationStyle,AnimationStyleType,LinkStyle,LinkStyleType}from"comps/controls/styleControlConstants";
77
import{withDefault}from"comps/generators";
88
import{migrateOldData}from"comps/generators/simpleGenerators";
99
import{UICompBuilder}from"comps/generators/uiCompBuilder";
@@ -23,7 +23,11 @@ import { RefControl } from "comps/controls/refControl";
2323
import{EditorContext}from"comps/editorState";
2424
importReact,{useContext}from"react";
2525

26-
constLink=styled(Button)<{$style:LinkStyleType}>`
26+
constLink=styled(Button)<{
27+
$style:LinkStyleType;
28+
$animationStyle:AnimationStyleType;
29+
}>`
30+
${(props)=>props.$animationStyle}
2731
${(props)=>`
2832
color:${props.$style.text};
2933
margin:${props.$style.margin};
@@ -81,6 +85,7 @@ const LinkTmpComp = (function () {
8185
disabled:BoolCodeControl,
8286
loading:BoolCodeControl,
8387
style:migrateOldData(styleControl(LinkStyle),fixOldData),
88+
animationStyle:styleControl(AnimationStyle),
8489
prefixIcon:IconControl,
8590
suffixIcon:IconControl,
8691
viewRef:RefControl<HTMLElement>,
@@ -91,6 +96,7 @@ const LinkTmpComp = (function () {
9196
return(
9297
<ButtonCompWrapperdisabled={props.disabled}>
9398
<Link
99+
$animationStyle={props.animationStyle}
94100
ref={props.viewRef}
95101
$style={props.style}
96102
loading={props.loading}
@@ -130,7 +136,10 @@ const LinkTmpComp = (function () {
130136
)}
131137

132138
{(useContext(EditorContext).editorModeStatus==="layout"||useContext(EditorContext).editorModeStatus==="both")&&(
133-
<><Sectionname={sectionNames.style}>{children.style.getPropertyView()}</Section></>
139+
<>
140+
<Sectionname={sectionNames.style}>{children.style.getPropertyView()}</Section>
141+
<Sectionname={sectionNames.animationStyle}>{children.animationStyle.getPropertyView()}</Section>
142+
</>
134143
)}
135144
</>
136145
);

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

Lines changed: 25 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,11 @@ import { Button100, ButtonCompWrapper, buttonRefMethods } from "./buttonCompCons
1515
import{IconControl}from"comps/controls/iconControl";
1616
import{AlignWithStretchControl,LeftRightControl}from"comps/controls/dropdownControl";
1717
import{booleanExposingStateControl}from"comps/controls/codeStateControl";
18-
import{ToggleButtonStyle}from"comps/controls/styleControlConstants";
18+
import{
19+
AnimationStyle,
20+
AnimationStyleType,
21+
ToggleButtonStyle,
22+
}from"comps/controls/styleControlConstants";
1923
import{styleControl}from"comps/controls/styleControl";
2024
import{BoolControl}from"comps/controls/boolControl";
2125
import{RefControl}from"comps/controls/refControl";
@@ -29,7 +33,9 @@ const IconWrapper = styled.div`
2933
constButtonCompWrapperStyled=styled(ButtonCompWrapper)<{
3034
$align:"left"|"center"|"right"|"stretch";
3135
$showBorder:boolean;
36+
$animationStyle:AnimationStyleType;
3237
}>`
38+
${(props)=>props.$animationStyle}
3339
width: 100%;
3440
display: flex;
3541
justify-content:${(props)=>props.$align};
@@ -55,7 +61,8 @@ const ToggleTmpComp = (function () {
5561
iconPosition:LeftRightControl,
5662
alignment:AlignWithStretchControl,
5763
style:styleControl(ToggleButtonStyle),
58-
showBorder:withDefault(BoolControl,true),
64+
animationStyle:styleControl(AnimationStyle),
65+
showBorder:withDefault(BoolControl,true),
5966
viewRef:RefControl<HTMLElement>,
6067
};
6168
returnnewUICompBuilder(childrenMap,(props)=>{
@@ -67,6 +74,7 @@ const ToggleTmpComp = (function () {
6774
disabled={props.disabled}
6875
$align={props.alignment}
6976
$showBorder={props.showBorder}
77+
$animationStyle={props.animationStyle}
7078
>
7179
<Button100
7280
ref={props.viewRef}
@@ -122,13 +130,21 @@ const ToggleTmpComp = (function () {
122130
</>
123131
)}
124132

125-
{(useContext(EditorContext).editorModeStatus==="layout"||useContext(EditorContext).editorModeStatus==="both")&&(
126-
<><Sectionname={sectionNames.style}>
127-
{children.showBorder.propertyView({label:trans("toggleButton.showBorder")})}
128-
{children.style.getPropertyView()}
129-
</Section></>
130-
)}
131-
133+
{(useContext(EditorContext).editorModeStatus==="layout"||
134+
useContext(EditorContext).editorModeStatus==="both")&&(
135+
<>
136+
<Sectionname={sectionNames.style}>
137+
{children.showBorder.propertyView({
138+
label:trans("toggleButton.showBorder"),
139+
})}
140+
{children.style.getPropertyView()}
141+
</Section>
142+
<Sectionname={sectionNames.animationStyle}>
143+
{children.animationStyle.getPropertyView()}
144+
</Section>
145+
</>
146+
)}
147+
132148
</>
133149
))
134150
.setExposeMethodConfigs(buttonRefMethods)

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

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ import { EditorContext } from "comps/editorState";
3131

3232
// Introducing styles
3333
import{
34+
AnimationStyle,
3435
CommentStyle,
3536
heightCalculator,
3637
widthCalculator,
@@ -100,6 +101,7 @@ const childrenMap = {
100101
}),
101102
onEvent:eventHandlerControl(EventOptions),
102103
style:styleControl(CommentStyle),
104+
animationStyle:styleControl(AnimationStyle),
103105
commentList:jsonValueExposingStateControl("commentList",[]),
104106
deletedItem:jsonValueExposingStateControl("deletedItem",[]),
105107
submitedItem:jsonValueExposingStateControl("submitedItem",[]),
@@ -125,6 +127,7 @@ const CommentCompBase = (
125127
userInfo,
126128
placeholder,
127129
deleteAble,
130+
animationStyle,
128131
}=props;
129132
typePrefixType="@"|keyoftypeofmentionList;
130133
// Used to save the consolidated list of mentions
@@ -233,7 +236,11 @@ const CommentCompBase = (
233236
width:widthCalculator(style.margin??"3px"),
234237
height:heightCalculator(style.margin??"3px"),
235238
background:style.background,
236-
borderRadius:style.radius,
239+
borderRadius:style.radius,
240+
animation:animationStyle.animation,
241+
animationDelay:animationStyle.animationDelay,
242+
animationDuration:animationStyle.animationDuration,
243+
animationIterationCount:animationStyle.animationIterationCount
237244
}}>
238245
<div
239246
style={{
@@ -413,8 +420,12 @@ let CommentBasicComp = (function () {
413420
{children.placeholder.propertyView({
414421
label:trans("comment.placeholderDec"),
415422
})}
416-
</Section><Sectionname={sectionNames.style}>
423+
</Section>
424+
<Sectionname={sectionNames.style}>
417425
{children.style.getPropertyView()}
426+
</Section>
427+
<Sectionname={sectionNames.animationStyle}>
428+
{children.animationStyle.getPropertyView()}
418429
</Section></>
419430
)}
420431

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

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ import { useContext, useEffect, useRef, useState } from "react";
1313
import{EditorContext}from"comps/editorState";
1414
import{Card}from"antd";
1515
importstyledfrom"styled-components";
16-
import{CardHeaderStyle,CardHeaderStyleType,CardStyle,CardStyleType}from"comps/controls/styleControlConstants";
16+
import{AnimationStyle,AnimationStyleType,CardHeaderStyle,CardHeaderStyleType,CardStyle,CardStyleType}from"comps/controls/styleControlConstants";
1717
import{MultiCompBuilder,withDefault}from"comps/generators";
1818
import{IconControl}from"comps/controls/iconControl";
1919
import{ButtonEventHandlerControl,CardEventHandlerControl,clickEvent,refreshEvent}from"comps/controls/eventHandlerControl";
@@ -22,7 +22,14 @@ import { dropdownControl } from "comps/controls/dropdownControl";
2222
import{styleControl}from"comps/controls/styleControl";
2323
const{ Meta}=Card;
2424

25-
constWarpper=styled.div<{$style:CardStyleType|undefined,$showMate:boolean,$cardType:string,$headerStyle:CardHeaderStyleType,$bodyStyle:CardHeaderStyleType}>`
25+
constWarpper=styled.div<{
26+
$style:CardStyleType|undefined;
27+
$showMate:boolean;
28+
$cardType:string;
29+
$headerStyle:CardHeaderStyleType;
30+
$bodyStyle:CardHeaderStyleType;
31+
$animationStyle:AnimationStyleType;
32+
}>`
2633
height: 100%;
2734
width: 100%;
2835
.ant-card-small >.ant-card-head {
@@ -70,6 +77,7 @@ const Warpper = styled.div<{ $style: CardStyleType | undefined, $showMate: boole
7077
border-style:${props=>props.$style?.borderStyle};
7178
border-radius:${props=>props.$style?.radius};
7279
border-width:${props=>props.$style?.borderWidth};
80+
${props=>props.$animationStyle}
7381
}
7482
.ant-card-body {
7583
display:${props=>props.$showMate ?'' :'none'};
@@ -173,6 +181,7 @@ export const ContainerBaseComp = (function () {
173181
style:styleControl(CardStyle),
174182
headerStyle:styleControl(CardHeaderStyle),
175183
bodyStyle:styleControl(CardHeaderStyle),
184+
animationStyle:styleControl(AnimationStyle),
176185
};
177186

178187
returnnewContainerCompBuilder(childrenMap,(props,dispatch)=>{
@@ -202,6 +211,7 @@ export const ContainerBaseComp = (function () {
202211
<Warpper
203212
ref={conRef}
204213
$style={props.style}
214+
$animationStyle={props.animationStyle}
205215
$headerStyle={props.headerStyle}
206216
$bodyStyle={props.bodyStyle}
207217
$showMate={props.showMeta||props.cardType=='custom'}
@@ -321,6 +331,9 @@ export const ContainerBaseComp = (function () {
321331
<Sectionname={sectionNames.bodyStyle}>
322332
{children.bodyStyle.getPropertyView()}
323333
</Section>
334+
<Sectionname={sectionNames.animationStyle}>
335+
{children.animationStyle.getPropertyView()}
336+
</Section>
324337
</>
325338
)}
326339
</>

0 commit comments

Comments
 (0)

[8]ページ先頭

©2009-2025 Movatter.jp