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 f89b216

Browse files
Merge branch 'dev' into zaini/add-stitch-deploy-badge
2 parents 1ba1207 + 8f2129c commit f89b216

File tree

150 files changed

+4854
-852
lines changed

Some content is hidden

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

150 files changed

+4854
-852
lines changed

‎.DS_Store

-8 KB
Binary file not shown.

‎.gitignore

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,5 +9,3 @@ client/node_modules/
99
client/packages/lowcoder-plugin-demo/.yarn/install-state.gz
1010
client/packages/lowcoder-plugin-demo/yarn.lock
1111
client/packages/lowcoder-plugin-demo/.yarn/cache/@types-node-npm-16.18.68-56f72825c0-094ae9ed80.zip
12-
.DS_Store
13-
.DS_Store

‎client/VERSION

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
2.3.0
1+
2.3.1

‎client/package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "lowcoder-root",
3-
"version": "2.2.0",
3+
"version": "2.3.1",
44
"type": "module",
55
"private": true,
66
"workspaces": [
@@ -70,6 +70,7 @@
7070
},
7171
"dependencies": {
7272
"@lottiefiles/react-lottie-player": "^3.5.3",
73+
"@remixicon/react": "^4.1.1",
7374
"@testing-library/react": "^14.1.2",
7475
"@testing-library/user-event": "^14.5.1",
7576
"@types/styled-components": "^5.1.34",

‎client/packages/lowcoder-cli-template-typescript/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@
3232
"react-dom": "^18.2.0",
3333
"react-resize-detector": "^7.0.0",
3434
"typescript": "5.3.3",
35-
"vite": "^5.0.10"
35+
"vite": "^4.5.2"
3636
},
3737
"keywords": [
3838
"Lowcoder, Component, Template, Plugin, Demonstrator"

‎client/packages/lowcoder-cli/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@
3333
"react-dom": "^18.2.0",
3434
"react-json-view": "^1.21.3",
3535
"rollup-plugin-external-globals": "^0.7.1",
36-
"vite": "^4.3.9",
36+
"vite": "^4.5.2",
3737
"vite-plugin-css-injected-by-js": "^2.1.1",
3838
"vite-plugin-svgr": "^2.2.2"
3939
},
Lines changed: 99 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,22 +1,100 @@
1-
# lowcoder comp lib
1+
# Lowcoder Extra Components
2+
3+
This is the workspace for Lowcoder Extra Components like Calendar, Image Editor, Mermaid Charts and eCharts.
4+
5+
## Local Development preparation
6+
7+
Navigate your terminal or bash to your /root folder (lowcoder repository) to install Lowcoder Extra Components dependencies and the Lowcoder SDK
8+
9+
To develop with the Lowcoder Extra Components after you clone the Lowcoder Repository, first make sure the Lowcoder SDK is local built.
10+
11+
```bash
12+
cd client/packages/lowcoder-sdk
13+
yarn build
14+
```
215

316
## Start
417

5-
Start dev server to develop your comp lib.
18+
Now you can start the local dev server for Lowcoder Extra Components to develop and add your Component Plugin
619

720
```bash
21+
cd client/packages/lowcoder-comps
822
yarn start
23+
```
924

10-
# or
25+
The local dev server will build for roughly a minute and open then a Browser Window on http://localhost:9000/ with the Lowcoder Component Builder.
26+
27+
## Local development
28+
29+
After the local dev server is started, the Lowcoder Component Builder is prepared. A new browser window should open at http://localhost:9000 This is the Components Preview, which allows you to see your new component in action, as it would work in the Lowcoder Editor.
30+
31+
Data, methods and properties are visible and interactive, so you can test your Component during development. The view will get automatically refreshed.
32+
33+
The Lowcoder Component Builder makes the development & publishing of multiple individual components as bundle possible. Find the /src/comps folder in /lowcoder-comps. Here are existing components to find. It is suggested for new components to create a new folder. In the left navigation of the Components Preview you can switch between your components.
34+
35+
to see your component and include it in the processing on the development server, you have to do the folloiwing steps:
36+
37+
### modify /lowcoder-comps/package.json
38+
39+
```JSON
40+
"yournewcomponent": {
41+
"name": "Your new Component name",
42+
"icon": "./icons/your-icon.svg",
43+
"description": "A Component Plugin to ...",
44+
"category": "itemHandling",
45+
"layoutInfo": {
46+
"w": 6,
47+
"h": 30
48+
}
49+
}
50+
```
1151

12-
npm start
52+
53+
Please choose one category out of:
54+
55+
- dashboards
56+
- layout
57+
- forms
58+
- collaboration
59+
- projectmanagement
60+
- scheduling
61+
- documents
62+
- itemHandling
63+
- multimedia
64+
- integration
65+
66+
layoutInfo helps you to define the size (in grid-cells) of your Component in the grid for the very first moment, when a user drags your Component out of the components display on the right side in the Lowcoder Editor.
67+
68+
### modify /lowcoder-comps/src/index.ts
69+
70+
```JavaScript
71+
Add your Component for the exported members of Lowcoder Extra Components
72+
73+
import { ChartCompWithDefault } from "./comps/chartComp/chartComp";
74+
import { ImageEditorComp } from "./comps/imageEditorComp/index";
75+
import { CalendarComp } from "./comps/calendarComp/calendarComp";
76+
import { MermaidComp } from "comps/mermaidComp";
77+
78+
import { YourComponent } from "comps/yourComponentFolder/yourComponent";
79+
80+
export default {
81+
chart: ChartCompWithDefault,
82+
imageEditor: ImageEditorComp,
83+
calendar: CalendarComp,
84+
mermaid: MermaidComp,
85+
86+
yourcomponent: YourComponent,
87+
};
1388
```
89+
Now your Plugin should be visibe and displayed in the Lowcoder Component Builder at http://localhost:9000/
1490

1591
## Build
1692

17-
Build current comp lib into a .tgz file that you can upload it to the Lowcoder Comp Market.
93+
When you finish development and all tests, you can build the Components to use it in runtime.
1894

19-
Before build you should change the version in package.json file.
95+
This will build the current Component Plugins into a .tgz file that you can upload.
96+
97+
**Before build you should change the version in package.json file.**
2098

2199
```bash
22100
yarn build
@@ -25,3 +103,18 @@ yarn build
25103

26104
npm run build
27105
```
106+
107+
## How to publish a Component Plugin
108+
109+
With the following command you can publish the script to the NPM repository:
110+
111+
```bash
112+
yarn build --publish
113+
```
114+
115+
This command will publis the whole Lowcoder Extra Components bundle to [NPMjs](https://www.npmjs.com/)
116+
Make sure, you updated the Version of Lowcoder Comps before in /lowcoder-comps/package.json
117+
118+
## Contribute your Plugin
119+
120+
If you wish to contribute your plugin and persist it as general Lowcoder Extra Component, please raise a PR to our /dev branch in the Lowcoder Community-Edition Repository https://github.com/lowcoder-org/lowcoder

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@
6969
},
7070
"devDependencies": {
7171
"jest": "29.3.0",
72-
"vite": "^4.3.9",
72+
"vite": "^5.0.12",
7373
"vite-tsconfig-paths": "^3.6.0"
7474
}
7575
}

‎client/packages/lowcoder-comps/src/comps/calendarComp/calendarConstants.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -205,9 +205,9 @@ export const Wrapper = styled.div<{
205205
flex-direction: inherit;
206206
}
207207
.fc-day-today .fc-daygrid-day-number {
208-
background-color: ${(props) => props.$theme.primary};
208+
background-color: ${(props) => props.$theme?.primary ? props.$theme.primary : props.$style.background};
209209
color: ${(props) =>
210-
contrastText(props.$theme.primary || "", props.$theme.textDark, props.$theme.textLight)};
210+
contrastText(props.$theme?.primary || "", props.$theme?.textDark||"#000000", props.$theme?.textLight||"#ffffff")};
211211
}
212212
.fc-daygrid-day-events {
213213
padding: 1px 0 5px 0;
@@ -585,10 +585,10 @@ export const Wrapper = styled.div<{
585585
}
586586
.fc-day-today.fc-col-header-cell {
587587
background-color: ${(props) =>
588-
isDarkColor(props.$style.background) ? "#ffffff19" : toHex(props.$theme.primary!) + "19"};
588+
isDarkColor(props.$style.background) ? "#ffffff19" : toHex(props.$theme?.primary!) + "19"};
589589
a {
590590
color: ${(props) =>
591-
!isDarkColor(props.$style.background) && darkenColor(props.$theme.primary!, 0.1)};
591+
!isDarkColor(props.$style.background) && darkenColor(props.$theme?.primary!, 0.1)};
592592
}
593593
}
594594
.fc-col-header-cell-cushion {

‎client/packages/lowcoder-core/lib/index.d.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -454,7 +454,7 @@ declare enum CompActionTypes {
454454
* broadcast other actions in comp tree structure.
455455
* used for encapsulate MultiBaseComp
456456
*/
457-
BROADCAST = "BROADCAST"
457+
BROADCAST = "BROADCAST",
458458
}
459459
type ExtraActionType = "layout" | "delete" | "add" | "modify" | "rename" | "recover" | "upgrade";
460460
type ActionExtraInfo = {

0 commit comments

Comments
(0)

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