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 13fbb07

Browse files
MenamAfzalraheeliftikhar5
authored andcommitted
custom hook used
1 parent be6c861 commit 13fbb07

Some content is hidden

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

53 files changed

+122
-881
lines changed

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

Lines changed: 2 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,7 @@ import {
5858
import { CompTypeContext } from "@lowcoder-ee/comps/utils/compTypeContext";
5959
import { setInitialCompStyles } from "@lowcoder-ee/comps/utils/themeUtil";
6060
import { ThemeContext } from "@lowcoder-ee/comps/utils/themeContext";
61+
import { useMergeCompStyles } from "@lowcoder-ee/index.sdk";
6162

6263

6364
const InputStyle = styled(Input) <{ $style: InputLikeStyleType }>`
@@ -107,21 +108,7 @@ const getValidate = (value: any): "" | "warning" | "error" | undefined => {
107108

108109
let AutoCompleteCompBase = (function () {
109110
return new UICompBuilder(childrenMap, (props, dispatch) => {
110-
const theme = useContext(ThemeContext);
111-
const compType = useContext(CompTypeContext);
112-
const compTheme = theme?.theme?.components?.[compType];
113-
const styleProps: Record<string, any> = {};
114-
['style', 'labelStyle', 'inputFieldStyle', 'animationStyle'].forEach((key: string) => {
115-
styleProps[key] = (props as any)[key];
116-
});
117-
118-
useEffect(() => {
119-
setInitialCompStyles({
120-
dispatch,
121-
compTheme,
122-
styleProps,
123-
});
124-
}, []);
111+
useMergeCompStyles(props as Record<string, any>, dispatch);
125112

126113
const {
127114
items,

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

Lines changed: 2 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@ import { CompNameContext, EditorContext } from "../editorState";
3737
import { CompTypeContext } from "@lowcoder-ee/comps/utils/compTypeContext";
3838
import { setInitialCompStyles } from "@lowcoder-ee/comps/utils/themeUtil";
3939
import { ThemeContext } from "@lowcoder-ee/comps/utils/themeContext";
40+
import { useMergeCompStyles } from "@lowcoder-ee/index.sdk";
4041

4142
const AvatarWrapper = styled(Avatar) <AvatarProps & { $cursorPointer?: boolean, $style: AvatarStyleType }>`
4243
background: ${(props) => props.$style.background};
@@ -201,22 +202,8 @@ const AvatarView = (props: RecordConstructorToView<typeof childrenMap>) => {
201202

202203
let AvatarBasicComp = (function () {
203204
return new UICompBuilder(childrenMap, (props , dispatch) => {
205+
useMergeCompStyles(props as Record<string, any>, dispatch);
204206

205-
const theme = useContext(ThemeContext);
206-
const compType = useContext(CompTypeContext);
207-
const compTheme = theme?.theme?.components?.[compType];
208-
const styleProps: Record<string, any> = {};
209-
['style', 'labelStyle', 'inputFieldStyle', 'animationStyle'].forEach((key: string) => {
210-
styleProps[key] = (props as any)[key];
211-
});
212-
213-
useEffect(() => {
214-
setInitialCompStyles({
215-
dispatch,
216-
compTheme,
217-
styleProps,
218-
});
219-
}, []);
220207
return(<AvatarView {...props} />)})
221208
.setPropertyViewFn((children) => (
222209
<>

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

Lines changed: 3 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ import { JSONObject } from "util/jsonTypes";
2222
import { CompTypeContext } from "@lowcoder-ee/comps/utils/compTypeContext";
2323
import { setInitialCompStyles } from "@lowcoder-ee/comps/utils/themeUtil";
2424
import { ThemeContext } from "@lowcoder-ee/comps/utils/themeContext";
25+
import { useMergeCompStyles } from "@lowcoder-ee/index.sdk";
2526

2627
const MacaroneList = [
2728
'#fde68a',
@@ -146,21 +147,8 @@ const AvatarGroupView = (props: RecordConstructorToView<typeof childrenMap> & {
146147

147148
let AvatarGroupBasicComp = (function () {
148149
return new UICompBuilder(childrenMap, (props, dispatch) =>{
149-
const theme = useContext(ThemeContext);
150-
const compType = useContext(CompTypeContext);
151-
const compTheme = theme?.theme?.components?.[compType];
152-
const styleProps: Record<string, any> = {};
153-
['style', 'avatar'].forEach((key: string) => {
154-
styleProps[key] = (props as any)[key];
155-
});
156-
157-
useEffect(() => {
158-
setInitialCompStyles({
159-
dispatch,
160-
compTheme,
161-
styleProps,
162-
});
163-
}, []);
150+
useMergeCompStyles(props as Record<string, any>, dispatch);
151+
164152
return( <AvatarGroupView {...props} dispatch={dispatch} />
165153
)})
166154
.setPropertyViewFn((children) => (

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

Lines changed: 2 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ import { styleControl } from "@lowcoder-ee/comps/controls/styleControl";
3030
import { setInitialCompStyles } from "@lowcoder-ee/comps/utils/themeUtil";
3131
import { ThemeContext } from "@lowcoder-ee/comps/utils/themeContext";
3232
import { CompTypeContext } from "@lowcoder-ee/comps/utils/compTypeContext";
33+
import { useMergeCompStyles } from "@lowcoder-ee/index.sdk";
3334

3435
const FormLabel = styled(CommonBlueLabel)`
3536
font-size: 13px;
@@ -138,21 +139,7 @@ const ButtonTmpComp = (function () {
138139
viewRef: RefControl<HTMLElement>,
139140
};
140141
return new UICompBuilder(childrenMap, (props , dispatch) => {
141-
const theme = useContext(ThemeContext);
142-
const compType = useContext(CompTypeContext);
143-
const compTheme = theme?.theme?.components?.[compType];
144-
const styleProps: Record<string, any> = {};
145-
['style', 'animationStyle'].forEach((key: string) => {
146-
styleProps[key] = (props as any)[key];
147-
});
148-
149-
useEffect(() => {
150-
setInitialCompStyles({
151-
dispatch,
152-
compTheme,
153-
styleProps,
154-
});
155-
}, []);
142+
useMergeCompStyles(props as Record<string, any>, dispatch);
156143

157144
return(
158145
<ButtonCompWrapper disabled={props.disabled}>

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

Lines changed: 2 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ import { styleControl } from "@lowcoder-ee/comps/controls/styleControl";
2525
import { ThemeContext } from "@lowcoder-ee/comps/utils/themeContext";
2626
import { CompTypeContext } from "@lowcoder-ee/comps/utils/compTypeContext";
2727
import { setInitialCompStyles } from "@lowcoder-ee/comps/utils/themeUtil";
28+
import { useMergeCompStyles } from "@lowcoder-ee/index.sdk";
2829

2930
const StyledDropdownButton = styled(DropdownButton)`
3031
width: 100%;
@@ -91,21 +92,7 @@ const DropdownTmpComp = (function () {
9192
style: styleControl(DropdownStyle, 'style'),
9293
};
9394
return new UICompBuilder(childrenMap, (props, dispatch) => {
94-
const theme = useContext(ThemeContext);
95-
const compType = useContext(CompTypeContext);
96-
const compTheme = theme?.theme?.components?.[compType];
97-
const styleProps: Record<string, any> = {};
98-
['style'].forEach((key: string) => {
99-
styleProps[key] = (props as any)[key];
100-
});
101-
102-
useEffect(() => {
103-
setInitialCompStyles({
104-
dispatch,
105-
compTheme,
106-
styleProps,
107-
});
108-
}, []);
95+
useMergeCompStyles(props as Record<string, any>, dispatch);
10996

11097
const hasIcon =
11198
props.options.findIndex((option) => (option.prefixIcon as ReactElement)?.props.value) > -1;

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

Lines changed: 2 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,7 @@ import React, { useContext, useEffect } from "react";
2525
import { ThemeContext } from "@lowcoder-ee/comps/utils/themeContext";
2626
import { CompTypeContext } from "@lowcoder-ee/comps/utils/compTypeContext";
2727
import { setInitialCompStyles } from "@lowcoder-ee/comps/utils/themeUtil";
28+
import { useMergeCompStyles } from "@lowcoder-ee/index.sdk";
2829

2930
const Link = styled(Button)<{
3031
$style: LinkStyleType;
@@ -95,22 +96,8 @@ const LinkTmpComp = (function () {
9596
viewRef: RefControl<HTMLElement>,
9697
};
9798
return new UICompBuilder(childrenMap, (props, dispatch) => {
98-
const theme = useContext(ThemeContext);
99-
const compType = useContext(CompTypeContext);
100-
const compTheme = theme?.theme?.components?.[compType];
99+
useMergeCompStyles(props as Record<string, any>, dispatch);
101100

102-
const styleProps: Record<string, any> = {};
103-
['style', 'animationStyle'].forEach((key: string) => {
104-
styleProps[key] = (props as any)[key];
105-
});
106-
107-
useEffect(() => {
108-
setInitialCompStyles({
109-
dispatch,
110-
compTheme,
111-
styleProps,
112-
});
113-
}, []);
114101

115102
// chrome86 bug: button children should not contain only empty span
116103
const hasChildren = hasIcon(props.prefixIcon) || !!props.text || hasIcon(props.suffixIcon);

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

Lines changed: 3 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ import { EditorContext } from "comps/editorState";
2727
import { CompTypeContext } from "@lowcoder-ee/comps/utils/compTypeContext";
2828
import { setInitialCompStyles } from "@lowcoder-ee/comps/utils/themeUtil";
2929
import { ThemeContext } from "@lowcoder-ee/comps/utils/themeContext";
30+
import { useMergeCompStyles } from "@lowcoder-ee/index.sdk";
3031

3132
const Error = styled.div`
3233
color: #f5222d;
@@ -76,24 +77,8 @@ const ScannerTmpComp = (function () {
7677
style: styleControl(DropdownStyle, 'style'),
7778
viewRef: RefControl<HTMLElement>,
7879
};
79-
return new UICompBuilder(childrenMap, (props ,dispatch) => {
80-
81-
const theme = useContext(ThemeContext);
82-
const compType = useContext(CompTypeContext);
83-
const compTheme = theme?.theme?.components?.[compType];
84-
const styleProps: Record<string, any> = {};
85-
['style'].forEach((key: string) => {
86-
styleProps[key] = (props as any)[key];
87-
});
88-
89-
useEffect(() => {
90-
setInitialCompStyles({
91-
dispatch,
92-
compTheme,
93-
styleProps,
94-
});
95-
}, []);
96-
80+
return new UICompBuilder(childrenMap, (props, dispatch) => {
81+
useMergeCompStyles(props as Record<string, any>, dispatch);
9782

9883
const [showModal, setShowModal] = useState(false);
9984
const [errMessage, setErrMessage] = useState("");

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

Lines changed: 2 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ import { EditorContext } from "comps/editorState";
2828
import { ThemeContext } from "@lowcoder-ee/comps/utils/themeContext";
2929
import { CompTypeContext } from "@lowcoder-ee/comps/utils/compTypeContext";
3030
import { setInitialCompStyles } from "@lowcoder-ee/comps/utils/themeUtil";
31+
import { useMergeCompStyles } from "@lowcoder-ee/index.sdk";
3132

3233
const IconWrapper = styled.div`
3334
display: flex;
@@ -72,21 +73,7 @@ const ToggleTmpComp = (function () {
7273
const text = props.showText
7374
? (props.value.value ? props.trueText : props.falseText) || undefined
7475
: undefined;
75-
const theme = useContext(ThemeContext);
76-
const compType = useContext(CompTypeContext);
77-
const compTheme = theme?.theme?.components?.[compType];
78-
const styleProps: Record<string, any> = {};
79-
['style', 'animationStyle'].forEach((key: string) => {
80-
styleProps[key] = (props as any)[key];
81-
});
82-
83-
useEffect(() => {
84-
setInitialCompStyles({
85-
dispatch,
86-
compTheme,
87-
styleProps,
88-
});
89-
}, []);
76+
useMergeCompStyles(props as Record<string, any>, dispatch);
9077

9178
return (
9279
<ButtonCompWrapperStyled

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

Lines changed: 3 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ import { AnimationStyle, AnimationStyleType, CarouselStyle } from "comps/control
1717

1818
import { useContext } from "react";
1919
import { EditorContext } from "comps/editorState";
20-
import { ThemeContext } from "@lowcoder-ee/index.sdk";
20+
import { ThemeContext,useMergeCompStyles } from "@lowcoder-ee/index.sdk";
2121
import { CompTypeContext } from "@lowcoder-ee/comps/utils/compTypeContext";
2222
import { setInitialCompStyles } from "@lowcoder-ee/comps/utils/themeUtil";
2323

@@ -51,23 +51,8 @@ let CarouselBasicComp = (function () {
5151
animationStyle: styleControl(AnimationStyle , 'animationStyle'),
5252
...formDataChildren,
5353
};
54-
return new UICompBuilder(childrenMap, (props , dispatch) => {
55-
56-
const theme = useContext(ThemeContext);
57-
const compType = useContext(CompTypeContext);
58-
const compTheme = theme?.theme?.components?.[compType];
59-
const styleProps: Record<string, any> = {};
60-
['style','animationStyle'].forEach((key: string) => {
61-
styleProps[key] = (props as any)[key];
62-
});
63-
64-
useEffect(() => {
65-
setInitialCompStyles({
66-
dispatch,
67-
compTheme,
68-
styleProps,
69-
});
70-
}, []);
54+
return new UICompBuilder(childrenMap, (props, dispatch) => {
55+
useMergeCompStyles(props as Record<string, any>, dispatch);
7156

7257
const containerRef = useRef<HTMLDivElement>(null);
7358
const [height, setHeight] = useState(0);

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

Lines changed: 2 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,7 @@ import { DisabledContext } from "comps/generators/uiCompBuilder";
4343
import { ThemeContext } from "@lowcoder-ee/comps/utils/themeContext";
4444
import { CompTypeContext } from "@lowcoder-ee/comps/utils/compTypeContext";
4545
import { setInitialCompStyles } from "@lowcoder-ee/comps/utils/themeUtil";
46+
import { useMergeCompStyles } from "@lowcoder-ee/index.sdk";
4647

4748
const ContainWrapper = styled.div<{
4849
$style: ContainerStyleType & {
@@ -181,23 +182,8 @@ const ColumnLayout = (props: ColumnLayoutProps) => {
181182

182183
export const ResponsiveLayoutBaseComp = (function () {
183184
return new UICompBuilder(childrenMap, (props, dispatch) => {
185+
useMergeCompStyles(props as Record<string, any>, dispatch);
184186

185-
const theme = useContext(ThemeContext);
186-
const compType = useContext(CompTypeContext);
187-
const compTheme = theme?.theme?.components?.[compType];
188-
const styleProps: Record<string, any> = {};
189-
['style', 'columnStyle'].forEach((key: string) => {
190-
styleProps[key] = (props as any)[key];
191-
});
192-
193-
useEffect(() => {
194-
setInitialCompStyles({
195-
dispatch,
196-
compTheme,
197-
styleProps,
198-
});
199-
}, []);
200-
201187
return (
202188
<ColumnLayout {...props} dispatch={dispatch} />
203189
);

0 commit comments

Comments
(0)

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