diff --git a/.DS_Store b/.DS_Store
index 8cd8f4f0b..102244ca1 100644
Binary files a/.DS_Store and b/.DS_Store differ
diff --git a/client/packages/lowcoder-comps/icons/mermaidchart.svg b/client/packages/lowcoder-comps/icons/mermaidchart.svg
new file mode 100644
index 000000000..de1181bf2
--- /dev/null
+++ b/client/packages/lowcoder-comps/icons/mermaidchart.svg
@@ -0,0 +1,18 @@
+
+
+
diff --git a/client/packages/lowcoder-comps/package.json b/client/packages/lowcoder-comps/package.json
index 264e38233..9af9f74c4 100644
--- a/client/packages/lowcoder-comps/package.json
+++ b/client/packages/lowcoder-comps/package.json
@@ -1,6 +1,6 @@
{
"name": "lowcoder-comps",
- "version": "0.0.13",
+ "version": "0.0.15",
"type": "module",
"license": "MIT",
"dependencies": {
@@ -15,6 +15,7 @@
"@types/react-dom": "17",
"big.js": "^6.2.1",
"echarts-extension-gmap": "^1.6.0",
+ "echarts-wordcloud": "^2.1.0",
"lowcoder-cli": "workspace:^",
"lowcoder-sdk": "workspace:^",
"mermaid": "^10.2.4",
@@ -29,8 +30,8 @@
"name": "Chart",
"icon": "./icons/icon-chart.svg",
"layoutInfo": {
- "w": 11,
- "h": 35
+ "w": 15,
+ "h": 40
}
},
"imageEditor": {
@@ -38,7 +39,7 @@
"icon": "./icons/icon-chart.svg",
"layoutInfo": {
"w": 15,
- "h": 60
+ "h": 40
}
},
"calendar": {
@@ -48,6 +49,14 @@
"w": 15,
"h": 60
}
+ },
+ "mermaid": {
+ "name": "Mermaid",
+ "icon": "./icons/mermaidchart.svg",
+ "layoutInfo": {
+ "w": 15,
+ "h": 40
+ }
}
}
},
diff --git a/client/packages/lowcoder-comps/src/comps/chartComp/reactEcharts/index.ts b/client/packages/lowcoder-comps/src/comps/chartComp/reactEcharts/index.ts
index 6be260645..dcb57f0f9 100644
--- a/client/packages/lowcoder-comps/src/comps/chartComp/reactEcharts/index.ts
+++ b/client/packages/lowcoder-comps/src/comps/chartComp/reactEcharts/index.ts
@@ -1,4 +1,5 @@
import * as echarts from "echarts";
+import "echarts-wordcloud";
import { EChartsReactProps, EChartsInstance, EChartsOptionWithMap } from "./types";
import EChartsReactCore from "./core";
diff --git a/client/packages/lowcoder-comps/src/index.ts b/client/packages/lowcoder-comps/src/index.ts
index 0efaccd88..065393b52 100644
--- a/client/packages/lowcoder-comps/src/index.ts
+++ b/client/packages/lowcoder-comps/src/index.ts
@@ -1,9 +1,11 @@
import { ChartCompWithDefault } from "./comps/chartComp/chartComp";
import { ImageEditorComp } from "./comps/imageEditorComp/index";
import { CalendarComp } from "./comps/calendarComp/calendarComp";
+import { MermaidComp } from "comps/mermaidComp";
export default {
chart: ChartCompWithDefault,
imageEditor: ImageEditorComp,
calendar: CalendarComp,
+ mermaid: MermaidComp,
};
diff --git a/client/packages/lowcoder-design/src/icons/icon-mermaid.svg b/client/packages/lowcoder-design/src/icons/icon-mermaid.svg
new file mode 100644
index 000000000..de1181bf2
--- /dev/null
+++ b/client/packages/lowcoder-design/src/icons/icon-mermaid.svg
@@ -0,0 +1,18 @@
+
+
+
diff --git a/client/packages/lowcoder-design/src/icons/index.ts b/client/packages/lowcoder-design/src/icons/index.ts
index 0ea5ed45d..623486ade 100644
--- a/client/packages/lowcoder-design/src/icons/index.ts
+++ b/client/packages/lowcoder-design/src/icons/index.ts
@@ -224,6 +224,7 @@ export { ReactComponent as GraphqlIcon } from "./icon-query-Graphql.svg";
export { ReactComponent as SnowflakeIcon } from "./icon-query-snowflake.svg";
export { ReactComponent as MariaDBIcon } from "./icon-query-MariaDB.svg";
export { ReactComponent as imageEditorIcon } from "./icon-insert-imageEditor.svg";
+export { ReactComponent as MermaidIcon } from "./icon-mermaid.svg";
export { ReactComponent as HomeSettingsIcon } from "./icon-home-settings.svg";
export { ReactComponent as HomeSettingsActiveIcon } from "./icon-home-settings-active.svg";
export { ReactComponent as HelpGithubIcon } from "./icon-help-github.svg";
diff --git a/client/packages/lowcoder/package.json b/client/packages/lowcoder/package.json
index c48e6dce7..8d71c0af4 100644
--- a/client/packages/lowcoder/package.json
+++ b/client/packages/lowcoder/package.json
@@ -49,6 +49,7 @@
"copy-to-clipboard": "^3.3.3",
"core-js": "^3.25.2",
"echarts": "^5.4.2",
+ "echarts-wordcloud": "^2.1.0",
"eslint4b-prebuilt-2": "^7.32.0",
"file-saver": "^2.0.5",
"github-markdown-css": "^5.1.0",
diff --git a/client/packages/lowcoder/src/comps/index.tsx b/client/packages/lowcoder/src/comps/index.tsx
index f2098742b..b14d6a4b9 100644
--- a/client/packages/lowcoder/src/comps/index.tsx
+++ b/client/packages/lowcoder/src/comps/index.tsx
@@ -100,6 +100,7 @@ import {
MentionIcon,
AutoCompleteCompIcon,
ResponsiveLayoutCompIcon,
+ MermaidIcon,
} from "lowcoder-design";
import { defaultFormData, FormComp } from "./comps/formComp/formComp";
@@ -841,6 +842,19 @@ const uiCompMap: Registry = {
h: 60,
},
},
+ mermaid: {
+ name: trans("uiComp.mermaidCompName"),
+ enName: "Mermaid Charts",
+ comp: remoteComp({ ...builtInRemoteComps, compName: "mermaid" }),
+ description: trans("uiComp.mermaidCompDesc"),
+ categories: ["dataDisplay"],
+ icon: MermaidIcon,
+ keywords: trans("uiComp.mermaidCompKeywords"),
+ layoutInfo: {
+ w: 15,
+ h: 60,
+ },
+ },
scanner: {
name: trans("uiComp.scannerCompName"),
enName: "Scanner",
diff --git a/client/packages/lowcoder/src/comps/uiCompRegistry.ts b/client/packages/lowcoder/src/comps/uiCompRegistry.ts
index a43e5e9e2..4868b6826 100644
--- a/client/packages/lowcoder/src/comps/uiCompRegistry.ts
+++ b/client/packages/lowcoder/src/comps/uiCompRegistry.ts
@@ -89,6 +89,7 @@ export type UICompType =
| "progress"
| "progressCircle"
| "chart"
+ | "mermaid" //Added By Falk Wolsky
| "fileViewer"
| "divider"
| "qrCode"
diff --git a/client/packages/lowcoder/src/i18n/locales/en.ts b/client/packages/lowcoder/src/i18n/locales/en.ts
index 93806fa4a..12b67abf2 100644
--- a/client/packages/lowcoder/src/i18n/locales/en.ts
+++ b/client/packages/lowcoder/src/i18n/locales/en.ts
@@ -870,6 +870,9 @@ export const en = {
imageEditorCompName: "Image Editor",
imageEditorCompDesc: "Image Editor component",
imageEditorCompKeywords: "",
+ mermaidCompName: "Mermaid Charts",
+ mermaidCompDesc: "Render Mermaid Charts based on text",
+ mermaidCompKeywords: "",
calendarCompName: "Calendar",
calendarCompDesc: "Calendar component",
calendarCompKeywords: "",
diff --git a/client/packages/lowcoder/src/i18n/locales/zh.ts b/client/packages/lowcoder/src/i18n/locales/zh.ts
index 136680a22..3e3e7d6c2 100644
--- a/client/packages/lowcoder/src/i18n/locales/zh.ts
+++ b/client/packages/lowcoder/src/i18n/locales/zh.ts
@@ -820,6 +820,9 @@ uiComp: {
imageEditorCompName: "图片编辑器",
imageEditorCompDesc: "图片编辑器组件",
imageEditorCompKeywords: "",
+ mermaidCompName: "美人鱼图表",
+ mermaidCompDesc: "根据文本渲染美人鱼图表",
+ mermaidCompKeywords: "",
calendarCompName: "日历",
calendarCompDesc: "日历组件",
calendarCompKeywords: "",
diff --git a/client/packages/lowcoder/src/pages/editor/editorConstants.tsx b/client/packages/lowcoder/src/pages/editor/editorConstants.tsx
index 9a437761c..2884b55ac 100644
--- a/client/packages/lowcoder/src/pages/editor/editorConstants.tsx
+++ b/client/packages/lowcoder/src/pages/editor/editorConstants.tsx
@@ -85,8 +85,9 @@ export const CompStateIcon: {
jsonSchemaForm: ,
container: ,
meeting: ,
+ mermaid: ,
videocomponent: ,
- controlButton: ,
+ controlButton: ,
tabbedContainer: ,
modal: ,
listView: ,
diff --git a/client/yarn.lock b/client/yarn.lock
index 4fc86e410..718632834 100644
--- a/client/yarn.lock
+++ b/client/yarn.lock
@@ -7776,6 +7776,15 @@ __metadata:
languageName: node
linkType: hard
+"echarts-wordcloud@npm:^2.1.0":
+ version: 2.1.0
+ resolution: "echarts-wordcloud@npm:2.1.0"
+ peerDependencies:
+ echarts: ^5.0.1
+ checksum: d6e8996bb1267fbaa3fde23a121918a662a46ddd9ccd00ba0829aa4bd95b1a7b5cab64e3f4fe7241d605caaba7ad7b8e68eeaa9e1ad4adbf43cc0551deb14e33
+ languageName: node
+ linkType: hard
+
"echarts@npm:^5.4.2":
version: 5.4.2
resolution: "echarts@npm:5.4.2"
@@ -11818,6 +11827,7 @@ __metadata:
"@types/react-dom": 17
big.js: ^6.2.1
echarts-extension-gmap: ^1.6.0
+ echarts-wordcloud: ^2.1.0
jest: 29.3.0
lowcoder-cli: "workspace:^"
lowcoder-sdk: "workspace:^"
@@ -11990,6 +12000,7 @@ __metadata:
core-js: ^3.25.2
dotenv: ^16.0.3
echarts: ^5.4.2
+ echarts-wordcloud: ^2.1.0
eslint: ^8.0.0
eslint-config-react-app: ^7.0.1
eslint-plugin-only-ascii: ^0.0.0