diff --git a/client/VERSION b/client/VERSION index 6550da697..ab6d27898 100644 --- a/client/VERSION +++ b/client/VERSION @@ -1 +1 @@ -2.4.3 \ No newline at end of file +2.4.4 \ No newline at end of file diff --git a/client/packages/lowcoder-comps/package.json b/client/packages/lowcoder-comps/package.json index ff70d4a41..d4545728e 100644 --- a/client/packages/lowcoder-comps/package.json +++ b/client/packages/lowcoder-comps/package.json @@ -1,6 +1,6 @@ { "name": "lowcoder-comps", - "version": "2.4.8", + "version": "2.4.9", "type": "module", "license": "MIT", "dependencies": { @@ -197,10 +197,10 @@ } }, "scripts": { - "start": "NODE_OPTIONS=--max_old_space_size=6144 vite", - "build": "yarn test && lowcoder-cli build", - "build_only": "lowcoder-cli build", - "build_publish": "lowcoder-cli build --publish", + "start": "NODE_OPTIONS=--max_old_space_size=6442 vite", + "build": "NODE_OPTIONS=--max_old_space_size=6442 yarn test && lowcoder-cli build", + "build_only": "NODE_OPTIONS=--max_old_space_size=6442 lowcoder-cli build", + "build_publish": "NODE_OPTIONS=--max_old_space_size=6442 lowcoder-cli build --publish", "test": "jest" }, "devDependencies": { diff --git a/client/packages/lowcoder-comps/src/comps/basicChartComp/chartComp.tsx b/client/packages/lowcoder-comps/src/comps/basicChartComp/chartComp.tsx index e2a162810..a3522ed1e 100644 --- a/client/packages/lowcoder-comps/src/comps/basicChartComp/chartComp.tsx +++ b/client/packages/lowcoder-comps/src/comps/basicChartComp/chartComp.tsx @@ -74,7 +74,7 @@ BasicChartTmpComp = withViewFn(BasicChartTmpComp, (comp) => { log.error('theme chart error: ', error); } - useMergeCompStyles(childrenToProps(comp.children), comp.dispatch); + useMergeCompStyles?.(childrenToProps(comp.children), comp.dispatch); const triggerClickEvent = async (dispatch: any, action: CompAction) => { await getPromiseAfterDispatch( diff --git a/client/packages/lowcoder-comps/src/comps/basicChartComp/chartConstants.tsx b/client/packages/lowcoder-comps/src/comps/basicChartComp/chartConstants.tsx index a216e5a49..8d8811daf 100644 --- a/client/packages/lowcoder-comps/src/comps/basicChartComp/chartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/basicChartComp/chartConstants.tsx @@ -249,16 +249,22 @@ export const chartUiModeChildren = { onUIEvent: eventHandlerControl(UIEventOptions), }; -const chartJsonModeChildren = { +let chartJsonModeChildren: any = { echartsOption: jsonControl(toObject, i18nObjs.defaultEchartsJsonOption), - echartsTitle: withDefault(StringControl, trans("echarts.defaultTitle")), + echartsTitle: withDefault(StringControl, trans("echarts.defaultTitle")), echartsLegendConfig: EchartsLegendConfig, echartsLabelConfig: EchartsLabelConfig, echartsConfig: EchartsOptionComp, - style: styleControl(EchartsStyle, 'style'), + // style: styleControl(EchartsStyle, 'style'), tooltip: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), } +if (EchartsStyle) { + chartJsonModeChildren = { + ...chartJsonModeChildren, + style: styleControl(EchartsStyle, 'style'), + } +} const chartMapModeChildren = { mapInstance: stateComp(), diff --git a/client/packages/lowcoder-comps/src/comps/calendarComp/calendarComp.tsx b/client/packages/lowcoder-comps/src/comps/calendarComp/calendarComp.tsx index 2b512507c..f3711990d 100644 --- a/client/packages/lowcoder-comps/src/comps/calendarComp/calendarComp.tsx +++ b/client/packages/lowcoder-comps/src/comps/calendarComp/calendarComp.tsx @@ -39,6 +39,7 @@ import { ThemeContext, CalendarStyle, DateParser, + modalInstance, CustomModal, jsonValueExposingStateControl, CalendarDeleteIcon, @@ -70,16 +71,13 @@ import { resourceTimeGridHeaderToolbar, } from "./calendarConstants"; -// this should ensure backwards compatibility with older versions of the SDK -const safeDragEventHandlerControl = typeof DragEventHandlerControl !== 'undefined' ? DragEventHandlerControl : () => {}; - -const childrenMap = { +let childrenMap: any = { events: jsonValueExposingStateControl("events", defaultData), resourcesEvents: jsonValueExposingStateControl("resourcesEvents", resourcesEventsDefaultData), resources: jsonValueExposingStateControl("resources", resourcesDefaultData), resourceName: withDefault(StringControl, trans("calendar.resourcesDefault")), onEvent: ChangeEventHandlerControl, - onDropEvent: safeDragEventHandlerControl, + // onDropEvent: safeDragEventHandlerControl, editable: withDefault(BoolControl, true), showEventTime: withDefault(BoolControl, true), showWeekends: withDefault(BoolControl, true), @@ -93,7 +91,13 @@ const childrenMap = { currentFreeView: dropdownControl(DefaultWithFreeViewOptions, "timeGridWeek"), currentPremiumView: dropdownControl(DefaultWithPremiumViewOptions, "resourceTimelineDay"), }; - +// this should ensure backwards compatibility with older versions of the SDK +if (DragEventHandlerControl) { + childrenMap = { + ...childrenMap, + onDropEvent: DragEventHandlerControl, + } +} let CalendarBasicComp = (function () { return new UICompBuilder(childrenMap, (props: { events: any; @@ -124,7 +128,7 @@ let CalendarBasicComp = (function () { const [left, setLeft] = useState(undefined); const [licensed, setLicensed] = useState(props.licenseKey !== ""); - useMergeCompStyles(props, dispatch); + useMergeCompStyles?.(props, dispatch); useEffect(() => { setLicensed(props.licenseKey !== ""); @@ -326,6 +330,8 @@ let CalendarBasicComp = (function () { }; const showModal = (event: EventType, ifEdit: boolean) => { + if (!modalInstance) return; + const modalTitle = ifEdit ? trans("calendar.editEvent") : trans("calendar.creatEvent"); diff --git a/client/packages/lowcoder-comps/src/comps/candleStickChartComp/candleStickChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/candleStickChartComp/candleStickChartConstants.tsx index cee782aab..35852214d 100644 --- a/client/packages/lowcoder-comps/src/comps/candleStickChartComp/candleStickChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/candleStickChartComp/candleStickChartConstants.tsx @@ -247,16 +247,22 @@ export const chartUiModeChildren = { onUIEvent: eventHandlerControl(UIEventOptions), }; -const chartJsonModeChildren = { +let chartJsonModeChildren: any = { echartsOption: jsonControl(toObject, i18nObjs.defaultCandleStickChartOption), echartsTitle: withDefault(StringControl, trans("candleStickChart.defaultTitle")), echartsLegendConfig: EchartsLegendConfig, echartsLabelConfig: EchartsLabelConfig, echartsConfig: EchartsOptionComp, - style: styleControl(EchartsStyle, 'style'), + // style: styleControl(EchartsStyle, 'style'), tooltip: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), } +if (EchartsStyle) { + chartJsonModeChildren = { + ...chartJsonModeChildren, + style: styleControl(EchartsStyle, 'style'), + } +} const chartMapModeChildren = { mapInstance: stateComp(), diff --git a/client/packages/lowcoder-comps/src/comps/candleStickChartComp/candleStickChartPropertyView.tsx b/client/packages/lowcoder-comps/src/comps/candleStickChartComp/candleStickChartPropertyView.tsx index 9fa9060e3..f0eea1e15 100644 --- a/client/packages/lowcoder-comps/src/comps/candleStickChartComp/candleStickChartPropertyView.tsx +++ b/client/packages/lowcoder-comps/src/comps/candleStickChartComp/candleStickChartPropertyView.tsx @@ -38,7 +38,7 @@ export function candleStickChartPropertyView( {children.onEvent.propertyView()}
- {children.style.getPropertyView()} + {children.style?.getPropertyView()}
{hiddenPropertyView(children)}
diff --git a/client/packages/lowcoder-comps/src/comps/chartComp/chartComp.tsx b/client/packages/lowcoder-comps/src/comps/chartComp/chartComp.tsx index 7e49fed09..f93ae0f50 100644 --- a/client/packages/lowcoder-comps/src/comps/chartComp/chartComp.tsx +++ b/client/packages/lowcoder-comps/src/comps/chartComp/chartComp.tsx @@ -78,7 +78,7 @@ ChartTmpComp = withViewFn(ChartTmpComp, (comp) => { } const triggerClickEvent = async (dispatch: any, action: CompAction) => { - await getPromiseAfterDispatch( + await getPromiseAfterDispatch?.( dispatch, action, { autoHandleAfterReduce: true } diff --git a/client/packages/lowcoder-comps/src/comps/funnelChartComp/funnelChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/funnelChartComp/funnelChartConstants.tsx index e668de39a..0475493b0 100644 --- a/client/packages/lowcoder-comps/src/comps/funnelChartComp/funnelChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/funnelChartComp/funnelChartConstants.tsx @@ -248,14 +248,14 @@ export const chartUiModeChildren = { onUIEvent: eventHandlerControl(UIEventOptions), }; -const chartJsonModeChildren = { +let chartJsonModeChildren: any = { echartsOption: jsonControl(toObject, i18nObjs.defaultFunnelChartOption), echartsTitle: withDefault(StringControl, trans("funnelChart.defaultTitle")), echartsLegendConfig: EchartsLegendConfig, echartsLabelConfig: EchartsLabelConfig, echartsConfig: EchartsOptionComp, echartsTitleConfig:EchartsTitleConfig, - style: styleControl(EchartsStyle, 'style'), + // style: styleControl(EchartsStyle, 'style'), tooltip: withDefault(BoolControl, true), label: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), @@ -267,6 +267,12 @@ const chartJsonModeChildren = { max:withDefault(NumberControl,trans('funnelChart.defaultMax')), gap:withDefault(NumberControl,trans('funnelChart.defaultGap')) } +if (EchartsStyle) { + chartJsonModeChildren = { + ...chartJsonModeChildren, + style: styleControl(EchartsStyle, 'style'), + } +} const chartMapModeChildren = { mapInstance: stateComp(), diff --git a/client/packages/lowcoder-comps/src/comps/funnelChartComp/funnelChartPropertyView.tsx b/client/packages/lowcoder-comps/src/comps/funnelChartComp/funnelChartPropertyView.tsx index 4f90f9ac9..38171e34e 100644 --- a/client/packages/lowcoder-comps/src/comps/funnelChartComp/funnelChartPropertyView.tsx +++ b/client/packages/lowcoder-comps/src/comps/funnelChartComp/funnelChartPropertyView.tsx @@ -50,7 +50,7 @@ export function funnelChartPropertyView( {children.onEvent.propertyView()}
- {children.style.getPropertyView()} + {children.style?.getPropertyView()}
{hiddenPropertyView(children)}
diff --git a/client/packages/lowcoder-comps/src/comps/gaugeChartComp/gaugeChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/gaugeChartComp/gaugeChartConstants.tsx index 23f14ce77..89571a5bd 100644 --- a/client/packages/lowcoder-comps/src/comps/gaugeChartComp/gaugeChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/gaugeChartComp/gaugeChartConstants.tsx @@ -248,14 +248,14 @@ export const chartUiModeChildren = { onUIEvent: eventHandlerControl(UIEventOptions), }; -const chartJsonModeChildren = { +let chartJsonModeChildren: any = { echartsOption: jsonControl(toObject, i18nObjs.defaultGaugeChartOption), echartsTitle: withDefault(StringControl, trans("gaugeChart.defaultTitle")), echartsLegendConfig: EchartsLegendConfig, echartsLabelConfig: EchartsLabelConfig, echartsConfig: EchartsOptionComp, echartsTitleConfig:EchartsTitleConfig, - style: styleControl(EchartsStyle, 'style'), + // style: styleControl(EchartsStyle, 'style'), tooltip: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), label: withDefault(BoolControl, true), @@ -267,7 +267,12 @@ const chartJsonModeChildren = { max:withDefault(NumberControl,trans('gaugeChart.defaultMax')), gap:withDefault(NumberControl,trans('gaugeChart.defaultGap')) } - +if (EchartsStyle) { + chartJsonModeChildren = { + ...chartJsonModeChildren, + style: styleControl(EchartsStyle, 'style'), + } +} const chartMapModeChildren = { mapInstance: stateComp(), getMapInstance: FunctionControl, diff --git a/client/packages/lowcoder-comps/src/comps/gaugeChartComp/gaugeChartPropertyView.tsx b/client/packages/lowcoder-comps/src/comps/gaugeChartComp/gaugeChartPropertyView.tsx index b1ac4bad3..026006072 100644 --- a/client/packages/lowcoder-comps/src/comps/gaugeChartComp/gaugeChartPropertyView.tsx +++ b/client/packages/lowcoder-comps/src/comps/gaugeChartComp/gaugeChartPropertyView.tsx @@ -46,7 +46,7 @@ export function gaugeChartPropertyView( {children.onEvent.propertyView()}
- {children.style.getPropertyView()} + {children.style?.getPropertyView()}
{hiddenPropertyView(children)}
diff --git a/client/packages/lowcoder-comps/src/comps/graphChartComp/graphChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/graphChartComp/graphChartConstants.tsx index a643affc4..ae000e6f7 100644 --- a/client/packages/lowcoder-comps/src/comps/graphChartComp/graphChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/graphChartComp/graphChartConstants.tsx @@ -247,16 +247,22 @@ export const chartUiModeChildren = { onUIEvent: eventHandlerControl(UIEventOptions), }; -const chartJsonModeChildren = { +let chartJsonModeChildren: any = { echartsOption: jsonControl(toObject, i18nObjs.defaultGraphChartOption), echartsTitle: withDefault(StringControl, trans("graphChart.defaultTitle")), echartsLegendConfig: EchartsLegendConfig, echartsLabelConfig: EchartsLabelConfig, echartsConfig: EchartsOptionComp, - style: styleControl(EchartsStyle, 'style'), + // style: styleControl(EchartsStyle, 'style'), tooltip: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), } +if (EchartsStyle) { + chartJsonModeChildren = { + ...chartJsonModeChildren, + style: styleControl(EchartsStyle, 'style'), + } +} const chartMapModeChildren = { mapInstance: stateComp(), diff --git a/client/packages/lowcoder-comps/src/comps/graphChartComp/graphChartPropertyView.tsx b/client/packages/lowcoder-comps/src/comps/graphChartComp/graphChartPropertyView.tsx index 3ad76fb1e..ba9ebbebc 100644 --- a/client/packages/lowcoder-comps/src/comps/graphChartComp/graphChartPropertyView.tsx +++ b/client/packages/lowcoder-comps/src/comps/graphChartComp/graphChartPropertyView.tsx @@ -38,7 +38,7 @@ export function graphChartPropertyView( {children.onEvent.propertyView()}
- {children.style.getPropertyView()} + {children.style?.getPropertyView()}
{hiddenPropertyView(children)}
diff --git a/client/packages/lowcoder-comps/src/comps/heatmapChartComp/heatmapChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/heatmapChartComp/heatmapChartConstants.tsx index 2ecfd3091..51ccd46da 100644 --- a/client/packages/lowcoder-comps/src/comps/heatmapChartComp/heatmapChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/heatmapChartComp/heatmapChartConstants.tsx @@ -247,16 +247,22 @@ export const chartUiModeChildren = { onUIEvent: eventHandlerControl(UIEventOptions), }; -const chartJsonModeChildren = { +let chartJsonModeChildren: any = { echartsOption: jsonControl(toObject, i18nObjs.defaultHeatmapChartOption), echartsTitle: withDefault(StringControl, trans("heatmapChart.defaultTitle")), echartsLegendConfig: EchartsLegendConfig, echartsLabelConfig: EchartsLabelConfig, echartsConfig: EchartsOptionComp, - style: styleControl(EchartsStyle, 'style'), + // style: styleControl(EchartsStyle, 'style'), tooltip: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), } +if (EchartsStyle) { + chartJsonModeChildren = { + ...chartJsonModeChildren, + style: styleControl(EchartsStyle, 'style'), + } +} const chartMapModeChildren = { mapInstance: stateComp(), diff --git a/client/packages/lowcoder-comps/src/comps/heatmapChartComp/heatmapChartPropertyView.tsx b/client/packages/lowcoder-comps/src/comps/heatmapChartComp/heatmapChartPropertyView.tsx index 8f990546e..c7d350bfc 100644 --- a/client/packages/lowcoder-comps/src/comps/heatmapChartComp/heatmapChartPropertyView.tsx +++ b/client/packages/lowcoder-comps/src/comps/heatmapChartComp/heatmapChartPropertyView.tsx @@ -38,7 +38,7 @@ export function heatmapChartPropertyView( {children.onEvent.propertyView()}
- {children.style.getPropertyView()} + {children.style?.getPropertyView()}
{hiddenPropertyView(children)}
diff --git a/client/packages/lowcoder-comps/src/comps/radarChartComp/radarChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/radarChartComp/radarChartConstants.tsx index be9ed1ec1..44d2631b8 100644 --- a/client/packages/lowcoder-comps/src/comps/radarChartComp/radarChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/radarChartComp/radarChartConstants.tsx @@ -247,16 +247,22 @@ export const chartUiModeChildren = { onUIEvent: eventHandlerControl(UIEventOptions), }; -const chartJsonModeChildren = { +let chartJsonModeChildren: any = { echartsOption: jsonControl(toObject, i18nObjs.defaultRadarChartOption), echartsTitle: withDefault(StringControl, trans("radarChart.defaultTitle")), echartsLegendConfig: EchartsLegendConfig, echartsLabelConfig: EchartsLabelConfig, echartsConfig: EchartsOptionComp, - style: styleControl(EchartsStyle, 'style'), + // style: styleControl(EchartsStyle, 'style'), tooltip: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), } +if (EchartsStyle) { + chartJsonModeChildren = { + ...chartJsonModeChildren, + style: styleControl(EchartsStyle, 'style'), + } +} const chartMapModeChildren = { mapInstance: stateComp(), diff --git a/client/packages/lowcoder-comps/src/comps/radarChartComp/radarChartPropertyView.tsx b/client/packages/lowcoder-comps/src/comps/radarChartComp/radarChartPropertyView.tsx index f6ea20b14..9a095b585 100644 --- a/client/packages/lowcoder-comps/src/comps/radarChartComp/radarChartPropertyView.tsx +++ b/client/packages/lowcoder-comps/src/comps/radarChartComp/radarChartPropertyView.tsx @@ -38,7 +38,7 @@ export function radarChartPropertyView( {children.onEvent.propertyView()}
- {children.style.getPropertyView()} + {children.style?.getPropertyView()}
{hiddenPropertyView(children)}
diff --git a/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartConstants.tsx index 7d834e9d7..681d119e6 100644 --- a/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartConstants.tsx @@ -247,16 +247,22 @@ export const chartUiModeChildren = { onUIEvent: eventHandlerControl(UIEventOptions), }; -const chartJsonModeChildren = { +let chartJsonModeChildren: any = { echartsOption: jsonControl(toObject, i18nObjs.defaultSankeyChartOption), echartsTitle: withDefault(StringControl, trans("sankeyChart.defaultTitle")), echartsLegendConfig: EchartsLegendConfig, echartsLabelConfig: EchartsLabelConfig, echartsConfig: EchartsOptionComp, - style: styleControl(EchartsStyle, 'style'), + // style: styleControl(EchartsStyle, 'style'), tooltip: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), } +if (EchartsStyle) { + chartJsonModeChildren = { + ...chartJsonModeChildren, + style: styleControl(EchartsStyle, 'style'), + } +} const chartMapModeChildren = { mapInstance: stateComp(), diff --git a/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartPropertyView.tsx b/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartPropertyView.tsx index da18ef2a4..4acfb77f8 100644 --- a/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartPropertyView.tsx +++ b/client/packages/lowcoder-comps/src/comps/sankeyChartComp/sankeyChartPropertyView.tsx @@ -39,7 +39,7 @@ export function sankeyChartPropertyView( {children.onEvent.propertyView()}
- {children.style.getPropertyView()} + {children.style?.getPropertyView()}
{hiddenPropertyView(children)}
diff --git a/client/packages/lowcoder-comps/src/comps/sunburstChartComp/sunburstChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/sunburstChartComp/sunburstChartConstants.tsx index 51aa6ae0e..a26e08c2c 100644 --- a/client/packages/lowcoder-comps/src/comps/sunburstChartComp/sunburstChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/sunburstChartComp/sunburstChartConstants.tsx @@ -247,16 +247,22 @@ export const chartUiModeChildren = { onUIEvent: eventHandlerControl(UIEventOptions), }; -const chartJsonModeChildren = { +let chartJsonModeChildren: any = { echartsOption: jsonControl(toObject, i18nObjs.defaultSunburstChartOption), echartsTitle: withDefault(StringControl, trans("sunburstChart.defaultTitle")), echartsLegendConfig: EchartsLegendConfig, echartsLabelConfig: EchartsLabelConfig, echartsConfig: EchartsOptionComp, - style: styleControl(EchartsStyle, 'style'), + // style: styleControl(EchartsStyle, 'style'), tooltip: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), } +if (EchartsStyle) { + chartJsonModeChildren = { + ...chartJsonModeChildren, + style: styleControl(EchartsStyle, 'style'), + } +} const chartMapModeChildren = { mapInstance: stateComp(), diff --git a/client/packages/lowcoder-comps/src/comps/sunburstChartComp/sunburstChartPropertyView.tsx b/client/packages/lowcoder-comps/src/comps/sunburstChartComp/sunburstChartPropertyView.tsx index c8e631be8..9b2ff99b0 100644 --- a/client/packages/lowcoder-comps/src/comps/sunburstChartComp/sunburstChartPropertyView.tsx +++ b/client/packages/lowcoder-comps/src/comps/sunburstChartComp/sunburstChartPropertyView.tsx @@ -38,7 +38,7 @@ export function sunburstChartPropertyView( {children.onEvent.propertyView()}
- {children.style.getPropertyView()} + {children.style?.getPropertyView()}
{hiddenPropertyView(children)}
diff --git a/client/packages/lowcoder-comps/src/comps/themeriverChartComp/themeriverChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/themeriverChartComp/themeriverChartConstants.tsx index e2f973ea2..8819fb2fb 100644 --- a/client/packages/lowcoder-comps/src/comps/themeriverChartComp/themeriverChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/themeriverChartComp/themeriverChartConstants.tsx @@ -247,17 +247,22 @@ export const chartUiModeChildren = { onUIEvent: eventHandlerControl(UIEventOptions), }; -const chartJsonModeChildren = { +let chartJsonModeChildren: any = { echartsOption: jsonControl(toObject, i18nObjs.defaultThemeriverChartOption), echartsTitle: withDefault(StringControl, trans("themeriverChart.defaultTitle")), echartsLegendConfig: EchartsLegendConfig, echartsLabelConfig: EchartsLabelConfig, echartsConfig: EchartsOptionComp, - style: styleControl(EchartsStyle, 'style'), + // style: styleControl(EchartsStyle, 'style'), tooltip: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), } - +if (EchartsStyle) { + chartJsonModeChildren = { + ...chartJsonModeChildren, + style: styleControl(EchartsStyle, 'style'), + } +} const chartMapModeChildren = { mapInstance: stateComp(), getMapInstance: FunctionControl, diff --git a/client/packages/lowcoder-comps/src/comps/themeriverChartComp/themeriverChartPropertyView.tsx b/client/packages/lowcoder-comps/src/comps/themeriverChartComp/themeriverChartPropertyView.tsx index 529dbcc57..1825bc6ee 100644 --- a/client/packages/lowcoder-comps/src/comps/themeriverChartComp/themeriverChartPropertyView.tsx +++ b/client/packages/lowcoder-comps/src/comps/themeriverChartComp/themeriverChartPropertyView.tsx @@ -38,7 +38,7 @@ export function themeriverChartPropertyView( {children.onEvent.propertyView()}
- {children.style.getPropertyView()} + {children.style?.getPropertyView()}
{hiddenPropertyView(children)}
diff --git a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartConstants.tsx index 8dfe7f49c..62804d637 100644 --- a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartConstants.tsx @@ -247,16 +247,22 @@ export const chartUiModeChildren = { onUIEvent: eventHandlerControl(UIEventOptions), }; -const chartJsonModeChildren = { +let chartJsonModeChildren: any = { echartsOption: jsonControl(toObject, i18nObjs.defaultTreeChartOption), echartsTitle: withDefault(StringControl, trans("treeChart.defaultTitle")), echartsLegendConfig: EchartsLegendConfig, echartsLabelConfig: EchartsLabelConfig, echartsConfig: EchartsOptionComp, - style: styleControl(EchartsStyle, 'style'), + // style: styleControl(EchartsStyle, 'style'), tooltip: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), } +if (EchartsStyle) { + chartJsonModeChildren = { + ...chartJsonModeChildren, + style: styleControl(EchartsStyle, 'style'), + } +} const chartMapModeChildren = { mapInstance: stateComp(), diff --git a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartPropertyView.tsx b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartPropertyView.tsx index 920062913..342906516 100644 --- a/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartPropertyView.tsx +++ b/client/packages/lowcoder-comps/src/comps/treeChartComp/treeChartPropertyView.tsx @@ -38,7 +38,7 @@ export function treeChartPropertyView( {children.onEvent.propertyView()}
- {children.style.getPropertyView()} + {children.style?.getPropertyView()}
{hiddenPropertyView(children)}
diff --git a/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartConstants.tsx b/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartConstants.tsx index 45ff3ad5d..92697cb79 100644 --- a/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartConstants.tsx +++ b/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartConstants.tsx @@ -247,16 +247,22 @@ export const chartUiModeChildren = { onUIEvent: eventHandlerControl(UIEventOptions), }; -const chartJsonModeChildren = { +let chartJsonModeChildren: any = { echartsOption: jsonControl(toObject, i18nObjs.defaultTreemapChartOption), echartsTitle: withDefault(StringControl, trans("treemapChart.defaultTitle")), echartsLegendConfig: EchartsLegendConfig, echartsLabelConfig: EchartsLabelConfig, echartsConfig: EchartsOptionComp, - style: styleControl(EchartsStyle, 'style'), + // style: styleControl(EchartsStyle, 'style'), tooltip: withDefault(BoolControl, true), legendVisibility: withDefault(BoolControl, true), } +if (EchartsStyle) { + chartJsonModeChildren = { + ...chartJsonModeChildren, + style: styleControl(EchartsStyle, 'style'), + } +} const chartMapModeChildren = { mapInstance: stateComp(), diff --git a/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartPropertyView.tsx b/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartPropertyView.tsx index 4d5c543bb..a4fc43e02 100644 --- a/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartPropertyView.tsx +++ b/client/packages/lowcoder-comps/src/comps/treemapChartComp/treemapChartPropertyView.tsx @@ -38,7 +38,7 @@ export function treeChartPropertyView( {children.onEvent.propertyView()}
- {children.style.getPropertyView()} + {children.style?.getPropertyView()}
{hiddenPropertyView(children)}
diff --git a/client/packages/lowcoder-core/lib/index.js b/client/packages/lowcoder-core/lib/index.js index 942911d32..ffb09f973 100644 --- a/client/packages/lowcoder-core/lib/index.js +++ b/client/packages/lowcoder-core/lib/index.js @@ -1,118 +1,118 @@ import _ from 'lodash'; import { serialize, compile, middleware, prefixer, stringify } from 'stylis'; -/****************************************************************************** -Copyright (c) Microsoft Corporation. - -Permission to use, copy, modify, and/or distribute this software for any -purpose with or without fee is hereby granted. - -THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH -REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY -AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, -INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM -LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR -OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR -PERFORMANCE OF THIS SOFTWARE. -***************************************************************************** */ -/* global Reflect, Promise, SuppressedError, Symbol */ - -var extendStatics = function(d, b) { - extendStatics = Object.setPrototypeOf || - ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || - function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; }; - return extendStatics(d, b); -}; - -function __extends(d, b) { - if (typeof b !== "function" && b !== null) - throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); - extendStatics(d, b); - function __() { this.constructor = d; } - d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); -} - -var __assign = function() { - __assign = Object.assign || function __assign(t) { - for (var s, i = 1, n = arguments.length; i < n; i++) { - s = arguments[i]; - for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; - } - return t; - }; - return __assign.apply(this, arguments); -}; - -function __rest(s, e) { - var t = {}; - for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) - t[p] = s[p]; - if (s != null && typeof Object.getOwnPropertySymbols === "function") - for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { - if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) - t[p[i]] = s[p[i]]; - } - return t; -} - -function __decorate(decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -} - -function __awaiter(thisArg, _arguments, P, generator) { - function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } - return new (P || (P = Promise))(function (resolve, reject) { - function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } - function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } - function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } - step((generator = generator.apply(thisArg, _arguments || [])).next()); - }); -} - -function __generator(thisArg, body) { - var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g; - return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; - function verb(n) { return function (v) { return step([n, v]); }; } - function step(op) { - if (f) throw new TypeError("Generator is already executing."); - while (g && (g = 0, op[0] && (_ = 0)), _) try { - if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; - if (y = 0, t) op = [op[0] & 2, t.value]; - switch (op[0]) { - case 0: case 1: t = op; break; - case 4: _.label++; return { value: op[1], done: false }; - case 5: _.label++; y = op[1]; op = [0]; continue; - case 7: op = _.ops.pop(); _.trys.pop(); continue; - default: - if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } - if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } - if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } - if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } - if (t[2]) _.ops.pop(); - _.trys.pop(); continue; - } - op = body.call(thisArg, _); - } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } - if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; - } -} - -function __spreadArray(to, from, pack) { - if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) { - if (ar || !(i in from)) { - if (!ar) ar = Array.prototype.slice.call(from, 0, i); - ar[i] = from[i]; - } - } - return to.concat(ar || Array.prototype.slice.call(from)); -} - -typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) { - var e = new Error(message); - return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e; +/****************************************************************************** +Copyright (c) Microsoft Corporation. + +Permission to use, copy, modify, and/or distribute this software for any +purpose with or without fee is hereby granted. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH +REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY +AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, +INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM +LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR +OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR +PERFORMANCE OF THIS SOFTWARE. +***************************************************************************** */ +/* global Reflect, Promise, SuppressedError, Symbol */ + +var extendStatics = function(d, b) { + extendStatics = Object.setPrototypeOf || + ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || + function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; }; + return extendStatics(d, b); +}; + +function __extends(d, b) { + if (typeof b !== "function" && b !== null) + throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + extendStatics(d, b); + function __() { this.constructor = d; } + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); +} + +var __assign = function() { + __assign = Object.assign || function __assign(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + return t; + }; + return __assign.apply(this, arguments); +}; + +function __rest(s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +} + +function __decorate(decorators, target, key, desc) { + var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; + if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); + else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; + return c > 3 && r && Object.defineProperty(target, key, r), r; +} + +function __awaiter(thisArg, _arguments, P, generator) { + function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } + return new (P || (P = Promise))(function (resolve, reject) { + function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } + function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } + function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } + step((generator = generator.apply(thisArg, _arguments || [])).next()); + }); +} + +function __generator(thisArg, body) { + var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g; + return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; + function verb(n) { return function (v) { return step([n, v]); }; } + function step(op) { + if (f) throw new TypeError("Generator is already executing."); + while (g && (g = 0, op[0] && (_ = 0)), _) try { + if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; + if (y = 0, t) op = [op[0] & 2, t.value]; + switch (op[0]) { + case 0: case 1: t = op; break; + case 4: _.label++; return { value: op[1], done: false }; + case 5: _.label++; y = op[1]; op = [0]; continue; + case 7: op = _.ops.pop(); _.trys.pop(); continue; + default: + if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } + if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } + if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } + if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } + if (t[2]) _.ops.pop(); + _.trys.pop(); continue; + } + op = body.call(thisArg, _); + } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } + if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; + } +} + +function __spreadArray(to, from, pack) { + if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) { + if (ar || !(i in from)) { + if (!ar) ar = Array.prototype.slice.call(from, 0, i); + ar[i] = from[i]; + } + } + return to.concat(ar || Array.prototype.slice.call(from)); +} + +typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) { + var e = new Error(message); + return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e; }; function isEqualArgs(args, cacheArgs, equals) { @@ -1776,6 +1776,11 @@ var CodeNode = /** @class */ (function (_super) { value.triggerType === "manual") { return; } + // wait for lazy loaded comps to load before executing query on page load + if (!Object.keys(value).length) { + isFetching_1 = true; + ready_1 = false; + } if (_.has(value, IS_FETCHING_FIELD)) { isFetching_1 = isFetching_1 || value.isFetching === true; } diff --git a/client/packages/lowcoder-core/src/eval/codeNode.tsx b/client/packages/lowcoder-core/src/eval/codeNode.tsx index 587cb8662..3afba6f0b 100644 --- a/client/packages/lowcoder-core/src/eval/codeNode.tsx +++ b/client/packages/lowcoder-core/src/eval/codeNode.tsx @@ -172,7 +172,11 @@ export class CodeNode extends AbstractNode> { ) { return; } - + // wait for lazy loaded comps to load before executing query on page load + if (!Object.keys(value).length) { + isFetching = true; + ready = false; + } if (_.has(value, IS_FETCHING_FIELD)) { isFetching = isFetching || value.isFetching === true; } diff --git a/client/packages/lowcoder-sdk/dataSource.d.ts b/client/packages/lowcoder-sdk/dataSource.d.ts index 797698767..32704cf5c 100644 --- a/client/packages/lowcoder-sdk/dataSource.d.ts +++ b/client/packages/lowcoder-sdk/dataSource.d.ts @@ -319,7 +319,19 @@ export interface DataSourcePluginMeta extends DataSourcePluginBasicInfo { DataSourceConfig, { extra?: DynamicConfigObject; - } + authConfig?: { + type: AuthType; + authId?: string; + } & ( + | { + username: string; // basic auth + password: string; + } + | OAuthConfig + ); + sslConfig?: SSLConfig; + headers: KeyValue; + }, >; queryConfig: DynamicConfigObject | QueryConfig; shouldValidateDataSourceConfig: boolean; diff --git a/client/packages/lowcoder-sdk/package.json b/client/packages/lowcoder-sdk/package.json index f774eebd3..01a0f29a8 100644 --- a/client/packages/lowcoder-sdk/package.json +++ b/client/packages/lowcoder-sdk/package.json @@ -1,6 +1,6 @@ { "name": "lowcoder-sdk", - "version": "2.4.7", + "version": "2.4.8", "type": "module", "files": [ "src", @@ -28,8 +28,8 @@ } }, "scripts": { - "build": "vite build", - "start": "vite" + "build": "NODE_OPTIONS=--max_old_space_size=6442 vite build", + "start": "NODE_OPTIONS=--max_old_space_size=2048 vite" }, "devDependencies": { "@rollup/plugin-commonjs": "^22.0.2", diff --git a/client/packages/lowcoder/src/api/userApi.ts b/client/packages/lowcoder/src/api/userApi.ts index c171ab4ab..d6d8a3718 100644 --- a/client/packages/lowcoder/src/api/userApi.ts +++ b/client/packages/lowcoder/src/api/userApi.ts @@ -94,8 +94,14 @@ class UserApi extends Api { } static formLogin(request: FormLoginRequest): AxiosPromise { - const { invitationId, ...reqBody } = request; - const queryParam = invitationId ? { invitationId: invitationId } : undefined; + const { invitationId, orgId, ...reqBody } = request; + let queryParam: Record = {}; + if (invitationId) { + queryParam['invitationId'] = invitationId; + } + if (orgId) { + queryParam['orgId'] = orgId; + } return Api.post(UserApi.formLoginURL, reqBody, queryParam); } diff --git a/client/packages/lowcoder/src/base/codeEditor/codeEditor.tsx b/client/packages/lowcoder/src/base/codeEditor/codeEditor.tsx index 594bc3403..9e8bfc4d4 100644 --- a/client/packages/lowcoder/src/base/codeEditor/codeEditor.tsx +++ b/client/packages/lowcoder/src/base/codeEditor/codeEditor.tsx @@ -14,6 +14,7 @@ import { CodeEditorPanel } from "../../pages/editor/codeEditorPanel"; import type { CodeEditorProps, StyleName } from "./codeEditorTypes"; import { useClickCompNameEffect } from "./clickCompName"; import { Layers } from "../../constants/Layers"; +import { debounce } from "lodash"; type StyleConfig = { minHeight: string; @@ -219,12 +220,12 @@ function useCodeMirror( const showLineNum = props.showLineNum ?? getStyle(props.styleName).showLineNum; const handleChange = useCallback( - (state: EditorState) => { + debounce((state: EditorState) => { window.clearTimeout(isTypingRef.current); isTypingRef.current = window.setTimeout(() => (isTypingRef.current = 0), 100); onChange?.(state); - }, - [onChange] + }, 100) + , [onChange] ); const { extensions, reconfigure, isFocus } = useExtensions({ diff --git a/client/packages/lowcoder/src/components/CompName.tsx b/client/packages/lowcoder/src/components/CompName.tsx index b350cf746..0e11d10e2 100644 --- a/client/packages/lowcoder/src/components/CompName.tsx +++ b/client/packages/lowcoder/src/components/CompName.tsx @@ -121,12 +121,12 @@ export const CompName = (props: Iprops) => { onClick: () => { }, }); - items.push({ - text: trans("history.currentVersion") + ": " + compInfo.packageVersion, - onClick: () => { + // items.push({ + // text: trans("history.currentVersion") + ": " + compInfo.packageVersion, + // onClick: () => { - }, - }); + // }, + // }); items.push({ text: trans("comp.menuUpgradeToLatest"), diff --git a/client/packages/lowcoder/src/comps/comps/appSettingsComp.tsx b/client/packages/lowcoder/src/comps/comps/appSettingsComp.tsx index d4de3b59f..667c2b9ae 100644 --- a/client/packages/lowcoder/src/comps/comps/appSettingsComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/appSettingsComp.tsx @@ -4,7 +4,7 @@ import { dropdownInputSimpleControl } from "comps/controls/dropdownInputSimpleCo import { MultiCompBuilder, valueComp, withDefault } from "comps/generators"; import { AddIcon, Dropdown } from "lowcoder-design"; import { EllipsisSpan } from "pages/setting/theme/styledComponents"; -import { useEffect } from "react"; +import { useEffect, useState } from "react"; import { useSelector } from "react-redux"; import { getDefaultTheme, getThemeList } from "redux/selectors/commonSettingSelectors"; import styled, { css } from "styled-components"; @@ -19,6 +19,8 @@ import { IconControl } from "comps/controls/iconControl"; import { dropdownControl } from "comps/controls/dropdownControl"; import { ApplicationCategoriesEnum } from "constants/applicationConstants"; import { BoolControl } from "../controls/boolControl"; +import { getNpmPackageMeta } from "../utils/remote"; +import { getPromiseAfterDispatch } from "@lowcoder-ee/util/promiseUtils"; const TITLE = trans("appSetting.title"); const USER_DEFINE = "__USER_DEFINE"; @@ -189,6 +191,7 @@ const childrenMap = { preventAppStylesOverwriting: withDefault(BoolControl, true), customShortcuts: CustomShortcutsComp, disableCollision: valueComp(false), + lowcoderCompVersion: withDefault(StringControl, 'latest'), }; type ChildrenInstance = RecordConstructorToComp & { themeList: ThemeType[]; @@ -196,6 +199,7 @@ type ChildrenInstance = RecordConstructorToComp & { }; function AppSettingsModal(props: ChildrenInstance) { + const [lowcoderCompVersions, setLowcoderCompVersions] = useState(['latest']); const { themeList, defaultTheme, @@ -207,11 +211,14 @@ function AppSettingsModal(props: ChildrenInstance) { category, showHeaderInPublic, preventAppStylesOverwriting, + lowcoderCompVersion, } = props; + const THEME_OPTIONS = themeList?.map((theme) => ({ label: theme.name, value: theme.id + "", })); + const themeWithDefault = ( themeId.getView() === DEFAULT_THEMEID || (!!themeId.getView() && @@ -225,6 +232,17 @@ function AppSettingsModal(props: ChildrenInstance) { themeId.dispatchChangeValueAction(themeWithDefault); } }, [themeWithDefault]); + + useEffect(() => { + const fetchCompsPackageMeta = async () => { + const packageMeta = await getNpmPackageMeta('lowcoder-comps'); + if (packageMeta?.versions) { + setLowcoderCompVersions(Object.keys(packageMeta.versions).reverse()) + } + } + fetchCompsPackageMeta(); + }, []) + const DropdownItem = (params: { value: string }) => { const themeItem = themeList.find((theme) => theme.id === params.value); @@ -308,6 +326,30 @@ function AppSettingsModal(props: ChildrenInstance) { })} + + + ({label: version, value: version})) + } + label={'Lowcoder Comps Version'} + placement="bottom" + onChange={async (value) => { + await getPromiseAfterDispatch( + lowcoderCompVersion.dispatch, + lowcoderCompVersion.changeValueAction(value), { + autoHandleAfterReduce: true, + } + ) + setTimeout(() => { + window.location.reload(); + }, 1000); + }} + /> + + {props.customShortcuts.getPropertyView()} ); diff --git a/client/packages/lowcoder/src/comps/comps/buttonComp/dropdownComp.tsx b/client/packages/lowcoder/src/comps/comps/buttonComp/dropdownComp.tsx index 8e99f5a4c..629314582 100644 --- a/client/packages/lowcoder/src/comps/comps/buttonComp/dropdownComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/buttonComp/dropdownComp.tsx @@ -111,7 +111,8 @@ const DropdownTmpComp = (function () { items={items} onClick={({ key }) => { const item = items.find((o) => o.key === key); - item && props.options[item.index]?.onEvent("click"); + const itemIndex = props.options.findIndex(option => option.label === item?.label); + item && props.options[itemIndex]?.onEvent("click"); }} /> ); diff --git a/client/packages/lowcoder/src/comps/comps/dataChangeResponderComp.tsx b/client/packages/lowcoder/src/comps/comps/dataChangeResponderComp.tsx index fe57edd1e..b906a7b60 100644 --- a/client/packages/lowcoder/src/comps/comps/dataChangeResponderComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/dataChangeResponderComp.tsx @@ -21,6 +21,7 @@ import { BottomResComp, BottomResCompResult, BottomResTypeEnum } from "types/bot import { setFieldsNoTypeCheck } from "util/objectUtils"; import { QueryTutorials } from "util/tutorialUtils"; import { SimpleNameComp } from "./simpleNameComp"; +import SupaDemoDisplay from "comps/utils/supademoDisplay"; const dataChangeEvent: EventConfigType = { label: "onDataChange", @@ -71,7 +72,15 @@ const DataResponderItemCompBase = new MultiCompBuilder( <>{trans("dataResponder.documentationText")} {trans("dataResponder.docLink")} - +

+ + + + ), }, diff --git a/client/packages/lowcoder/src/comps/comps/dateComp/dateComp.tsx b/client/packages/lowcoder/src/comps/comps/dateComp/dateComp.tsx index 08f660086..1b6e6e28f 100644 --- a/client/packages/lowcoder/src/comps/comps/dateComp/dateComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/dateComp/dateComp.tsx @@ -286,6 +286,7 @@ export const dateRangeControl = (function () { const childrenMap = { start: stringExposingStateControl("start"), end: stringExposingStateControl("end"), + ...formDataChildren, ...commonChildren, }; @@ -367,6 +368,8 @@ export const dateRangeControl = (function () { tooltip: trans("date.formatTip"), })} + + {(useContext(EditorContext).editorModeStatus === "logic" || useContext(EditorContext).editorModeStatus === "both") && ( <>
@@ -572,4 +575,21 @@ DateRangeComp = withMethodExposing(DateRangeComp, [ comp.children.end.getView().reset(); }, }, + { + method: { + name: "setRange", + params: [], + }, + execute: (comp, values) => { + if (values.length !== 1) { + return Promise.reject(trans("formComp.valuesLengthError")); + } + const data = values[0] as { start: string, end: string }; + if (typeof data !== "object" || data === null || Array.isArray(data) || !data.hasOwnProperty('start') || !data.hasOwnProperty('end')) { + return Promise.reject(trans("formComp.valueTypeError")); + } + comp.children.start.getView().onChange(data.start); + comp.children.end.getView().onChange(data.end); + }, + }, ]); diff --git a/client/packages/lowcoder/src/comps/comps/dateComp/timeComp.tsx b/client/packages/lowcoder/src/comps/comps/dateComp/timeComp.tsx index 28875e798..3eda24d34 100644 --- a/client/packages/lowcoder/src/comps/comps/dateComp/timeComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/dateComp/timeComp.tsx @@ -251,6 +251,7 @@ export const timeRangeControl = (function () { const childrenMap = { start: stringExposingStateControl("start"), end: stringExposingStateControl("end"), + ...formDataChildren, ...commonChildren, }; @@ -319,6 +320,8 @@ export const timeRangeControl = (function () { tooltip: trans("time.formatTip"), })}
+ + {(useContext(EditorContext).editorModeStatus === "logic" || useContext(EditorContext).editorModeStatus === "both") && ( <>
@@ -472,4 +475,21 @@ TimeRangeComp = withMethodExposing(TimeRangeComp, [ comp.children.end.getView().reset(); }, }, + { + method: { + name: "setRange", + params: [], + }, + execute: (comp, values) => { + if (values.length !== 1) { + return Promise.reject(trans("formComp.valuesLengthError")); + } + const data = values[0] as { start: string, end: string }; + if (typeof data !== "object" || data === null || Array.isArray(data) || !data.hasOwnProperty('start') || !data.hasOwnProperty('end')) { + return Promise.reject(trans("formComp.valueTypeError")); + } + comp.children.start.getView().onChange(data.start); + comp.children.end.getView().onChange(data.end); + }, + }, ]); diff --git a/client/packages/lowcoder/src/comps/comps/formComp/formComp.tsx b/client/packages/lowcoder/src/comps/comps/formComp/formComp.tsx index 70949396c..1d2ac87bb 100644 --- a/client/packages/lowcoder/src/comps/comps/formComp/formComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/formComp/formComp.tsx @@ -321,6 +321,7 @@ let FormTmpComp = class extends FormBaseComp implements IForm { setData(data: JSONObject, initialData?: JSONObject) { // For the properties, first find in data, then initialData, subcomponent default value (resetValue), empty value (clearValue) const newData = { ...(initialData ?? this.children.initialData.getView()), ...data }; + return this.runMethodOfItems( { name: "setValue", @@ -331,8 +332,19 @@ let FormTmpComp = class extends FormBaseComp implements IForm { return value !== undefined ? [value as EvalParamType] : undefined; }, }, + { + name: "setRange", + getParams: (t) => { + // use component name when formDataKey is empty + const key = t.children.comp.children.formDataKey?.getView() || t.children.name.getView(); + const value = newData[key] ? newData[key] : undefined; + return value !== undefined ? [value as EvalParamType] : undefined; + }, + }, { name: "resetValue" }, - { name: "clearValue" } + { name: "resetAll" }, + { name: "clearValue" }, + { name: "clearAll" } ); } reset() { @@ -443,10 +455,24 @@ export const FormComp = withExposingConfigs(FormTmpComp, [ func: (input) => { const data: Record = {}; Object.entries(input.container).forEach(([name, value]) => { + const exposingValues = value as any; if (exposingValues?.hasOwnProperty("formDataKey")) { // use component name when formDataKey is empty - data[exposingValues["formDataKey"] || name] = exposingValues["value"]; + let inputValue = exposingValues['value']; + // for timeRange/dateRange we don't have value + // instead we have start and end + if ( + !inputValue + && exposingValues?.hasOwnProperty('start') + && exposingValues?.hasOwnProperty('end') + ) { + inputValue = { + start: exposingValues['start'], + end: exposingValues['end'], + } + } + data[exposingValues["formDataKey"] || name] = inputValue; } }); return data; diff --git a/client/packages/lowcoder/src/comps/comps/jsonSchemaFormComp/jsonSchemaFormComp.tsx b/client/packages/lowcoder/src/comps/comps/jsonSchemaFormComp/jsonSchemaFormComp.tsx index 4c5898e9b..57abcdc91 100644 --- a/client/packages/lowcoder/src/comps/comps/jsonSchemaFormComp/jsonSchemaFormComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/jsonSchemaFormComp/jsonSchemaFormComp.tsx @@ -239,6 +239,7 @@ let FormBasicComp = (function () {
{children.schema.propertyView({ + key: trans("jsonSchemaForm.jsonSchema"), label: ( <> {trans("jsonSchemaForm.jsonSchema") + " ("} @@ -274,6 +275,7 @@ let FormBasicComp = (function () { ), })} {children.uiSchema.propertyView({ + key: trans("jsonSchemaForm.uiSchema"), label: ( <> {trans("jsonSchemaForm.uiSchema") + " ("} @@ -311,6 +313,7 @@ let FormBasicComp = (function () { ), })} {children.data.propertyView({ + key: trans("jsonSchemaForm.defaultData"), label: trans("jsonSchemaForm.defaultData"), })}
@@ -328,13 +331,13 @@ let FormBasicComp = (function () { {(useContext(EditorContext).editorModeStatus === "layout" || useContext(EditorContext).editorModeStatus === "both") && ( <> -
- {children.style.getPropertyView()} -
-
- {children.animationStyle.getPropertyView()} +
+ {children.style.getPropertyView()} +
+
+ {children.animationStyle.getPropertyView()}
- + )} diff --git a/client/packages/lowcoder/src/comps/comps/numberInputComp/sliderCompConstants.tsx b/client/packages/lowcoder/src/comps/comps/numberInputComp/sliderCompConstants.tsx index 90e827919..771d0d73c 100644 --- a/client/packages/lowcoder/src/comps/comps/numberInputComp/sliderCompConstants.tsx +++ b/client/packages/lowcoder/src/comps/comps/numberInputComp/sliderCompConstants.tsx @@ -2,7 +2,7 @@ import { BoolCodeControl, NumberControl } from "../../controls/codeControl"; import { LabelControl } from "../../controls/labelControl"; import { withDefault } from "../../generators"; import { ChangeEventHandlerControl } from "../../controls/eventHandlerControl"; -import { Section, sectionNames } from "lowcoder-design"; +import { Section, lightenColor, sectionNames } from "lowcoder-design"; import { RecordConstructorToComp } from "lowcoder-core"; import { styleControl } from "comps/controls/styleControl"; import { AnimationStyle, InputFieldStyle, LabelStyle, SliderStyle, SliderStyleType, heightCalculator, widthCalculator } from "comps/controls/styleControlConstants"; @@ -41,6 +41,16 @@ const getStyle = (style: SliderStyleType, vertical: boolean) => { .ant-slider-handle:focus { box-shadow: 0 0 0 5px ${fadeColor(darkenColor(style.thumbBorder, 0.08), 0.12)}; } + .ant-slider-handle::after { + box-shadow: 0 0 0 2px ${lightenColor(style.thumbBorder, 0.1)}; + } + .ant-slider-handle:hover, + .ant-slider-handle:active, + .ant-slider-handle:focus { + &::after { + box-shadow: 0 0 0 5px ${style.thumbBorder}; + } + } ${vertical && css` width: auto; min-height: calc(300px - ${style.margin}); diff --git a/client/packages/lowcoder/src/comps/comps/remoteComp/remoteComp.tsx b/client/packages/lowcoder/src/comps/comps/remoteComp/remoteComp.tsx index be0f9aae2..5c4146eb0 100644 --- a/client/packages/lowcoder/src/comps/comps/remoteComp/remoteComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/remoteComp/remoteComp.tsx @@ -5,12 +5,14 @@ import { GreyTextColor } from "constants/style"; import log from "loglevel"; import { Comp, CompAction, CompParams, customAction, isCustomAction } from "lowcoder-core"; import { WhiteLoading } from "lowcoder-design"; -import { useState } from "react"; +import { useContext, useState } from "react"; import { useMount } from "react-use"; import styled from "styled-components"; import { RemoteCompInfo, RemoteCompLoader } from "types/remoteComp"; import { loaders } from "./loaders"; import { withErrorBoundary } from "comps/generators/withErrorBoundary"; +import { EditorContext } from "@lowcoder-ee/comps/editorState"; +import { CompContext } from "@lowcoder-ee/comps/utils/compContext"; const ViewError = styled.div` display: flex; @@ -45,18 +47,32 @@ interface RemoteCompReadyAction { } interface RemoteCompViewProps { - loadComp: () => Promise; + isLowcoderComp?: boolean; + loadComp: (packageVersion?: string) => Promise; loadingElement?: () => React.ReactNode; errorElement?: (error: any) => React.ReactNode; } function RemoteCompView(props: React.PropsWithChildren) { - const { loadComp, loadingElement, errorElement } = props; + const { loadComp, loadingElement, errorElement, isLowcoderComp } = props; const [error, setError] = useState(""); + const editorState = useContext(EditorContext); + const compState = useContext(CompContext); + const lowcoderCompPackageVersion = editorState?.getAppSettings().lowcoderCompVersion || 'latest'; + + let packageVersion = 'latest'; + // lowcoder-comps's package version + if (isLowcoderComp) { + packageVersion = lowcoderCompPackageVersion; + } + // component plugin's package version + else if (compState.comp?.comp?.version) { + packageVersion = compState.comp?.comp.version; + } useMount(() => { setError(""); - loadComp().catch((e) => { + loadComp(packageVersion).catch((e) => { setError(String(e)); }); }); @@ -96,7 +112,7 @@ export function remoteComp( this.compValue = params.value; } - private async load() { + private async load(packageVersion = 'latest') { if (!remoteInfo) { return; } @@ -108,7 +124,7 @@ export function remoteComp( log.error("loader not found, remote info:", remoteInfo); return; } - const RemoteExportedComp = await finalLoader(remoteInfo); + const RemoteExportedComp = await finalLoader({...remoteInfo, packageVersion}); if (!RemoteExportedComp) { return; } @@ -135,7 +151,12 @@ export function remoteComp( getView() { const key = `${remoteInfo?.packageName}-${remoteInfo?.packageVersion}-${remoteInfo?.compName}`; return ( - this.load()} loadingElement={loadingElement} /> + this.load(packageVersion)} + loadingElement={loadingElement} + /> ); } diff --git a/client/packages/lowcoder/src/comps/comps/selectInputComp/checkboxComp.tsx b/client/packages/lowcoder/src/comps/comps/selectInputComp/checkboxComp.tsx index d701256d4..0a29c71b3 100644 --- a/client/packages/lowcoder/src/comps/comps/selectInputComp/checkboxComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/selectInputComp/checkboxComp.tsx @@ -18,7 +18,7 @@ import { styleControl } from "comps/controls/styleControl"; import { AnimationStyle, CheckboxStyle, CheckboxStyleType, InputFieldStyle, LabelStyle } from "comps/controls/styleControlConstants"; import { RadioLayoutOptions, RadioPropertyView } from "./radioCompConstants"; import { dropdownControl } from "../../controls/dropdownControl"; -import { ValueFromOption } from "lowcoder-design"; +import { ValueFromOption, lightenColor } from "lowcoder-design"; import { EllipsisTextCss } from "lowcoder-design"; import { trans } from "i18n"; import { RefControl } from "comps/controls/refControl"; @@ -28,7 +28,6 @@ import { useMergeCompStyles } from "@lowcoder-ee/util/hooks"; export const getStyle = (style: CheckboxStyleType) => { return css` - &, .ant-checkbox-wrapper:not(.ant-checkbox-wrapper-disabled) { color: ${style.staticText}; max-width: calc(100% - 8px); @@ -47,7 +46,7 @@ export const getStyle = (style: CheckboxStyleType) => { border-width:${!!style.borderWidth ? style.borderWidth : '2px'}; } - .ant-checkbox-checked { + .ant-checkbox-checked:not(.ant-checkbox-disabled) { .ant-checkbox-inner { background-color: ${style.checkedBackground}; border-color: ${style.checkedBorder}; @@ -65,7 +64,7 @@ export const getStyle = (style: CheckboxStyleType) => { } } - .ant-checkbox-inner { + .ant-checkbox-inner) { background-color: ${style.uncheckedBackground}; border-radius: ${style.radius}; border-color: ${style.checkedBorder}; @@ -76,6 +75,7 @@ export const getStyle = (style: CheckboxStyleType) => { .ant-checkbox:hover .ant-checkbox-inner, .ant-checkbox-input + ant-checkbox-inner { ${style.hoverBackground && `background-color: ${style.hoverBackground}`}; + ${style.hoverBackground && `border-color: ${style.hoverBackground}`}; } @@ -86,6 +86,11 @@ export const getStyle = (style: CheckboxStyleType) => { border-color: ${style.checkedBorder}; border-width:${!!style.borderWidth ? style.borderWidth : '2px'}; } + + &:hover .ant-checkbox-checked:not(.ant-checkbox-disabled) .ant-checkbox-inner { + background-color: ${style.hoverBackground || lightenColor(style.checkedBackground, 0.1)}; + border-color: ${style.hoverBackground || lightenColor(style.checkedBackground, 0.1)}; + } } diff --git a/client/packages/lowcoder/src/comps/comps/selectInputComp/radioComp.tsx b/client/packages/lowcoder/src/comps/comps/selectInputComp/radioComp.tsx index 5c24ebe3f..112af7abe 100644 --- a/client/packages/lowcoder/src/comps/comps/selectInputComp/radioComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/selectInputComp/radioComp.tsx @@ -55,7 +55,7 @@ const getStyle = (style: RadioStyleType, inputFieldStyle?:RadioStyleType ) => { &:hover .ant-radio-inner, .ant-radio:hover .ant-radio-inner, .ant-radio-input + ant-radio-inner { - background-color:${inputFieldStyle?.hoverBackground ? inputFieldStyle?.hoverBackground:'#ffff'}; + ${inputFieldStyle?.hoverBackground && `background-color: ${style.hoverBackground}`}; } &:hover .ant-radio-inner, diff --git a/client/packages/lowcoder/src/comps/comps/selectInputComp/selectCompConstants.tsx b/client/packages/lowcoder/src/comps/comps/selectInputComp/selectCompConstants.tsx index 77066895b..db1f9f050 100644 --- a/client/packages/lowcoder/src/comps/comps/selectInputComp/selectCompConstants.tsx +++ b/client/packages/lowcoder/src/comps/comps/selectInputComp/selectCompConstants.tsx @@ -59,6 +59,7 @@ import { blurMethod, focusMethod } from "comps/utils/methodUtils"; import { useContext } from "react"; import { EditorContext } from "comps/editorState"; import { styleControl } from "comps/controls/styleControl"; +import SupaDemoDisplay from "comps/utils/supademoDisplay"; export const getStyle = ( style: @@ -115,7 +116,7 @@ export const getStyle = ( &.ant-select-focused, &:hover { .ant-select-selector { - border-color: ${style.accent}; + border-color: ${style.accent} !important; } } diff --git a/client/packages/lowcoder/src/comps/comps/switchComp.tsx b/client/packages/lowcoder/src/comps/comps/switchComp.tsx index 120d4ca25..c9b96bbb1 100644 --- a/client/packages/lowcoder/src/comps/comps/switchComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/switchComp.tsx @@ -6,7 +6,7 @@ import { LabelControl } from "comps/controls/labelControl"; import { styleControl } from "comps/controls/styleControl"; import { SwitchStyle, SwitchStyleType, LabelStyle, InputFieldStyle, AnimationStyle } from "comps/controls/styleControlConstants"; import { migrateOldData } from "comps/generators/simpleGenerators"; -import { Section, sectionNames } from "lowcoder-design"; +import { Section, lightenColor, sectionNames } from "lowcoder-design"; import styled, { css } from "styled-components"; import { UICompBuilder } from "../generators"; import { CommonNameConfig, NameConfig, withExposingConfigs } from "../generators/withExposing"; @@ -38,13 +38,16 @@ const EventOptions = [ const getStyle = (style: SwitchStyleType) => { return css` .ant-switch-handle::before { - background-color: ${style.handle}; + background: ${style.handle}; } button { background-image: none; - background-color: ${style.unchecked}; + background: ${style.unchecked}; &.ant-switch-checked { - background-color: ${style.checked}; + background: ${style.checked}; + &:hover:not(.ant-switch-disabled) { + background: ${lightenColor(style.checked, 0.2)} + } } } `; diff --git a/client/packages/lowcoder/src/comps/comps/tableComp/column/columnTypeComps/columnAvatarsComp.tsx b/client/packages/lowcoder/src/comps/comps/tableComp/column/columnTypeComps/columnAvatarsComp.tsx index 59ff4668a..0b159b08d 100644 --- a/client/packages/lowcoder/src/comps/comps/tableComp/column/columnTypeComps/columnAvatarsComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/tableComp/column/columnTypeComps/columnAvatarsComp.tsx @@ -17,7 +17,6 @@ import { optionsControl } from "comps/controls/optionsControl"; import { BoolControl } from "comps/controls/boolControl"; import { dropdownControl } from "comps/controls/dropdownControl"; import { JSONObject } from "util/jsonTypes"; -import { useMergeCompStyles } from "@lowcoder-ee/util/hooks"; const MenuLinkWrapper = styled.div` > a { @@ -89,7 +88,7 @@ export const alignOptions = [ export const ColumnAvatarsComp = (function () { const childrenMap = { - style: styleControl(avatarGroupStyle , 'style'), + style: styleControl(avatarGroupStyle), maxCount: withDefault(NumberControl, 3), avatarSize: withDefault(NumberControl, 40), alignment: dropdownControl(alignOptions, "center"), @@ -109,9 +108,6 @@ export const ColumnAvatarsComp = (function () { return new ColumnTypeCompBuilder( childrenMap, (props , dispatch) => { - - useMergeCompStyles(props, dispatch); - return ( string; @@ -152,6 +153,7 @@ export class ColumnComp extends ColumnInitComp { comp.children.cellColor.reduce( CellColorComp.changeContextDataAction({ currentCell: undefined, + currentRow: {}, }) ) ); diff --git a/client/packages/lowcoder/src/comps/comps/tableComp/column/tableColumnListComp.tsx b/client/packages/lowcoder/src/comps/comps/tableComp/column/tableColumnListComp.tsx index d186aad0a..4a3c5237b 100644 --- a/client/packages/lowcoder/src/comps/comps/tableComp/column/tableColumnListComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/tableComp/column/tableColumnListComp.tsx @@ -106,7 +106,7 @@ export class ColumnListComp extends ColumnListTmpComp { type: "dataChanged", ...param, }, - false + true ); } diff --git a/client/packages/lowcoder/src/comps/comps/tableComp/tableCompView.tsx b/client/packages/lowcoder/src/comps/comps/tableComp/tableCompView.tsx index 7911c889b..cd0e3adab 100644 --- a/client/packages/lowcoder/src/comps/comps/tableComp/tableCompView.tsx +++ b/client/packages/lowcoder/src/comps/comps/tableComp/tableCompView.tsx @@ -69,8 +69,8 @@ const getStyle = ( &, > td { background: ${genLinerGradient(rowStyle.background)}; - border-bottom:${rowStyle.borderWidth} ${rowStyle.borderStyle} ${rowStyle.border} !important; - border-right:${rowStyle.borderWidth} ${rowStyle.borderStyle} ${rowStyle.border} !important; + // border-bottom:${rowStyle.borderWidth} ${rowStyle.borderStyle} ${rowStyle.border} !important; + // border-right:${rowStyle.borderWidth} ${rowStyle.borderStyle} ${rowStyle.border} !important; } } @@ -78,8 +78,8 @@ const getStyle = ( &, > td { background: ${alternateBackground}; - border-bottom:${rowStyle.borderWidth} ${rowStyle.borderStyle} ${rowStyle.border} !important; - border-right:${rowStyle.borderWidth} ${rowStyle.borderStyle} ${rowStyle.border} !important; + // border-bottom:${rowStyle.borderWidth} ${rowStyle.borderStyle} ${rowStyle.border} !important; + // border-right:${rowStyle.borderWidth} ${rowStyle.borderStyle} ${rowStyle.border} !important; } } @@ -149,7 +149,7 @@ const BackgroundWrapper = styled.div<{ padding: ${(props) => props.$style.padding} !important; margin: ${(props) => props.$style.margin} !important; overflow: scroll !important; - border-style:${(props) => props.$style.borderStyle} !important; + border-style: ${(props) => props.$style.borderStyle} !important; border-width: ${(props) => `${props.$style.borderWidth} !important`}; ${(props) => props.$style} `; @@ -192,11 +192,14 @@ const TableWrapper = styled.div<{ } .ant-table { - background: ${(props) => props.$style.background}; + overflow-y:scroll; + background: ${(props) =>props.$style.background}; .ant-table-container { border-left: unset; border-top: none !important; border-inline-start: none !important; + overflow-y:scroll; + height:300px &::after { box-shadow: none !important; @@ -221,7 +224,7 @@ const TableWrapper = styled.div<{ border-color: ${(props) => props.$headerStyle.border}; border-width: ${(props) => props.$headerStyle.borderWidth}; color: ${(props) => props.$headerStyle.headerText}; - border-inline-end: ${(props) => `${props.$headerStyle.borderWidth} solid ${props.$headerStyle.border}`} !important; + // border-inline-end: ${(props) => `${props.$headerStyle.borderWidth} solid ${props.$headerStyle.border}`} !important; ${(props) => props.$fixedHeader && ` position: sticky; @@ -269,6 +272,7 @@ const TableWrapper = styled.div<{ td { padding: 0px 0px; + // ${(props) => props.$showHRowGridBorder ?'border-bottom: 1px solid #D7D9E0 !important;': `border-bottom: 0px;`} } thead > tr:first-child { @@ -278,7 +282,7 @@ const TableWrapper = styled.div<{ } tbody > tr > td:last-child { - border-right: unset; + border-right: unset !important; } .ant-empty-img-simple-g { @@ -531,6 +535,7 @@ function TableCellView(props: { }); const cellColor = cellColorFn({ currentCell: record[title], + currentRow: record, }); const style = { @@ -623,7 +628,7 @@ function ResizeableTable(props: CustomTableProps ({ record, - title: col.titleText, + title: String(col.dataIndex), rowColorFn: props.rowColorFn, rowHeightFn: props.rowHeightFn, cellColorFn: cellColorFn, diff --git a/client/packages/lowcoder/src/comps/comps/tableComp/tableTypes.tsx b/client/packages/lowcoder/src/comps/comps/tableComp/tableTypes.tsx index bc59934db..987f8b1ee 100644 --- a/client/packages/lowcoder/src/comps/comps/tableComp/tableTypes.tsx +++ b/client/packages/lowcoder/src/comps/comps/tableComp/tableTypes.tsx @@ -192,8 +192,8 @@ export type RowHeightViewType = (param: { const tableChildrenMap = { // hideBordered: BoolControl, showHeaderGridBorder: BoolControl, - showRowGridBorder: BoolControl, - showHRowGridBorder: BoolControl, + showRowGridBorder: withDefault(BoolControl,true), + showHRowGridBorder: withDefault(BoolControl,true), hideHeader: BoolControl, fixedHeader: BoolControl, autoHeight: withDefault(AutoHeightControl, "auto"), diff --git a/client/packages/lowcoder/src/comps/comps/temporaryStateComp.tsx b/client/packages/lowcoder/src/comps/comps/temporaryStateComp.tsx index e8bd0fdbe..4ff27d198 100644 --- a/client/packages/lowcoder/src/comps/comps/temporaryStateComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/temporaryStateComp.tsx @@ -8,13 +8,13 @@ import { trans } from "i18n"; import _ from "lodash"; import { DocLink } from "lowcoder-design"; import { BottomTabs } from "pages/editor/bottom/BottomTabs"; -import { ReactNode } from "react"; +import { ReactNode, useState } from "react"; import { BottomResComp, BottomResCompResult, BottomResTypeEnum } from "types/bottomRes"; import { JSONObject } from "util/jsonTypes"; import { QueryTutorials } from "util/tutorialUtils"; import { SimpleNameComp } from "./simpleNameComp"; import { markdownCompCss, TacoMarkDown } from "lowcoder-design"; -import { evalAndReduce } from "../utils"; +import SupaDemoDisplay from "comps/utils/supademoDisplay"; const TemporaryStateItemCompBase = new MultiCompBuilder( { @@ -24,29 +24,51 @@ const TemporaryStateItemCompBase = new MultiCompBuilder( () => null ) .setPropertyViewFn((children) => { - return ( -
{trans("temporaryState.documentationText")}
- {trans("temporaryState.docLink")} - - ), - }), - }, - ]} - tabTitle={children.name.getView()} - status="" - /> - ); + const PropertyViewWithModal = () => { + const [isOpen, setIsOpen] = useState(false); + + const handleOpen = () => { + setIsOpen(true); + }; + + const handleClose = () => { + setIsOpen(false); + }; + + return ( +
{trans("temporaryState.documentationText")}
+ {trans("temporaryState.docLink")} +

+ + + + + ), + }), + }, + ]} + tabTitle={children.name.getView()} + status="" + /> + ); + }; + + return ; }) .build(); diff --git a/client/packages/lowcoder/src/comps/comps/transformerListComp.tsx b/client/packages/lowcoder/src/comps/comps/transformerListComp.tsx index c409edd75..0bed05a86 100644 --- a/client/packages/lowcoder/src/comps/comps/transformerListComp.tsx +++ b/client/packages/lowcoder/src/comps/comps/transformerListComp.tsx @@ -13,6 +13,7 @@ import { BottomResComp, BottomResCompResult, BottomResTypeEnum } from "types/bot import { QueryTutorials } from "util/tutorialUtils"; import { SimpleNameComp } from "./simpleNameComp"; import { markdownCompCss, TacoMarkDown } from "lowcoder-design"; +import SupaDemoDisplay from "comps/utils/supademoDisplay"; const TransformerItemCompBase = new MultiCompBuilder( { @@ -44,7 +45,15 @@ const TransformerItemCompBase = new MultiCompBuilder( <>
{trans("transformer.documentationText")} {trans("transformer.docLink")} - +

+ + + + )} ), diff --git a/client/packages/lowcoder/src/comps/controls/actionSelector/goToURLAction.tsx b/client/packages/lowcoder/src/comps/controls/actionSelector/goToURLAction.tsx index aab608c6c..462cd6213 100644 --- a/client/packages/lowcoder/src/comps/controls/actionSelector/goToURLAction.tsx +++ b/client/packages/lowcoder/src/comps/controls/actionSelector/goToURLAction.tsx @@ -1,35 +1,65 @@ -import { StringControl } from "comps/controls/codeControl"; -import { BoolControl } from "comps/controls/boolControl"; import { MultiCompBuilder } from "comps/generators/multi"; +import { withDefault } from "comps/generators/simpleGenerators"; import { BranchDiv } from "lowcoder-design"; +import { KeyValue } from "types/common"; +import { BoolControl } from "comps/controls/boolControl"; +import { StringControl } from "comps/controls/codeControl"; +import { keyValueListControl } from "../keyValueControl"; +import { keyValueListToSearchStr } from "../../../util/appUtils"; import { trans } from "i18n"; -export const GoToURLAction = (function () { - const childrenMap = { - url: StringControl, - inNewTab: BoolControl, +const childrenMap = { + url: StringControl, + query: withDefault(keyValueListControl(false, [], "string"), [ + { key: "", value: "" }, + ]), + hash: withDefault(keyValueListControl(false, [], "string"), [ + { key: "", value: "" }, + ]), + inNewTab: BoolControl, +}; + +export const GoToURLAction = new MultiCompBuilder(childrenMap, (props) => { + return () => { + const queryParams = keyValueListToSearchStr( + props.query.map((i) => i.getView() as KeyValue) + ); + const hashParams = keyValueListToSearchStr( + props.hash.map((i) => i.getView() as KeyValue) + ); + const urlWithParams = `${props.url}${queryParams ? `?${queryParams}` : ""}${hashParams ? `#${hashParams}` : ""}`; + + window.open(urlWithParams, props.inNewTab ? "_blank" : "_self"); }; - return new MultiCompBuilder(childrenMap, (props) => { - return () => { - window.open(props.url, props.inNewTab ? "_blank" : "_self"); - }; +}) + .setPropertyViewFn((children) => { + return ( + <> + + {children.url.propertyView({ + label: "URL", + layout: "vertical", + })} + + + {children.query.propertyView({ + label: trans("eventHandler.queryParams"), + layout: "vertical", + })} + + + {children.hash.propertyView({ + label: trans("eventHandler.hashParams"), + layout: "vertical", + })} + + + {children.inNewTab.propertyView({ + label: trans("eventHandler.openInNewTab"), + layout: "vertical", + })} + + + ); }) - .setPropertyViewFn((children) => { - return ( - <> - - {children.url.propertyView({ - label: "URL", - layout: "vertical", - })} - - - {children.inNewTab.propertyView({ - label: trans("eventHandler.openInNewTab"), - })} - - - ); - }) - .build(); -})(); + .build(); diff --git a/client/packages/lowcoder/src/comps/controls/codeControl.tsx b/client/packages/lowcoder/src/comps/controls/codeControl.tsx index 506da2543..33103f911 100644 --- a/client/packages/lowcoder/src/comps/controls/codeControl.tsx +++ b/client/packages/lowcoder/src/comps/controls/codeControl.tsx @@ -100,18 +100,18 @@ export function codeControl< this._exposingNode = withFunction(this._node, (x) => x.value); // make sure handleChange's reference only changes when the instance changes, avoid CodeEditor frequent reconfigure - this.handleChange = debounce((state: EditorState) => { + this.handleChange = (state: EditorState) => { this.dispatchChangeValueAction(state.doc.toString()); - }, 50); + }; } override changeDispatch(dispatch: DispatchType) { // need to re-bind handleChange when dispatch changes, otherwise old instance's dispatch is still in use const comp = setFieldsNoTypeCheck(this, { dispatch, - handleChange: debounce((state: EditorState) => { + handleChange: (state: EditorState) => { comp.dispatchChangeValueAction(state.doc.toString()); - }, 50), + }, }); return comp; } diff --git a/client/packages/lowcoder/src/comps/controls/labelControl.tsx b/client/packages/lowcoder/src/comps/controls/labelControl.tsx index 1217631aa..07a5c9ef5 100644 --- a/client/packages/lowcoder/src/comps/controls/labelControl.tsx +++ b/client/packages/lowcoder/src/comps/controls/labelControl.tsx @@ -9,7 +9,7 @@ import { MultiCompBuilder } from "comps/generators/multi"; import { labelCss, Section, Tooltip, UnderlineCss } from "lowcoder-design"; import { ValueFromOption } from "lowcoder-design"; import { isEmpty } from "lodash"; -import { Fragment, ReactNode } from "react"; +import { Fragment, ReactElement, ReactNode } from "react"; import styled, { css } from "styled-components"; import { AlignLeft } from "lowcoder-design"; import { AlignRight } from "lowcoder-design"; @@ -237,7 +237,7 @@ export const LabelControl = (function () { - {args.help && ( + {args.help && Boolean((args.children as ReactElement)?.props.value) && ( >( theme?: ThemeDetail, bgColor?: string, compTheme?: Record, + compType?: string, + styleKey?: string, ) { // let themeWithDefault = (theme || defaultTheme) as unknown as Record; let themeWithDefault = { @@ -363,6 +366,10 @@ function calcColors>( ...(theme || {}), ...(compTheme || {}), } as unknown as Record; + if (compType && styleKey && inputFieldComps.includes(compType) && styleKey !== 'inputFieldStyle') { + const style = theme?.components?.[compType]?.[styleKey] as Record; + themeWithDefault['borderWidth'] = style?.['borderWidth'] || '0px'; + } // Cover what is not there for the first pass let res: Record = {}; @@ -873,15 +880,19 @@ export function styleControl( const { appliedThemeId, preventStyleOverwriting } = comp?.comp?.container || comp?.comp || {}; const appTheme = isPreviewTheme || isDefaultTheme || (!preventStyleOverwriting && !preventAppStylesOverwriting) ? theme?.theme - : undefined; + : defaultTheme; const compTheme = isPreviewTheme || isDefaultTheme || (compType && !preventStyleOverwriting && !preventAppStylesOverwriting) ? { - ...( - theme?.theme?.components?.[compType]?.[styleKey] - || defaultTheme.components?.[compType]?.[styleKey] - ) as unknown as Record + ...(omit(defaultTheme, 'components', 'chart')), + ...defaultTheme.components?.[compType]?.[styleKey] as unknown as Record, + ...(omit(theme?.theme, 'components', 'chart')), + ...theme?.theme?.components?.[compType]?.[styleKey] as unknown as Record, + // ...( + // theme?.theme?.components?.[compType]?.[styleKey] + // // || defaultTheme.components?.[compType]?.[styleKey] + // ) as unknown as Record } - : undefined; + : defaultTheme.components?.[compType]?.[styleKey]; const styleProps = (!comp && !compType) || preventStyleOverwriting || preventAppStylesOverwriting || appliedThemeId === themeId ? props as ColorMap : {} as ColorMap; @@ -892,6 +903,8 @@ export function styleControl( appTheme, bgColor, compTheme as Record | undefined, + compType, + styleKey, ); } ) diff --git a/client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx b/client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx index 0fd7310ac..4cadf8483 100644 --- a/client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx +++ b/client/packages/lowcoder/src/comps/controls/styleControlConstants.tsx @@ -540,11 +540,11 @@ const TEXT_WEIGHT = { textWeight: "textWeight", } as const; -const HOVER_BACKGROUND_COLOR = { +const CHECKBOX_HOVER_BACKGROUND_COLOR = { name: "hoverBackground", label: trans("style.hoverBackground"), hoverBackground: "hoverBackground", - color: SECOND_SURFACE_COLOR, + // color: SECOND_SURFACE_COLOR, } const FONT_FAMILY = { @@ -1297,13 +1297,15 @@ export const CheckboxStyle = [ ]).filter((style) => style.name !== "border"), ...checkAndUncheck(), { - name: "checked", + name: "checkedBorder", label: trans("style.checked"), depName: "checkedBackground", - depType: DEP_TYPE.CONTRAST_TEXT, - transformer: contrastText, + // depType: DEP_TYPE.CONTRAST_TEXT, + // transformer: contrastText, + depType: DEP_TYPE.SELF, + transformer: toSelf, }, - HOVER_BACKGROUND_COLOR, + CHECKBOX_HOVER_BACKGROUND_COLOR, ] as const; export const RadioStyle = [ @@ -1313,13 +1315,13 @@ export const RadioStyle = [ ]).filter((style) => style.name !== "border" && style.name !== "radius"), ...checkAndUncheck(), { - name: "checked", + name: "checkedBorder", label: trans("style.checked"), depName: "checkedBackground", depType: DEP_TYPE.CONTRAST_TEXT, transformer: toSelf, }, - HOVER_BACKGROUND_COLOR, + CHECKBOX_HOVER_BACKGROUND_COLOR, ] as const; export const SegmentStyle = [ diff --git a/client/packages/lowcoder/src/comps/generators/uiCompBuilder.tsx b/client/packages/lowcoder/src/comps/generators/uiCompBuilder.tsx index 559f93945..79eea9d4e 100644 --- a/client/packages/lowcoder/src/comps/generators/uiCompBuilder.tsx +++ b/client/packages/lowcoder/src/comps/generators/uiCompBuilder.tsx @@ -1,5 +1,5 @@ import { BoolCodeControl, StringControl } from "comps/controls/codeControl"; -import React, { ReactNode, useContext, useRef } from "react"; +import React, { ReactNode, useContext, useEffect, useRef, useState } from "react"; import { ExternalEditorContext } from "util/context/ExternalEditorContext"; import { Comp, CompParams, MultiBaseComp } from "lowcoder-core"; import { @@ -22,10 +22,17 @@ import { MethodConfigsType, withMethodExposing, } from "./withMethodExposing"; -import { Section } from "lowcoder-design"; +import {Section, controlItem } from "lowcoder-design"; import { trans } from "i18n"; import { BoolControl } from "../controls/boolControl"; import { valueComp, withDefault } from "./simpleGenerators"; +import { getPromiseAfterDispatch } from "@lowcoder-ee/util/promiseUtils"; +import { EditorContext } from "../editorState"; +import { values } from "lodash"; +import { UICompType, uiCompRegistry } from "../uiCompRegistry"; +import { getNpmPackageMeta } from "../utils/remote"; +import { compPluginsList } from "constants/compPluginConstants"; +import Select from "antd/es/select"; export type NewChildren>> = ChildrenCompMap & { @@ -33,6 +40,7 @@ export type NewChildren>> = className: InstanceType; dataTestId: InstanceType; preventStyleOverwriting: InstanceType; + version: InstanceType; }; export function HidableView(props: { @@ -64,6 +72,28 @@ export function ExtendedPropertyView< childrenMap: NewChildren } ) { + const [compVersions, setCompVersions] = useState(['latest']); + const [compName, setCompName] = useState(''); + const editorState = useContext(EditorContext); + const selectedComp = values(editorState?.selectedComps())[0]; + const compType = selectedComp?.children?.compType?.getView() as UICompType; + + useEffect(() => { + setCompName(uiCompRegistry[compType]?.compName || ''); + }, [compType]); + + useEffect(() => { + const fetchCompsPackageMeta = async () => { + const packageMeta = await getNpmPackageMeta(compName); + if (packageMeta?.versions) { + setCompVersions(Object.keys(packageMeta.versions).reverse()) + } + } + if (Boolean(compName) && compPluginsList.includes(compName)) { + fetchCompsPackageMeta(); + } + }, [compName]); + return ( <> {props.children} @@ -72,6 +102,30 @@ export function ExtendedPropertyView< {props.childrenMap.dataTestId?.propertyView({ label: trans("prop.dataTestId") })} {props.childrenMap.preventStyleOverwriting?.propertyView({ label: trans("prop.preventOverwriting") })}
+ {compPluginsList.includes(compName) && ( +
+ {controlItem({}, ( +