Merge branch 'dev' into link-oauth-providers-for-existing-users

Author: FalkWolsky

client/.yarnrc.yml

@@ -1,5 +1,4 @@
 nodeLinker: node-modules
-nmHoistingLimits: workspaces
 
 npmRegistryServer: "https://registry.npmjs.org"
 

client/jest.config.js

@@ -1,3 +1,4 @@
 export default {
   projects: ["<rootDir>/packages/lowcoder", "<rootDir>/packages/lowcoder-core"],
 };
+// we use this for testing.

client/packages/create-lowcoder-plugin/package.json

@@ -7,12 +7,8 @@
     "chalk": "4",
     "commander": "^9.4.1",
     "cross-spawn": "^7.0.3",
-    "fs-extra": "^10.1.0"
-  },
-  "peerDependencies": {
-    "lowcoder-cli": "*",
-    "lowcoder-dev-utils": "*",
-    "lowcoder-sdk": "*"
+    "fs-extra": "^10.1.0",
+    "lowcoder-dev-utils": "workspace:^"
   },
   "license": "MIT",
   "keywords": [

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

@@ -16,13 +16,10 @@
     }
   },
   "devDependencies": {
+    "lowcoder-cli": "workspace:^",
+    "lowcoder-sdk": "workspace:^",
     "typescript": "^4.8.4",
-    "vite": "^4.5.1"
-  },
-  "peerDependencies": {
-    "lowcoder-cli": "*",
-    "lowcoder-dev-utils": "*",
-    "lowcoder-sdk": "*"
+    "vite": "^4.3.9"
   },
   "keywords": [
     "Lowcoder, Component, Template, Plugin"

client/packages/lowcoder-cli/package.json

@@ -29,11 +29,12 @@
     "commander": "^9.4.1",
     "cross-spawn": "^7.0.3",
     "fs-extra": "^10.1.0",
+    "lowcoder-dev-utils": "workspace:^",
     "react": "^17",
     "react-dom": "^17",
     "react-json-view": "^1.21.3",
     "rollup-plugin-external-globals": "^0.7.1",
-    "vite": "^4.5.1",
+    "vite": "^4.3.9",
     "vite-plugin-css-injected-by-js": "^2.1.1",
     "vite-plugin-svgr": "^2.2.2"
   },
@@ -42,7 +43,6 @@
     "typescript": "^4.8.4"
   },
   "peerDependencies": {
-    "lowcoder-dev-utils": "*",
     "lowcoder-sdk": "*"
   },
   "keywords": [

client/packages/lowcoder-comps/package.json

@@ -16,10 +16,11 @@
     "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",
     "react": "17",
     "react-dom": "17",
-    "react-resize-detector": "^7.0.0",
     "typescript": "4.8.4"
   },
   "lowcoder": {
@@ -69,12 +70,7 @@
   "devDependencies": {
     "jest": "29.3.0",
     "jest-canvas-mock": "^2.5.2",
-    "vite": "^4.5.1",
+    "vite": "^4.3.9",
     "vite-tsconfig-paths": "^3.6.0"
-  },
-  "peerDependencies": {
-    "lowcoder-cli": "*",
-    "lowcoder-dev-utils": "*",
-    "lowcoder-sdk": "*"
   }
 }

client/packages/lowcoder-design/package.json

@@ -8,6 +8,7 @@
   },
   "dependencies": {
     "colord": "^2.9.3",
+    "react-fontawesome": "^0.2.0",
     "react-markdown": "^8.0.0",
     "react-virtualized": "^9.22.3",
     "rehype-raw": "^6.1.1",

client/packages/lowcoder-design/src/components/option.tsx

@@ -153,8 +153,9 @@ const OptionItem = (props: {
   popoverTitle?: string;
   draggable?: boolean;
   optionExtra?: React.ReactNode;
+  scrollable?: boolean;
 }) => {
-  const { content, config, title, popoverTitle, draggable = true, optionExtra } = props;
+  const { content, config, title, popoverTitle, draggable = true, optionExtra, scrollable } = props;
   const [visible, setVisible] = useState(false);
   const { attributes, listeners, setNodeRef, transform, transition } = useSortable({
     id: config.dataIndex,
@@ -182,6 +183,7 @@ const OptionItem = (props: {
       setVisible={(vis) => {
         setVisible(vis);
       }}
+      scrollable={scrollable}
     >
       {optionRow}
     </SimplePopover>
@@ -204,6 +206,7 @@ function Option<T extends ConstructorToComp<MultiCompConstructor>>(props: {
   optionToolbar?: React.ReactNode;
   headerItem?: React.ReactNode;
   itemExtra?: (comp: T) => React.ReactNode;
+  scrollable?: boolean;
 }) {
   const { items, uniqVal, headerItem, optionToolbar, itemExtra } = props;
   const itemsDistinctValCount = uniqVal
@@ -286,6 +289,7 @@ function Option<T extends ConstructorToComp<MultiCompConstructor>>(props: {
                     title={props.itemTitle(item)}
                     config={{ dataIndex: dataIndex }}
                     optionExtra={optionExtra}
+                    scrollable={props.scrollable}
                   />
                 );
               })}

client/packages/lowcoder-design/src/components/popover.tsx

@@ -51,13 +51,15 @@ const SimplePopover = (props: {
   setVisible?: (vis: boolean) => void;
   children: JSX.Element | React.ReactNode;
   content: JSX.Element | React.ReactNode;
+  scrollable?: boolean;
 }) => {
   const { visible, setVisible } = props;
   const contentWithBox = (
     <SuspensionBox
       title={props.title}
       onClose={() => setVisible?.(false)}
       content={props.content}
+      scrollable={props.scrollable}
     />
   );
   return (
@@ -66,7 +68,7 @@ const SimplePopover = (props: {
       align={{
         offset: [-12, 0, 0, 0],
       }}
-      destroyTooltipOnHide
+      // destroyTooltipOnHide
       content={contentWithBox}
       trigger="click"
       open={visible}

client/packages/lowcoder-plugin-demo/icons/demo-icon.png

@@ -3,7 +3,7 @@ import { CompIDE } from "lowcoder-sdk";
 import { name, version, lowcoder } from "./package.json";
 import compMap from "./src/index";
 
-import "lowcoder-sdk/dist/style.css";
+import "../lowcoder-sdk/dist/style.css";
 
 function CompDevApp() {
   return (

client/packages/lowcoder-plugin-demo/icons/demo-icon.svg

@@ -1,42 +1,40 @@
 {
   "name": "lowcoder-plugin-demo",
-  "version": "0.0.1",
+  "version": "0.0.4",
   "type": "module",
   "license": "MIT",
   "dependencies": {
-    "@types/react": "17",
-    "@types/react-dom": "17",
-    "lowcoder-sdk": "2.1.9",
+    "lowcoder-core": "^0.0.1",
+    "lowcoder-design": "^0.0.1",
     "react": "17",
-    "react-dom": "17",
-    "typescript": "5.3.3",
-    "vite": "^5.0.6"
+    "react-dom": "17"
   },
-  "devDependencies": {
-    "@types/node": "16",
-    "@types/react": "17",
-    "@types/react-dom": "17",
-    "react": "17",
-    "react-dom": "17",
-    "typescript": "5.3.3",
-    "vite": "^5.0.6"
-  },
-  "peerDependencies": {
-    "lowcoder-cli": "*",
-    "lowcoder-dev-utils": "*",
-    "lowcoder-sdk": "*"
+  "publishConfig": {
+    "registry": "https://registry.npmjs.com"
   },
   "lowcoder": {
     "description": "",
     "comps": {
       "hello_world": {
-        "name": "__i18n_helloWorldCompName__",
-        "icon": "./icons/demo-icon.svg"
+        "name": "Hello World",
+        "icon": "./icons/demo-icon.png"
+      },
+      "counter": {
+        "name": "Counter",
+        "icon": "./icons/demo-icon.png"
       }
     }
   },
   "scripts": {
     "start": "vite",
     "build": "lowcoder-cli build"
+  },
+  "devDependencies": {
+    "@types/react": "17",
+    "@types/react-dom": "17",
+    "lowcoder-cli": "workspace:^",
+    "lowcoder-sdk": "workspace:^",
+    "typescript": "4.8.4",
+    "vite": "^4.3.9"
   }
 }

client/packages/lowcoder-plugin-demo/index.tsx

@@ -0,0 +1,81 @@
+import {
+  antd,
+  UICompBuilder,
+  numberExposingStateControl,
+  Section,
+  withDefault,
+  withExposingConfigs,
+  NumberControl,
+  NameConfig,
+  eventHandlerControl,
+  withMethodExposing,
+} from "lowcoder-sdk";
+import styles from "./style.module.css";
+
+const { Button } = antd;
+
+const childrenMap = {
+  value: numberExposingStateControl("value", 10),
+  step: withDefault(NumberControl, 1),
+  onEvent: eventHandlerControl([
+    {
+      label: "onChange",
+      value: "change",
+      description: "",
+    },
+  ]),
+};
+
+const CounterCompBase = new UICompBuilder(childrenMap, (props: any) => {
+  const currentValue = props.value.value;
+  return (
+    <div className={styles.wrapper}>
+      <Button
+        onClick={() => {
+          props.value.onChange(currentValue - props.step);
+          props.onEvent("change");
+        }}
+      >
+        -
+      </Button>
+      <span style={{ padding: "0 8px" }}>{currentValue}</span>
+      <Button
+        onClick={() => {
+          props.value.onChange(currentValue + props.step);
+          props.onEvent("change");
+        }}
+      >
+        +
+      </Button>
+    </div>
+  );
+})
+  .setPropertyViewFn((children: any) => {
+    return (
+      <>
+        <Section name="Basic">
+          {children.value.propertyView({ label: "Initial Value" })}
+          {children.step.propertyView({ label: "Step" })}
+        </Section>
+        <Section name="Interaction">{children.onEvent.propertyView()}</Section>
+      </>
+    );
+  })
+  .build();
+
+const CounterCompTemp = withMethodExposing(CounterCompBase, [
+  {
+    method: {
+      name: "random",
+      params: [],
+    },
+    execute(comp: any) {
+      comp.children.value.getView().onChange(Math.floor(Math.random() * 100));
+    },
+  },
+]);
+
+export default withExposingConfigs(CounterCompTemp, [
+  new NameConfig("value", ""),
+  new NameConfig("step", ""),
+]);