Skip to content

Commit cb8e3fb

Browse files
sarikesarike
committed
feat: add some db datasources and comp methods
1 parent ae9fff5 commit cb8e3fb

Some content is hidden

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

41 files changed

+857
-154
lines changed

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
"@types/react": "17",
88
"@types/react-dom": "17",
99
"big.js": "^6.2.1",
10+
"mermaid": "^10.0.2",
1011
"openblocks-cli": "workspace:^",
1112
"openblocks-sdk": "workspace:^",
1213
"react": "17",

‎client/packages/openblocks-comps/src/comps/mermaidComp/index.tsx

Lines changed: 15 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,11 @@ import {
88
withMethodExposing,
99
} from "openblocks-sdk";
1010

11-
import Mermaid from "./mermaid"
11+
import Mermaid from "./mermaid";
1212

1313
const childrenMap = {
14-
code: stringExposingStateControl("code",
14+
code: stringExposingStateControl(
15+
"code",
1516
`graph LR
1617
Start --> Stop`
1718
),
@@ -26,22 +27,18 @@ const childrenMap = {
2627

2728
const CompBase = new UICompBuilder(childrenMap, (props: any) => {
2829
const code = props.code.value;
29-
return (
30-
<Mermaid code={code}/>
31-
);
32-
}).setPropertyViewFn((children: any) => {
33-
return (
34-
<>
35-
<Section name="Basic">
36-
{children.code.propertyView({ label: "code" })}
37-
</Section>
38-
<Section name="Interaction">{children.onEvent.propertyView()}</Section>
39-
</>
40-
);
41-
}).build();
30+
return <Mermaid code={code} />;
31+
})
32+
.setPropertyViewFn((children: any) => {
33+
return (
34+
<>
35+
<Section name="Basic">{children.code.propertyView({ label: "code" })}</Section>
36+
<Section name="Interaction">{children.onEvent.propertyView()}</Section>
37+
</>
38+
);
39+
})
40+
.build();
4241

4342
const AppViewCompTemp = withMethodExposing(CompBase, []);
4443

45-
export const MermaidComp = withExposingConfigs(AppViewCompTemp, [
46-
new NameConfig("code", ""),
47-
]);
44+
export const MermaidComp = withExposingConfigs(AppViewCompTemp, [new NameConfig("code", "")]);

‎client/packages/openblocks-comps/src/comps/mermaidComp/mermaid.tsx

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,29 @@
1-
import React, { useEffect, useState } from "react"
2-
import mermaid from "mermaid"
1+
import React, { useEffect, useState } from "react";
2+
import mermaid from "mermaid";
33

44
function escape(str: string): string {
5-
const entries: { [index: string]: any } = { lt: "<", gt: ">", nbsp: " ", amp: "&", quot: "\"" }
6-
return str.replace(/&(lt|gt|nbsp|amp|quot);/gi, function (_, t) {
7-
return entries[t]
8-
}).trim()
5+
const entries: { [index: string]: any } = { lt: "<", gt: ">", nbsp: " ", amp: "&", quot: '"' };
6+
return str
7+
.replace(/&(lt|gt|nbsp|amp|quot);/gi, function (_, t) {
8+
return entries[t];
9+
})
10+
.trim();
911
}
1012

1113
export default ({ id = "graphDiv", code = "" }) => {
12-
const [svg, setSvg] = useState('')
14+
const [svg, setSvg] = useState("");
1315

1416
useEffect(() => {
15-
mermaid.initialize({ startOnLoad: false })
16-
}, [])
17+
mermaid.initialize({ startOnLoad: false });
18+
}, []);
1719

1820
useEffect(() => {
19-
if (!code) return
21+
if (!code) return;
2022

21-
mermaid.mermaidAPI.render(id, escape(code)).then(res => {
22-
setSvg(res.svg)
23-
})
24-
}, [code, setSvg])
23+
mermaid.mermaidAPI.render(id, escape(code)).then((res) => {
24+
setSvg(res.svg);
25+
});
26+
}, [code, setSvg]);
2527

26-
return (
27-
<pre className="mermaid" dangerouslySetInnerHTML={{ __html: svg }}></pre>
28-
)
29-
}
28+
return <pre className="mermaid" dangerouslySetInnerHTML={{ __html: svg }}></pre>;
29+
};

‎client/packages/openblocks-comps/src/index.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
11
import { ChartCompWithDefault } from "./comps/chartComp/chartComp";
22
import { ImageEditorComp } from "./comps/imageEditorComp/index";
3-
import {MermaidComp} from "./comps/mermaidComp";
43

54
export default {
65
chart: ChartCompWithDefault,
76
imageEditor: ImageEditorComp,
8-
mermaid: MermaidComp,
97
};

‎client/packages/openblocks-design/src/icons/icon-query-OceanBase.svg

Lines changed: 0 additions & 12 deletions
This file was deleted.

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

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -205,7 +205,6 @@ export { ReactComponent as MSSQLIcon } from "./icon-query-mssql.svg";
205205
export { ReactComponent as SMTPIcon } from "./icon-query-SMTP.svg";
206206
export { ReactComponent as OracleIcon } from "./icon-query-OracleDB.svg";
207207
export { ReactComponent as ClickHouseIcon } from "./icon-query-ClickHouse.svg";
208-
export { ReactComponent as OceanBaseIcon } from "./icon-query-OceanBase.svg";
209208
export { ReactComponent as ResetIcon } from "./icon-style-reset.svg";
210209
export { ReactComponent as EditIcon } from "./icon-edit.svg";
211210
export { ReactComponent as EditableIcon } from "./icon-editable.svg";

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

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,9 +16,13 @@ import styled from "styled-components";
1616
import { CommonNameConfig, NameConfig, withExposingConfigs } from "../../generators/withExposing";
1717
import { IForm } from "../formComp/formDataConstants";
1818
import { SimpleNameComp } from "../simpleNameComp";
19-
import { Button100, ButtonCompWrapper, ButtonStyleControl } from "./buttonCompConstants";
19+
import {
20+
Button100,
21+
ButtonCompWrapper,
22+
buttonRefMethods,
23+
ButtonStyleControl,
24+
} from "./buttonCompConstants";
2025
import { RefControl } from "comps/controls/refControl";
21-
import { refMethods } from "comps/generators/withMethodExposing";
2226

2327
const FormLabel = styled(CommonBlueLabel)`
2428
font-size: 13px;
@@ -177,7 +181,7 @@ const ButtonTmpComp = (function () {
177181
<Section name={sectionNames.style}>{children.style.getPropertyView()}</Section>
178182
</>
179183
))
180-
.setExposeMethodConfigs(refMethods(["focus", "blur", "click"]))
184+
.setExposeMethodConfigs(buttonRefMethods)
181185
.build();
182186
})();
183187

‎client/packages/openblocks/src/comps/comps/buttonComp/buttonCompConstants.tsx

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,8 @@ import { ButtonStyleType, ButtonStyle } from "comps/controls/styleControlConstan
44
import { migrateOldData } from "comps/generators/simpleGenerators";
55
import styled, { css } from "styled-components";
66
import { genActiveColor, genHoverColor } from "openblocks-design";
7+
import { refMethods } from "comps/generators/withMethodExposing";
8+
import { blurMethod, clickMethod, focusWithOptions } from "comps/utils/methodUtils";
79

810
export function getButtonStyle(buttonStyle: ButtonStyleType) {
911
const hoverColor = genHoverColor(buttonStyle.background);
@@ -84,3 +86,9 @@ function fixOldData(oldData: any) {
8486
}
8587
const ButtonTmpStyleControl = styleControl(ButtonStyle);
8688
export const ButtonStyleControl = migrateOldData(ButtonTmpStyleControl, fixOldData);
89+
90+
export const buttonRefMethods = refMethods<HTMLElement>([
91+
focusWithOptions,
92+
blurMethod,
93+
clickMethod,
94+
]);

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

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { Button } from "antd";
2-
import { ButtonCompWrapper } from "comps/comps/buttonComp/buttonCompConstants";
2+
import { ButtonCompWrapper, buttonRefMethods } from "comps/comps/buttonComp/buttonCompConstants";
33
import { BoolCodeControl, StringControl } from "comps/controls/codeControl";
44
import { ButtonEventHandlerControl } from "comps/controls/eventHandlerControl";
55
import { styleControl } from "comps/controls/styleControl";
@@ -19,7 +19,6 @@ import { trans } from "i18n";
1919
import { IconControl } from "comps/controls/iconControl";
2020
import { hasIcon } from "comps/utils";
2121
import { RefControl } from "comps/controls/refControl";
22-
import { refMethods } from "comps/generators/withMethodExposing";
2322

2423
const Link = styled(Button)<{ $style: LinkStyleType }>`
2524
${(props) => `color: ${props.$style.text};`}
@@ -110,7 +109,7 @@ const LinkTmpComp = (function () {
110109
</>
111110
);
112111
})
113-
.setExposeMethodConfigs(refMethods(["focus", "blur", "click"]))
112+
.setExposeMethodConfigs(buttonRefMethods)
114113
.build();
115114
})();
116115

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

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,9 @@
11
import { Button, Dropdown, Menu, Skeleton } from "antd";
2-
import { Button100, ButtonCompWrapper } from "comps/comps/buttonComp/buttonCompConstants";
2+
import {
3+
Button100,
4+
ButtonCompWrapper,
5+
buttonRefMethods,
6+
} from "comps/comps/buttonComp/buttonCompConstants";
37
import { BoolCodeControl, StringControl } from "comps/controls/codeControl";
48
import { ScannerEventHandlerControl } from "comps/controls/eventHandlerControl";
59
import { styleControl } from "comps/controls/styleControl";
@@ -16,7 +20,6 @@ import { arrayStringExposingStateControl } from "comps/controls/codeStateControl
1620
import { BoolControl } from "comps/controls/boolControl";
1721
import { ItemType } from "antd/lib/menu/hooks/useItems";
1822
import { RefControl } from "comps/controls/refControl";
19-
import { refMethods } from "comps/generators/withMethodExposing";
2023

2124
const Error = styled.div`
2225
color: #f5222d;
@@ -222,7 +225,7 @@ const ScannerTmpComp = (function () {
222225
</>
223226
);
224227
})
225-
.setExposeMethodConfigs(refMethods(["focus", "blur", "click"]))
228+
.setExposeMethodConfigs(buttonRefMethods)
226229
.build();
227230
})();
228231

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

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,15 +11,14 @@ import { trans } from "i18n";
1111
import styled from "styled-components";
1212
import { ChangeEventHandlerControl } from "../../controls/eventHandlerControl";
1313
import { CommonNameConfig, NameConfig, withExposingConfigs } from "../../generators/withExposing";
14-
import { Button100, ButtonCompWrapper } from "./buttonCompConstants";
14+
import { Button100, ButtonCompWrapper, buttonRefMethods } from "./buttonCompConstants";
1515
import { IconControl } from "comps/controls/iconControl";
1616
import { AlignWithStretchControl, LeftRightControl } from "comps/controls/dropdownControl";
1717
import { booleanExposingStateControl } from "comps/controls/codeStateControl";
1818
import { ToggleButtonStyle } from "comps/controls/styleControlConstants";
1919
import { styleControl } from "comps/controls/styleControl";
2020
import { BoolControl } from "comps/controls/boolControl";
2121
import { RefControl } from "comps/controls/refControl";
22-
import { refMethods } from "comps/generators/withMethodExposing";
2322

2423
const IconWrapper = styled.div`
2524
display: flex;
@@ -125,7 +124,7 @@ const ToggleTmpComp = (function () {
125124
</Section>
126125
</>
127126
))
128-
.setExposeMethodConfigs(refMethods(["focus", "blur", "click"]))
127+
.setExposeMethodConfigs(buttonRefMethods)
129128
.build();
130129
})();
131130

‎client/packages/openblocks/src/comps/comps/dateComp/dateComp.tsx

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import { CommonNameConfig, depsConfig, withExposingConfigs } from "../../generat
2121
import { formDataChildren, FormDataPropertyView } from "../formComp/formDataConstants";
2222
import { styleControl } from "comps/controls/styleControl";
2323
import { DateTimeStyle, DateTimeStyleType } from "comps/controls/styleControlConstants";
24-
import { refMethods, withMethodExposing } from "../../generators/withMethodExposing";
24+
import { withMethodExposing } from "../../generators/withMethodExposing";
2525
import {
2626
disabledPropertyView,
2727
formatPropertyView,
@@ -41,7 +41,7 @@ import React, { ReactNode } from "react";
4141
import { IconControl } from "comps/controls/iconControl";
4242
import { hasIcon } from "comps/utils";
4343
import { Section, sectionNames } from "components/Section";
44-
import { disabledTime, handleDateChange } from "comps/comps/dateComp/dateCompUtil";
44+
import { dateRefMethods, disabledTime, handleDateChange } from "comps/comps/dateComp/dateCompUtil";
4545
import { DateUIView } from "./dateUIView";
4646
import { useIsMobile } from "util/hooks";
4747
import { RefControl } from "comps/controls/refControl";
@@ -246,7 +246,7 @@ export const datePickerControl = new UICompBuilder(childrenMap, (props) => {
246246
</>
247247
);
248248
})
249-
.setExposeMethodConfigs(refMethods(["focus", "blur"]))
249+
.setExposeMethodConfigs(dateRefMethods)
250250
.build();
251251

252252
export const dateRangeControl = (function () {
@@ -351,7 +351,6 @@ export const dateRangeControl = (function () {
351351
</>
352352
);
353353
})
354-
.setExposeMethodConfigs(refMethods(["focus", "blur"]))
355354
.build();
356355
})();
357356

@@ -484,7 +483,7 @@ export let DateRangeComp = withExposingConfigs(dateRangeControl, [
484483
]);
485484

486485
DateRangeComp = withMethodExposing(DateRangeComp, [
487-
...refMethods<typeof DateRangeComp>(["focus", "blur"]),
486+
...dateRefMethods,
488487
{
489488
method: {
490489
name: "clearAll",

‎client/packages/openblocks/src/comps/comps/dateComp/dateCompUtil.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,9 @@ import { range } from "lodash";
44
import { DateTimeStyleType } from "../../controls/styleControlConstants";
55
import { css } from "styled-components";
66
import { isDarkColor, lightenColor } from "components/colorSelect/colorUtils";
7+
import { CommonPickerMethods } from "antd/lib/date-picker/generatePicker/interface";
8+
import { blurMethod, focusMethod } from "comps/utils/methodUtils";
9+
import { refMethods } from "comps/generators/withMethodExposing";
710

811
export const handleDateChange = (
912
time: string,
@@ -112,3 +115,5 @@ export const getMobileStyle = (style: DateTimeStyleType) =>
112115
border-radius: ${style.radius};
113116
border-color: ${style.border};
114117
`;
118+
119+
export const dateRefMethods = refMethods<CommonPickerMethods>([focusMethod, blurMethod]);

‎client/packages/openblocks/src/comps/comps/dateComp/timeComp.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { TimePicker } from "antd";
21
import _ from "lodash";
32
import moment from "moment";
43
import { RecordConstructorToComp, RecordConstructorToView } from "openblocks-core";
@@ -27,7 +26,6 @@ import {
2726
import { formDataChildren, FormDataPropertyView } from "../formComp/formDataConstants";
2827
import { styleControl } from "comps/controls/styleControl";
2928
import { DateTimeStyle, DateTimeStyleType } from "comps/controls/styleControlConstants";
30-
import styled from "styled-components";
3129
import { withMethodExposing } from "../../generators/withMethodExposing";
3230
import {
3331
disabledPropertyView,
@@ -46,7 +44,7 @@ import React, { ReactNode } from "react";
4644
import { IconControl } from "comps/controls/iconControl";
4745
import { hasIcon } from "comps/utils";
4846
import { Section, sectionNames } from "components/Section";
49-
import { disabledTime, getStyle, handleDateChange } from "comps/comps/dateComp/dateCompUtil";
47+
import { dateRefMethods, disabledTime, handleDateChange } from "comps/comps/dateComp/dateCompUtil";
5048
import { TimeUIView } from "./timeUIView";
5149
import { TimeRangeUIView } from "comps/comps/dateComp/timeRangeUIView";
5250
import { RefControl } from "comps/controls/refControl";
@@ -193,6 +191,7 @@ export const timePickerControl = new UICompBuilder(childrenMap, (props) => {
193191
<Section name={sectionNames.style}>{children.style.getPropertyView()}</Section>
194192
</>
195193
))
194+
.setExposeMethodConfigs(dateRefMethods)
196195
.build();
197196

198197
export const timeRangeControl = (function () {
@@ -359,6 +358,7 @@ export let TimeRangeComp = withExposingConfigs(timeRangeControl, [
359358
]);
360359

361360
TimeRangeComp = withMethodExposing(TimeRangeComp, [
361+
...dateRefMethods,
362362
{
363363
method: {
364364
name: "clearAll",

‎client/packages/openblocks/src/comps/comps/mediaComp/mediaUtils.tsx

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,18 @@ type MediaCompType = ExposeMethodCompConstructor<
2020

2121
export function mediaMethods(): MethodConfigInfo<MediaCompType>[] {
2222
return [
23-
...refMethods<MediaCompType>(["seekTo", "showPreview"]),
23+
...refMethods<ReactPlayer>([
24+
{
25+
name: "seekTo",
26+
description: trans("media.seekTo"),
27+
params: [{ name: "amount", type: "number", description: trans("media.seekToAmount") }],
28+
},
29+
{
30+
name: "showPreview",
31+
description: trans("media.showPreview"),
32+
params: [],
33+
},
34+
]),
2435
{
2536
method: {
2637
name: "play",

0 commit comments

Comments
 (0)