diff --git a/.gitignore b/.gitignore index 2e1b56cd5..81c0e6c82 100644 --- a/.gitignore +++ b/.gitignore @@ -9,3 +9,4 @@ client/node_modules/ client/packages/lowcoder-plugin-demo/.yarn/install-state.gz client/packages/lowcoder-plugin-demo/yarn.lock client/packages/lowcoder-plugin-demo/.yarn/cache/@types-node-npm-16.18.68-56f72825c0-094ae9ed80.zip +application-dev.yml diff --git a/client/package.json b/client/package.json index af52e0a31..0034bb1d7 100644 --- a/client/package.json +++ b/client/package.json @@ -35,6 +35,7 @@ "@types/react-resizable": "^3.0.5", "@types/react-router-dom": "^5.3.2", "@types/shelljs": "^0.8.11", + "@types/simplebar": "^5.3.3", "@types/stylis": "^4.0.2", "@types/tern": "0.23.4", "@types/ua-parser-js": "^0.7.36", @@ -79,6 +80,8 @@ "chalk": "4", "number-precision": "^1.6.0", "react-player": "^2.11.0", + "resize-observer-polyfill": "^1.5.1", + "simplebar": "^6.2.5", "tui-image-editor": "^3.15.3" } } diff --git a/client/packages/lowcoder-comps/package.json b/client/packages/lowcoder-comps/package.json index 01733833e..029be11e2 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.26", + "version": "0.0.27", "type": "module", "license": "MIT", "dependencies": { diff --git a/client/packages/lowcoder-comps/src/comps/chartComp/chartComp.tsx b/client/packages/lowcoder-comps/src/comps/chartComp/chartComp.tsx index b6668f1c9..092a8d382 100644 --- a/client/packages/lowcoder-comps/src/comps/chartComp/chartComp.tsx +++ b/client/packages/lowcoder-comps/src/comps/chartComp/chartComp.tsx @@ -120,7 +120,9 @@ ChartTmpComp = withViewFn(ChartTmpComp, (comp) => { const handleOnMapScriptLoad = () => { setMapScriptLoaded(true); - loadGoogleMapData(); + setTimeout(() => { + loadGoogleMapData(); + }) } useEffect(() => { diff --git a/client/packages/lowcoder-design/package.json b/client/packages/lowcoder-design/package.json index ed5b6325f..89050224c 100644 --- a/client/packages/lowcoder-design/package.json +++ b/client/packages/lowcoder-design/package.json @@ -13,7 +13,9 @@ "react-virtualized": "^9.22.3", "rehype-raw": "^6.1.1", "rehype-sanitize": "^5.0.1", - "remark-gfm": "^3.0.1" + "remark-gfm": "^3.0.1", + "simplebar": "^6.2.5", + "simplebar-react": "^3.2.4" }, "devDependencies": { "@rollup/plugin-commonjs": "^23.0.2", @@ -23,6 +25,7 @@ "@rollup/plugin-typescript": "^9.0.2", "@rollup/plugin-url": "^8.0.1", "@svgr/rollup": "^6.5.1", + "@types/simplebar": "^5.3.3", "rollup": "^2", "rollup-plugin-cleaner": "^1.0.0", "rollup-plugin-polyfill-node": "^0.11.0", diff --git a/client/packages/lowcoder-design/src/components/ScrollBar.tsx b/client/packages/lowcoder-design/src/components/ScrollBar.tsx index b171b5646..30a8bf467 100644 --- a/client/packages/lowcoder-design/src/components/ScrollBar.tsx +++ b/client/packages/lowcoder-design/src/components/ScrollBar.tsx @@ -1,8 +1,11 @@ import React from "react"; import SimpleBar from "simplebar-react"; +import 'simplebar-react/dist/simplebar.min.css'; import styled from "styled-components"; +import { DebouncedFunc } from 'lodash'; // Assuming you're using lodash's DebouncedFunc type -const ScrollBarWrapper = styled.div` + +const ScrollBarWrapper = styled.div<{ hidePlaceholder?: boolean }>` min-height: 0; height: 100%; width: 100%; @@ -33,19 +36,39 @@ const ScrollBarWrapper = styled.div` top: 10px; bottom: 10px; } + + ${props => props.hidePlaceholder && ` + .simplebar-placeholder { + display: none !important; + } + `} `; -interface IProps extends SimpleBar.Props { +// .simplebar-placeholder { added by Falk Wolsky to hide the placeholder - as it doubles the vertical space of a Module on a page + +interface IProps { children: React.ReactNode; className?: string; height?: string; + style?: React.CSSProperties; // Add this line to include a style prop + scrollableNodeProps?: { + onScroll: DebouncedFunc<(e: any) => void>; + }; + hidePlaceholder?: boolean; + hideScrollbar?: boolean; } -export const ScrollBar = (props: IProps) => { - const { height = "100%", className, children, ...otherProps } = props; - return ( +export const ScrollBar = ({ height = "100%", className, children, style, scrollableNodeProps, hideScrollbar = false, ...otherProps }: IProps) => { + // You can now use the style prop directly or pass it to SimpleBar + const combinedStyle = { ...style, height }; // Example of combining height with passed style + + return hideScrollbar ? ( + + {children} + + ) : ( - + {children} diff --git a/client/packages/lowcoder-design/src/icons/index.ts b/client/packages/lowcoder-design/src/icons/index.ts index 99c7b553c..71c1df6ab 100644 --- a/client/packages/lowcoder-design/src/icons/index.ts +++ b/client/packages/lowcoder-design/src/icons/index.ts @@ -290,7 +290,7 @@ export { ReactComponent as WidthIcon } from "./icon-width.svg"; export { ReactComponent as ResponsiveLayoutCompIcon } from "./icon-responsive-layout-comp.svg"; export { ReactComponent as TextSizeIcon } from "./remix/font-size-2.svg"; export { ReactComponent as FontFamilyIcon } from "./remix/font-sans-serif.svg"; -export { ReactComponent as TextWeigthIcon } from "./remix/bold.svg"; +export { ReactComponent as TextWeightIcon } from "./remix/bold.svg"; export { ReactComponent as BorderWidthIcon } from "./remix/expand-width-line.svg"; export { ReactComponent as LeftInfoLine } from "./remix/information-line.svg"; export { ReactComponent as LeftInfoFill } from "./remix/information-fill.svg"; diff --git a/client/packages/lowcoder-sdk/package.json b/client/packages/lowcoder-sdk/package.json index e595878f5..69c8c3248 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.1", + "version": "2.3.4", "type": "module", "files": [ "src", diff --git a/client/packages/lowcoder/index.html b/client/packages/lowcoder/index.html index 038b31c38..f1070e64a 100644 --- a/client/packages/lowcoder/index.html +++ b/client/packages/lowcoder/index.html @@ -4,13 +4,7 @@ - - - - - - - +