diff --git a/app/client/src/components/designSystems/syncfusion/TableComponent.tsx b/app/client/src/components/designSystems/syncfusion/TableComponent.tsx index 6c9f0472be..a66fa583b8 100644 --- a/app/client/src/components/designSystems/syncfusion/TableComponent.tsx +++ b/app/client/src/components/designSystems/syncfusion/TableComponent.tsx @@ -45,7 +45,6 @@ const settings: SelectionSettingsModel = { type GridRef = MutableRefObject; function reCalculatePageSize(grid: GridRef, height: number) { - console.log(""); if (grid.current) { const rowHeight: number = grid.current.getRowHeight(); /** Grid height */ diff --git a/app/client/src/components/editorComponents/DraggableComponent.tsx b/app/client/src/components/editorComponents/DraggableComponent.tsx index 1dc92abccb..2d89963ff9 100644 --- a/app/client/src/components/editorComponents/DraggableComponent.tsx +++ b/app/client/src/components/editorComponents/DraggableComponent.tsx @@ -7,7 +7,10 @@ import blankImage from "assets/images/blank.png"; import { EditorContext } from "components/editorComponents/EditorContextProvider"; import { ControlIcons } from "icons/ControlIcons"; import { Tooltip } from "@blueprintjs/core"; -import { WIDGET_CLASSNAME_PREFIX } from "constants/WidgetConstants"; +import { + WIDGET_CLASSNAME_PREFIX, + WidgetTypes, +} from "constants/WidgetConstants"; import { useSelector } from "react-redux"; import { PropertyPaneReduxState } from "reducers/uiReducers/propertyPaneReducer"; import { AppState } from "reducers"; @@ -46,6 +49,15 @@ const WidgetBoundaries = styled.div` pointer-events: none; `; +const ClickCaptureMask = styled.div` + position: absolute; + left: 0; + top: 5%; + width: 100%; + height: 95%; + z-index: 2; +`; + const DragHandle = styled.div` position: absolute; left: 0px; @@ -139,7 +151,11 @@ const DraggableComponent = (props: DraggableComponentProps) => { }; const togglePropertyEditor = (e: any) => { - if (!propertyPaneState.isVisible) { + if ( + (!propertyPaneState.isVisible && + props.widgetId === propertyPaneState.widgetId) || + props.widgetId !== propertyPaneState.widgetId + ) { showPropertyPane && showPropertyPane(props.widgetId); } else { showPropertyPane && showPropertyPane(); @@ -196,15 +212,6 @@ const DraggableComponent = (props: DraggableComponentProps) => { }} onClick={(e: any) => { selectWidget && selectWidget(props.widgetId); - if ( - propertyPaneState.widgetId && - propertyPaneState.widgetId !== props.widgetId - ) { - showPropertyPane && showPropertyPane(); - } - e.stopPropagation(); - }} - onDoubleClick={(e: any) => { showPropertyPane && showPropertyPane(props.widgetId); e.stopPropagation(); }} @@ -226,6 +233,18 @@ const DraggableComponent = (props: DraggableComponentProps) => { zIndex: stackingContext, }} > + {selectedWidget !== props.widgetId && + props.type !== WidgetTypes.CONTAINER_WIDGET && ( + { + selectWidget && selectWidget(props.widgetId); + showPropertyPane && showPropertyPane(props.widgetId); + e.preventDefault(); + e.stopPropagation(); + }} + /> + )} + {props.children} diff --git a/app/client/src/components/propertyControls/ColumnActionSelectorControl.tsx b/app/client/src/components/propertyControls/ColumnActionSelectorControl.tsx index 70413fc96b..373ecac7c2 100644 --- a/app/client/src/components/propertyControls/ColumnActionSelectorControl.tsx +++ b/app/client/src/components/propertyControls/ColumnActionSelectorControl.tsx @@ -9,7 +9,7 @@ import { connect } from "react-redux"; import { ActionPayload } from "constants/ActionConstants"; import { FinalActionSelector } from "./ActionSelectorControl"; import { generateReactKey } from "utils/generators"; -import styled, { theme } from "constants/DefaultTheme"; +import styled from "constants/DefaultTheme"; import { AnyStyledComponent } from "styled-components"; import { FormIcons } from "icons/FormIcons"; export interface ColumnAction { diff --git a/app/client/src/index.css b/app/client/src/index.css index 9d6998e2d9..ef28b7fe25 100755 --- a/app/client/src/index.css +++ b/app/client/src/index.css @@ -49,7 +49,7 @@ div.bp3-popover-arrow { } .bp3-button.bp3-loading{ - cursor: wait !important; + cursor: default !important; } .pace {