From 3856adcf50558149ccea748d44dcbcfafaece866 Mon Sep 17 00:00:00 2001 From: RAHEEL Date: Wed, 17 Jan 2024 14:46:54 +0500 Subject: [PATCH 1/3] fix table docs --- client/packages/lowcoder/src/i18n/locales/en.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/packages/lowcoder/src/i18n/locales/en.ts b/client/packages/lowcoder/src/i18n/locales/en.ts index f89876694..f572227cd 100644 --- a/client/packages/lowcoder/src/i18n/locales/en.ts +++ b/client/packages/lowcoder/src/i18n/locales/en.ts @@ -2573,7 +2573,7 @@ export const en = { "selectBackground": "Selected Background" }, "componentDocExtra": { - "table": "Additional Documentation for Table Component" + table, }, "idSource": { "title": "OAuth Providers", From 788b3ada46d2f0cf9a6e501385482e7e56af77fa Mon Sep 17 00:00:00 2001 From: RAHEEL Date: Wed, 17 Jan 2024 19:19:21 +0500 Subject: [PATCH 2/3] fix custom component --- .../lowcoder/src/comps/comps/customComp/customComp.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/client/packages/lowcoder/src/comps/comps/customComp/customComp.tsx b/client/packages/lowcoder/src/comps/comps/customComp/customComp.tsx index 990f5b072..fafb3f7f5 100644 --- a/client/packages/lowcoder/src/comps/comps/customComp/customComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/customComp/customComp.tsx @@ -12,7 +12,6 @@ import { EventData, EventTypeEnum } from "./types"; import { hiddenPropertyView } from "comps/utils/propertyUtils"; import { trans } from "i18n"; import { EditorContext } from "comps/editorState"; -import * as ReactDOMClient from 'react-dom/client'; // TODO: eventually to embedd in container so we have styling? // TODO: support different starter templates for different frameworks (react, ANT, Flutter, Angular, etc) @@ -60,8 +59,7 @@ const defaultCode = ` ); const ConnectedComponent = ${trans("customComp.sdkGlobalVarName")}.connect(MyCustomComponent); - const container = document.getElementById('root'); - const root = ReactDOMClient.createRoot(container); + const root = ReactDOM.createRoot(document.getElementById("root")); root.render(); From d19c210ef6de3a4cc36e33bb9b168c2d1aca5067 Mon Sep 17 00:00:00 2001 From: RAHEEL Date: Fri, 19 Jan 2024 15:58:53 +0500 Subject: [PATCH 3/3] fix rerendering apps in sdk --- client/packages/lowcoder-sdk/index.tsx | 5 ++++- client/packages/lowcoder-sdk/package.json | 2 +- client/packages/lowcoder/src/appView/AppViewInstance.tsx | 7 +++---- client/packages/lowcoder/src/appView/bootstrapAt.tsx | 3 ++- 4 files changed, 10 insertions(+), 7 deletions(-) diff --git a/client/packages/lowcoder-sdk/index.tsx b/client/packages/lowcoder-sdk/index.tsx index 4ff48c510..54fc1bb97 100644 --- a/client/packages/lowcoder-sdk/index.tsx +++ b/client/packages/lowcoder-sdk/index.tsx @@ -1,5 +1,6 @@ import { useRef } from "react"; import ReactDOM, { flushSync } from "react-dom"; +import { createRoot } from "react-dom/client"; import { AppViewInstance, bootstrapAppAt, LowcoderAppView } from "./src/index"; const url = new URL(location.href); @@ -70,7 +71,9 @@ async function bootstrap() { }); // React - ReactDOM.render(, document.querySelector("#app2")); + const container = document.querySelector("#app2"); + const root = createRoot(container!); + root.render(); } bootstrap(); diff --git a/client/packages/lowcoder-sdk/package.json b/client/packages/lowcoder-sdk/package.json index 88b06a648..36583cdcf 100644 --- a/client/packages/lowcoder-sdk/package.json +++ b/client/packages/lowcoder-sdk/package.json @@ -1,6 +1,6 @@ { "name": "lowcoder-sdk", - "version": "2.3.0", + "version": "2.3.1", "type": "module", "files": [ "src", diff --git a/client/packages/lowcoder/src/appView/AppViewInstance.tsx b/client/packages/lowcoder/src/appView/AppViewInstance.tsx index b9e8457be..4163ddfff 100644 --- a/client/packages/lowcoder/src/appView/AppViewInstance.tsx +++ b/client/packages/lowcoder/src/appView/AppViewInstance.tsx @@ -4,7 +4,7 @@ import { RootComp } from "comps/comps/rootComp"; import { setGlobalSettings } from "comps/utils/globalSettings"; import { sdkConfig } from "constants/sdkConfig"; import _ from "lodash"; -import { createRoot } from "react-dom/client"; +import { Root } from "react-dom/client"; import { StyleSheetManager } from "styled-components"; import { ModuleDSL, ModuleDSLIoInput } from "types/dsl"; import { AppView } from "./AppView"; @@ -40,7 +40,7 @@ export class AppViewInstance { webUrl: "https://app.lowcoder.cloud", }; - constructor(private appId: string, private node: Element, options: AppViewInstanceOptions = {}) { + constructor(private appId: string, private node: Element, private root: Root, options: AppViewInstanceOptions = {}) { Object.assign(this.options, options); if (this.options.baseUrl) { sdkConfig.baseURL = this.options.baseUrl; @@ -137,8 +137,7 @@ export class AppViewInstance { private async render() { const data = await this.dataPromise; - const root = createRoot(this.node); - root.render( + this.root.render( ( console.error("node must be not null."); return; } - return new AppViewInstance(appId, node, options); + return new AppViewInstance(appId, node, createRoot(node), options); }