Merge branch 'lowcoder-org:main' into patch-2

Author: konstchri

.DS_Store

@@ -4,3 +4,4 @@ stacks/
 client/.yarn/cache/*.zip
 server/node-service/.yarn/cache/*.zip
 .metadata/
+.DS_Store

.gitignore

@@ -6,18 +6,18 @@
 
 #### Use prebuilt docker image
 
-Simply run below command to start a backend server.
+Simply run the below command to start a backend server.
 
 ```bash
 docker run -d --name lowcoder -p 3000:3000 -v "$PWD/stacks:/lowcoder-stacks" lowcoderorg/lowcoder-ce
 ```
 
-For more information, view our [docs](../docs/self-hosting)
+For more information, view our [docs](https://docs.lowcoder.cloud/lowcoder-documentation/setup-and-run/self-hosting)
 
 #### Build Docker image from source
 
-1. Check out source code and change to source dir.
-2. Use the command below to build Docker image :
+1. Check out the source code and change to source dir.
+2. Use the command below to build a Docker image :
 
 ```bash
 docker build -f ./deploy/docker/Dockerfile -t lowcoder-dev .
@@ -31,16 +31,89 @@ docker run -d --name lowcoder-dev -p 3000:3000 -v "$PWD/stacks:/lowcoder-stacks"
 
 ### Start develop
 
+
 1. Check out source code.
-2. Change to client dir in the repository root via cd client.
-3. Run yarn to install dependencies: .
-4. Start dev server: `LOWCODER_API_SERVICE_URL=http://localhost:3000 yarn start`.
+2. Change to **/client** dir in the source dir.
+
+```bash
+cd client
+```
+3. Run yarn to install dependencies.
+
+```bash
+yarn install
+```
+
+4. Start dev server: 
+
+```bash
+LOWCODER_API_SERVICE_URL=http://localhost:3000 yarn start
+```
+
 5. After dev server starts successfully, it will be automatically opened in the default browser.
 
 ### Before submitting a pull request
 
 In addition, before submitting a pull request, please make sure the following is done:
 
 1. If you’ve fixed a bug or added code that should be tested and add unit test suite.
-2. Run `yarn test` and ensure all test suites pass.
-3. If you add new dependency, use yarn workspace lowcoder some-package to make sure yarn.lock is also updated.
+2. Run test and ensure all test suites pass.
+
+```bash
+yarn test
+```
+
+3. If you add new dependency, use the yarn worspace tool to make sure yarn.lock is also updated.
+
+```bash
+yarn workspace lowcoder <package name>
+```
+
+### Developing and publishung UI components for Lowcoder
+
+1. Initialization
+
+Project initiation
+
+```bash
+yarn create Lowcoder-plugin <your plugin name>
+```
+
+Go to the project root
+
+```bash
+cd my-plugin
+```
+
+Start the development environment
+
+```bash
+yarn start
+```
+
+After executing yarn start, the browser is automatically opened and you enter the component development environment.
+Please find more information in our [docs](https://docs.lowcoder.cloud/lowcoder-documentation/lowcoder-extension/develop-ui-components-for-apps)
+
+2. Export components
+
+To export all the components, use src/index.ts, for example:
+
+```bash
+import HelloWorldComp from "./HelloWorldComp";
+
+export default {
+  hello_world: HelloWorldComp,
+};
+```
+
+import HelloWorldComp from "./HelloWorldComp";
+
+3. Publish plugins
+
+When you finish developing and testing the plugin, you can publish it into the npm registry. Login in to the npm registry locally, and then execute the following command:
+
+```bash
+yarn build --publish
+```
+
+You can check a code demo here:  [Code Demo on Github](https://github.com/lowcoder-org/lowcoder/tree/main/client/packages/lowcoder-plugin-demo)

client/README.md

@@ -1 +1 @@
-1.1.8
+2.1.5

client/VERSION

@@ -33,7 +33,7 @@
     "@types/qrcode.react": "^1.0.2",
     "@types/react-grid-layout": "^1.3.0",
     "@types/react-helmet": "^6.1.5",
-    "@types/react-resizable": "^1.7.4",
+    "@types/react-resizable": "^3.0.5",
     "@types/react-router-dom": "^5.3.2",
     "@types/shelljs": "^0.8.11",
     "@types/styled-components": "^5.1.19",

client/package.json

@@ -8,8 +8,8 @@ declare module "*.svg" {
     React.SVGProps<SVGSVGElement> & { title?: string }
   >;
 
-  const src: string;
-  export default src;
+  // const src: string;
+  // export default src;
 }
 
 declare module "*.md" {
@@ -31,9 +31,6 @@ declare var REACT_APP_LANGUAGES: string;
 declare var REACT_APP_COMMIT_ID: string;
 declare var REACT_APP_API_HOST: string;
 declare var LOWCODER_NODE_SERVICE_URL: string;
-declare var LOWCODER_SHOW_BRAND: string;
-declare var LOWCODER_CUSTOM_LOGO: string;
-declare var LOWCODER_CUSTOM_LOGO_SQUARE: string;
 declare var REACT_APP_ENV: string;
 declare var REACT_APP_BUILD_ID: string;
 declare var REACT_APP_LOG_LEVEL: string;

client/packages/lowcoder-cli/client.d.ts

@@ -2,4 +2,5 @@ import config from "../../config/test/jest.config.js";
 
 export default {
   ...config,
+  setupFiles: [...config.setupFiles, 'jest-canvas-mock'],
 };

client/packages/lowcoder-comps/icons/mermaidchart.svg

@@ -1,20 +1,21 @@
 {
   "name": "lowcoder-comps",
-  "version": "0.0.13",
+  "version": "0.0.18",
   "type": "module",
   "license": "MIT",
   "dependencies": {
     "@fullcalendar/core": "^6.1.6",
     "@fullcalendar/daygrid": "^6.1.6",
     "@fullcalendar/interaction": "^6.1.6",
-    "@fullcalendar/list": "^6.1.6",
+    "@fullcalendar/list": "^6.1.9",
     "@fullcalendar/moment": "^6.1.6",
     "@fullcalendar/react": "^6.1.6",
     "@fullcalendar/timegrid": "^6.1.6",
     "@types/react": "17",
     "@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,16 +30,16 @@
         "name": "Chart",
         "icon": "./icons/icon-chart.svg",
         "layoutInfo": {
-          "w": 11,
-          "h": 35
+          "w": 15,
+          "h": 40
         }
       },
       "imageEditor": {
         "name": "Image Editor",
         "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
+        }
       }
     }
   },
@@ -60,6 +69,7 @@
   },
   "devDependencies": {
     "jest": "29.3.0",
+    "jest-canvas-mock": "^2.5.2",
     "vite": "^4.3.9",
     "vite-tsconfig-paths": "^3.6.0"
   }