diff --git a/app/client/src/actions/widgetActions.tsx b/app/client/src/actions/widgetActions.tsx index 49643f6b7c..fe8cab6a70 100644 --- a/app/client/src/actions/widgetActions.tsx +++ b/app/client/src/actions/widgetActions.tsx @@ -34,12 +34,12 @@ export const executePageLoadActions = ( }); export const disableDragAction = ( - disable: boolean, -): ReduxAction<{ disable: boolean }> => { + isDraggingDisabled: boolean, +): ReduxAction<{ isDraggingDisabled: boolean }> => { return { type: ReduxActionTypes.DISABLE_WIDGET_DRAG, payload: { - disable, + isDraggingDisabled, }, }; }; diff --git a/app/client/src/components/designSystems/appsmith/ChartComponent.tsx b/app/client/src/components/designSystems/appsmith/ChartComponent.tsx index f67c644b7d..d1b4eb2a56 100644 --- a/app/client/src/components/designSystems/appsmith/ChartComponent.tsx +++ b/app/client/src/components/designSystems/appsmith/ChartComponent.tsx @@ -70,13 +70,24 @@ class ChartComponent extends React.Component { } }; - getChartData = (chartData: ChartData[]) => { + getChartData = () => { + const chartData: ChartData[] = this.props.chartData; + if (chartData.length === 0) { + return [ + { + label: "", + value: "", + }, + ]; + } const data: ChartDataPoint[] = chartData[0].data; if (data.length === 0) { - return { - label: "", - value: "", - }; + return [ + { + label: "", + value: "", + }, + ]; } return data.map(item => { return { @@ -162,12 +173,12 @@ class ChartComponent extends React.Component { getChartDataSource = () => { if ( - this.props.chartData.length === 1 || + this.props.chartData.length <= 1 || this.props.chartType === "PIE_CHART" ) { return { chart: this.getChartConfig(), - data: this.getChartData(this.props.chartData), + data: this.getChartData(), }; } else { return { diff --git a/app/client/src/components/designSystems/appsmith/DraggableListComponent.tsx b/app/client/src/components/designSystems/appsmith/DraggableListComponent.tsx index 2a3036bcc5..3c018fa55b 100644 --- a/app/client/src/components/designSystems/appsmith/DraggableListComponent.tsx +++ b/app/client/src/components/designSystems/appsmith/DraggableListComponent.tsx @@ -1,15 +1,16 @@ import React from "react"; -import { ControlWrapper } from "../../propertyControls/StyledControls"; import styled from "constants/DefaultTheme"; -import { Droppable, Draggable } from "react-beautiful-dnd"; +import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd"; -const StyledListWrapper = styled(ControlWrapper)` - display: flex; - justify-content: flex-start; +const ItemWrapper = styled.div` padding-right: 16px; margin: 8px 0 0 0; `; +const DroppableWrapper = styled.div` + width: 250px; +`; + type RenderComponentProps = { index: number; item: { @@ -19,73 +20,100 @@ type RenderComponentProps = { updateOption: (index: number, value: string) => void; }; -type DraggableComponentProps = { - index: number; - draggableId: string; - item: { - label: string; - }; - deleteOption: (index: number) => void; - updateOption: (index: number, value: string) => void; - renderComponent: (props: RenderComponentProps) => JSX.Element; -}; - -export const DraggableComponent = (props: DraggableComponentProps) => { - const { - deleteOption, - updateOption, - item, - index, - draggableId, - renderComponent, - } = props; - return ( - - {({ innerRef, draggableProps, dragHandleProps }) => ( - } - style={{ - ...draggableProps.style, - userSelect: "none", - position: "static", - }} - > - {renderComponent({ deleteOption, updateOption, item, index })} - - )} - - ); -}; - -type DroppableComponentProps = { +interface DroppableComponentProps { items: object[]; renderComponent: (props: RenderComponentProps) => JSX.Element; deleteOption: (index: number) => void; updateOption: (index: number, value: string) => void; -}; + updateItems: (items: object[]) => void; +} -export const DroppableComponent = (props: DroppableComponentProps) => { - const { items } = props; - return ( - - {({ innerRef, droppableProps, placeholder }) => ( -
} {...droppableProps}> - {items.map((item: { id: string } & any, index: number) => { - return ( - - ); - })} -
- )} - - ); -}; +interface DroppableComponentState { + items: object[]; +} + +export class DroppableComponent extends React.Component< + DroppableComponentProps, + DroppableComponentState +> { + constructor(props: DroppableComponentProps) { + super(props); + this.state = { + items: props.items, + }; + } + + onDragEnd = (result: any) => { + const { destination, source } = result; + if (!destination) { + return; + } + if ( + destination.droppableId === source.droppableId && + destination.index === source.index + ) { + return; + } + const tabs: object[] = this.state.items; + const sourceTab = tabs[source.index]; + const destinationTab = tabs[destination.index]; + const updatedTabs = tabs.map((tab, index) => { + if (index === source.index) { + return destinationTab; + } else if (index === destination.index) { + return sourceTab; + } + return tab; + }); + this.setState({ items: updatedTabs }); + this.props.updateItems(updatedTabs); + }; + + render() { + const { renderComponent, deleteOption, updateOption } = this.props; + return ( + + + {({ innerRef, droppableProps, placeholder }) => ( + } + {...droppableProps} + > + {this.state.items.map( + (item: { id: string } & any, index: number) => { + return ( + + {({ innerRef, draggableProps, dragHandleProps }) => ( + } + {...draggableProps} + {...dragHandleProps} + style={{ + ...draggableProps.style, + userSelect: "none", + position: "static", + }} + > + {renderComponent({ + deleteOption, + updateOption, + item, + index, + })} + + )} + + ); + }, + )} + + )} + + + ); + } +} diff --git a/app/client/src/components/designSystems/appsmith/MapComponent.tsx b/app/client/src/components/designSystems/appsmith/MapComponent.tsx index aec7747898..8b2c2fff75 100644 --- a/app/client/src/components/designSystems/appsmith/MapComponent.tsx +++ b/app/client/src/components/designSystems/appsmith/MapComponent.tsx @@ -20,7 +20,7 @@ interface MapComponentProps { allowZoom: boolean; center: { lat: number; - lng: number; + long: number; }; markers?: Array; selectedMarker?: { @@ -29,12 +29,23 @@ interface MapComponentProps { title?: string; }; enableCreateMarker: boolean; - updateCenter: (lat: number, lng: number) => void; - updateMarker: (lat: number, lng: number, index: number) => void; - saveMarker: (lat: number, lng: number) => void; - selectMarker: (lat: number, lng: number, title: string) => void; + updateCenter: (lat: number, long: number) => void; + updateMarker: (lat: number, long: number, index: number) => void; + saveMarker: (lat: number, long: number) => void; + selectMarker: (lat: number, long: number, title: string) => void; + disableDrag: (e: any) => void; } +const MapWrapper = styled.div` + position: relative; + width: 100%; + height: 100%; +`; + +const MapContainerWrapper = styled.div` + width: 100%; +`; + const StyledInput = styled.input` box-sizing: border-box; border: 1px solid transparent; @@ -78,7 +89,7 @@ const MyMapComponent = withScriptjs( streetViewControl: false, }} zoom={props.zoom} - center={props.center} + center={{ ...props.center, lng: props.center.long }} onClick={e => { if (props.enableCreateMarker) { props.saveMarker(e.latLng.lat(), e.latLng.lng()); @@ -98,15 +109,15 @@ const MyMapComponent = withScriptjs( { - props.selectMarker(marker.lat, marker.lng, marker.title); + props.selectMarker(marker.lat, marker.long, marker.title); }} onDragEnd={de => { props.updateMarker(de.latLng.lat(), de.latLng.lng(), index); @@ -147,8 +158,8 @@ class MapComponent extends React.Component { ) { const location = places[0].geometry.location; const lat = location.lat(); - const lng = location.lng(); - this.props.updateCenter(lat, lng); + const long = location.lng(); + this.props.updateCenter(lat, long); } } }; @@ -157,9 +168,9 @@ class MapComponent extends React.Component { if ("geolocation" in navigator) { return navigator.geolocation.getCurrentPosition(data => { const { - coords: { latitude: lat, longitude: lng }, + coords: { latitude: lat, longitude: long }, } = data; - this.props.saveMarker(lat, lng); + this.props.updateCenter(lat, long); }); } }; @@ -167,17 +178,19 @@ class MapComponent extends React.Component { render() { const zoom = Math.floor(this.props.zoomLevel / 5); return ( - } - containerElement={
} - mapElement={
} - {...this.props} - zoom={zoom} - onPlacesChanged={this.onPlacesChanged} - onSearchBoxMounted={this.onSearchBoxMounted} - getUserLocation={this.getUserLocation} - /> + + } + containerElement={} + mapElement={} + {...this.props} + zoom={zoom} + onPlacesChanged={this.onPlacesChanged} + onSearchBoxMounted={this.onSearchBoxMounted} + getUserLocation={this.getUserLocation} + /> + ); } } diff --git a/app/client/src/components/editorComponents/DraggableComponent.tsx b/app/client/src/components/editorComponents/DraggableComponent.tsx index 4581aeddb8..0f5a4ea9fc 100644 --- a/app/client/src/components/editorComponents/DraggableComponent.tsx +++ b/app/client/src/components/editorComponents/DraggableComponent.tsx @@ -87,7 +87,6 @@ const DraggableComponent = (props: DraggableComponentProps) => { const isDraggingDisabled: boolean = useSelector( (state: AppState) => state.ui.widgetDragResize.isDraggingDisabled, ); - // If this widget has not been selected, and the props tell us to // disable the default click on the wiget; // We add a mask on the widget and stop "first" click event from propagating to the diff --git a/app/client/src/components/propertyControls/ChartDataControl.tsx b/app/client/src/components/propertyControls/ChartDataControl.tsx index 355b5e4a08..756bdbf64f 100644 --- a/app/client/src/components/propertyControls/ChartDataControl.tsx +++ b/app/client/src/components/propertyControls/ChartDataControl.tsx @@ -62,10 +62,7 @@ type RenderComponentProps = { index: number; item: { seriesName: string; - data: Array<{ - x: string; - y: string; - }>; + data: Array<{ x: string; y: string }> | any; }; length: number; deleteOption: Function; @@ -126,10 +123,7 @@ class ChartDataControl extends BaseControl { render() { const chartData: Array<{ seriesName: string; - data: Array<{ - x: string; - y: string; - }>; + data: Array<{ x: string; y: string }> | any; }> = this.props.propertyValue || []; const dataLength = chartData.length; return ( @@ -170,10 +164,7 @@ class ChartDataControl extends BaseControl { ) => { const chartData: Array<{ seriesName: string; - data: Array<{ - x: string; - y: string; - }>; + data: Array<{ x: string; y: string }> | any; }> = this.props.propertyValue; this.updateProperty( this.props.propertyName, @@ -182,7 +173,11 @@ class ChartDataControl extends BaseControl { if (propertyName === "seriesName") { item.seriesName = updatedValue; } else { - item.data = JSON.parse(updatedValue); + try { + item.data = JSON.parse(updatedValue); + } catch (err) { + item.data = updatedValue; + } } } return item; @@ -193,10 +188,7 @@ class ChartDataControl extends BaseControl { addOption = () => { const chartData: Array<{ seriesName: string; - data: Array<{ - x: string; - y: string; - }>; + data: Array<{ x: string; y: string }> | any; }> = this.props.propertyValue ? this.props.propertyValue.slice() : []; chartData.push({ seriesName: "", data: [{ x: "", y: "" }] }); this.updateProperty(this.props.propertyName, chartData); diff --git a/app/client/src/components/propertyControls/DatePickerControl.tsx b/app/client/src/components/propertyControls/DatePickerControl.tsx index 46c4bce0fa..25862437f3 100644 --- a/app/client/src/components/propertyControls/DatePickerControl.tsx +++ b/app/client/src/components/propertyControls/DatePickerControl.tsx @@ -32,7 +32,16 @@ const DatePickerControlWrapper = styled.div` } `; -class DatePickerControl extends BaseControl { +class DatePickerControl extends BaseControl< + DatePickerControlProps, + DatePickerControlState +> { + constructor(props: DatePickerControlProps) { + super(props); + this.state = { + selectedDate: props.propertyValue, + }; + } render() { const now = moment(); const year = now.get("year"); @@ -61,6 +70,7 @@ class DatePickerControl extends BaseControl { } onDateSelected = (date: Date): void => { + this.setState({ selectedDate: moment(date).toISOString(true) }); this.updateProperty( this.props.propertyName, moment(date).toISOString(true), @@ -85,4 +95,8 @@ export interface DatePickerControlProps extends ControlProps { propertyValue: string; } +interface DatePickerControlState { + selectedDate: string; +} + export default DatePickerControl; diff --git a/app/client/src/components/propertyControls/LocationSearchControl.tsx b/app/client/src/components/propertyControls/LocationSearchControl.tsx index dbeb2f85d5..f612e4595d 100644 --- a/app/client/src/components/propertyControls/LocationSearchControl.tsx +++ b/app/client/src/components/propertyControls/LocationSearchControl.tsx @@ -72,8 +72,8 @@ class LocationSearchControl extends BaseControl { ) => { const location = places[0].geometry.location; const lat = location.lat(); - const lng = location.lng(); - const value = { lat, lng }; + const long = location.lng(); + const value = { lat, long }; this.updateProperty(this.props.propertyName, value); }; render() { diff --git a/app/client/src/components/propertyControls/TabControl.tsx b/app/client/src/components/propertyControls/TabControl.tsx index 9119d90f33..98b6594c6d 100644 --- a/app/client/src/components/propertyControls/TabControl.tsx +++ b/app/client/src/components/propertyControls/TabControl.tsx @@ -5,7 +5,6 @@ import styled from "constants/DefaultTheme"; import { FormIcons } from "icons/FormIcons"; import { ControlIcons } from "icons/ControlIcons"; import { AnyStyledComponent } from "styled-components"; -import { DragDropContext } from "react-beautiful-dnd"; import { generateReactKey } from "utils/generators"; import { DroppableComponent } from "../designSystems/appsmith/DraggableListComponent"; @@ -37,6 +36,17 @@ const StyledPropertyPaneButtonWrapper = styled.div` margin-top: 10px; `; +const ItemWrapper = styled.div` + display: flex; + justify-content: flex-start; +`; + +const TabsWrapper = styled.div` + width: 100%; + display: flex; + flex-direction: column; +`; + const StyledOptionControlInputGroup = styled(StyledInputGroup)` margin-right: 2px; &&& { @@ -65,7 +75,7 @@ type RenderComponentProps = { function TabControlComponent(props: RenderComponentProps) { const { deleteOption, updateOption, item, index } = props; return ( - + - + ); } class TabControl extends BaseControl { - onDragEnd = (result: any) => { - const { destination, source } = result; - if (!destination) { - return; - } - if ( - destination.droppableId === source.droppableId && - destination.index === source.index - ) { - return; - } - const tabs: string[] = this.props.propertyValue || [""]; - const sourceTab = tabs[source.index]; - const destinationTab = tabs[destination.index]; - this.updateProperty( - this.props.propertyName, - tabs.map((tab, index) => { - if (index === source.index) { - return destinationTab; - } else if (index === destination.index) { - return sourceTab; - } - return tab; - }), - ); + updateItems = (items: object[]) => { + this.updateProperty(this.props.propertyName, items); }; render() { @@ -120,12 +107,13 @@ class TabControl extends BaseControl { label: string; }> = this.props.propertyValue || [{ id: "" }]; return ( - + { onClick={this.addOption} /> - + ); } diff --git a/app/client/src/mockResponses/PropertyPaneConfigResponse.tsx b/app/client/src/mockResponses/PropertyPaneConfigResponse.tsx index a95964b4c5..57fff10772 100644 --- a/app/client/src/mockResponses/PropertyPaneConfigResponse.tsx +++ b/app/client/src/mockResponses/PropertyPaneConfigResponse.tsx @@ -1206,12 +1206,6 @@ const PropertyPaneConfigResponse = { controlType: "INPUT_TEXT", inputType: "ARRAY", }, - { - id: "25.5", - propertyName: "enableCreateMarker", - label: "Create new marker", - controlType: "SWITCH", - }, ], }, { diff --git a/app/client/src/mockResponses/WidgetConfigResponse.tsx b/app/client/src/mockResponses/WidgetConfigResponse.tsx index 0aa9804847..223960bc57 100644 --- a/app/client/src/mockResponses/WidgetConfigResponse.tsx +++ b/app/client/src/mockResponses/WidgetConfigResponse.tsx @@ -436,12 +436,11 @@ const WidgetConfigResponse: WidgetConfigReducerState = { isVisible: true, widgetName: "Map", enableSearch: true, - enableCreateMarker: true, zoomLevel: 50, enablePickLocation: true, allowZoom: true, - mapCenter: { lat: -34.397, lng: 150.644 }, - defaultMarkers: [{ lat: -34.397, lng: 150.644, title: "Test A" }], + mapCenter: { lat: -34.397, long: 150.644 }, + defaultMarkers: [{ lat: -34.397, long: 150.644, title: "Test A" }], }, }, configVersion: 1, diff --git a/app/client/src/reducers/uiReducers/dragResizeReducer.ts b/app/client/src/reducers/uiReducers/dragResizeReducer.ts index 2439a924fa..4ee67cac2c 100644 --- a/app/client/src/reducers/uiReducers/dragResizeReducer.ts +++ b/app/client/src/reducers/uiReducers/dragResizeReducer.ts @@ -10,7 +10,7 @@ const initialState: WidgetDragResizeState = { export const widgetDraggingReducer = createReducer(initialState, { [ReduxActionTypes.DISABLE_WIDGET_DRAG]: ( state: WidgetDragResizeState, - action: ReduxAction<{ disable: boolean }>, + action: ReduxAction<{ isDraggingDisabled: boolean }>, ) => { return { ...state, ...action.payload }; }, diff --git a/app/client/src/utils/Validators.ts b/app/client/src/utils/Validators.ts index 165fe5b6a0..dbe7f15f7b 100644 --- a/app/client/src/utils/Validators.ts +++ b/app/client/src/utils/Validators.ts @@ -248,7 +248,24 @@ export const VALIDATORS: Record = { parsed, message: `${WIDGET_TYPE_VALIDATION_ERROR}: Chart Data`, }; - } else if (!_.every(parsed, datum => _.isObject(datum))) { + } + const hasChartData = _.every( + parsed, + (datum: { seriesName: any; data: any }) => { + if (_.isObject(datum)) { + return ( + _.isString(datum.seriesName) && + _.isArray(datum.data) && + _.every(datum.data, (item: { x: any; y: any }) => { + return _.isString(item.x) && !_.isUndefined(item.y); + }) + ); + } else { + return false; + } + }, + ); + if (!hasChartData) { return { isValid: false, parsed: [], diff --git a/app/client/src/utils/WidgetPropsUtils.tsx b/app/client/src/utils/WidgetPropsUtils.tsx index 45648d1b11..f5cf43c6c3 100644 --- a/app/client/src/utils/WidgetPropsUtils.tsx +++ b/app/client/src/utils/WidgetPropsUtils.tsx @@ -100,6 +100,66 @@ const chartDataMigration = (currentDSL: ContainerWidgetProps) => { return currentDSL; }; +const mapDataMigration = (currentDSL: ContainerWidgetProps) => { + currentDSL.children = currentDSL.children?.map((children: WidgetProps) => { + if (children.type === WidgetTypes.MAP_WIDGET) { + if (children.markers) { + children.markers = children.markers.map( + (marker: { lat: any; lng: any; long: any; title: any }) => { + return { + lat: marker.lat, + long: marker.lng || marker.long, + title: marker.title, + }; + }, + ); + } + if (children.defaultMarkers) { + const defaultMarkers = JSON.parse(children.defaultMarkers); + children.defaultMarkers = defaultMarkers.map( + (marker: { + lat: number; + lng: number; + long: number; + title: string; + }) => { + return { + lat: marker.lat, + long: marker.lng || marker.long, + title: marker.title, + }; + }, + ); + } + if (children.selectedMarker) { + children.selectedMarker = { + lat: children.selectedMarker.lat, + long: children.selectedMarker.lng || children.selectedMarker.long, + title: children.selectedMarker.title, + }; + } + if (children.mapCenter) { + children.mapCenter = { + lat: children.mapCenter.lat, + long: children.mapCenter.lng || children.mapCenter.long, + title: children.mapCenter.title, + }; + } + if (children.center) { + children.center = { + lat: children.center.lat, + long: children.center.lng || children.center.long, + title: children.center.title, + }; + } + } else if (children.children && children.children.length > 0) { + children = mapDataMigration(children); + } + return children; + }); + return currentDSL; +}; + // A rudimentary transform function which updates the DSL based on its version. // A more modular approach needs to be designed. const transformDSL = (currentDSL: ContainerWidgetProps) => { @@ -135,6 +195,10 @@ const transformDSL = (currentDSL: ContainerWidgetProps) => { currentDSL = chartDataMigration(currentDSL); currentDSL.version = 3; } + if (currentDSL.version === 3) { + currentDSL = mapDataMigration(currentDSL); + currentDSL.version = 4; + } return currentDSL; }; diff --git a/app/client/src/widgets/ChartWidget.tsx b/app/client/src/widgets/ChartWidget.tsx index 2b980b79c0..09871441c6 100644 --- a/app/client/src/widgets/ChartWidget.tsx +++ b/app/client/src/widgets/ChartWidget.tsx @@ -19,6 +19,7 @@ class ChartWidget extends BaseWidget { yAxisName: VALIDATION_TYPES.TEXT, chartName: VALIDATION_TYPES.TEXT, isVisible: VALIDATION_TYPES.BOOLEAN, + chartData: VALIDATION_TYPES.CHART_DATA, }; } diff --git a/app/client/src/widgets/MapWidget.tsx b/app/client/src/widgets/MapWidget.tsx index 18335477ab..39a0e0deb8 100644 --- a/app/client/src/widgets/MapWidget.tsx +++ b/app/client/src/widgets/MapWidget.tsx @@ -16,7 +16,6 @@ class MapWidget extends BaseWidget { enableSearch: VALIDATION_TYPES.BOOLEAN, enablePickLocation: VALIDATION_TYPES.BOOLEAN, allowZoom: VALIDATION_TYPES.BOOLEAN, - enableCreateMarker: VALIDATION_TYPES.BOOLEAN, zoomLevel: VALIDATION_TYPES.NUMBER, onMarkerClick: VALIDATION_TYPES.ACTION_SELECTOR, onCreateMarker: VALIDATION_TYPES.ACTION_SELECTOR, @@ -44,28 +43,31 @@ class MapWidget extends BaseWidget { }; } - updateCenter = (lat: number, lng: number) => { - this.updateWidgetMetaProperty("center", { lat, lng }); + updateCenter = (lat: number, long: number) => { + this.updateWidgetMetaProperty("center", { lat, long }); }; - updateMarker = (lat: number, lng: number, index: number) => { + updateMarker = (lat: number, long: number, index: number) => { const markers: Array = [...this.props.markers]; + this.disableDrag(false); this.updateWidgetMetaProperty( "markers", markers.map((marker, i) => { if (index === i) { marker.lat = lat; - marker.lng = lng; + marker.long = long; } return marker; }), ); }; - onCreateMarker = (lat: number, lng: number) => { - const markers: Array = [...this.props.markers]; - markers.push({ lat: lat, lng: lng }); - this.updateWidgetMetaProperty("markers", markers); + onCreateMarker = (lat: number, long: number) => { + this.disableDrag(true); + this.updateWidgetMetaProperty("selectedMarker", { + lat: lat, + long: long, + }); if (this.props.onCreateMarker) { super.executeAction({ dynamicString: this.props.onCreateMarker, @@ -76,12 +78,13 @@ class MapWidget extends BaseWidget { } }; - onMarkerClick = (lat: number, lng: number, title: string) => { + onMarkerClick = (lat: number, long: number, title: string) => { this.updateWidgetMetaProperty("selectedMarker", { lat: lat, - long: lng, + long: long, title: title, }); + this.disableDrag(true); if (this.props.onMarkerClick) { super.executeAction({ dynamicString: this.props.onMarkerClick, @@ -119,7 +122,7 @@ class MapWidget extends BaseWidget { zoomLevel={this.props.zoomLevel} allowZoom={this.props.allowZoom} center={this.props.center || this.props.mapCenter} - enableCreateMarker={this.props.enableCreateMarker} + enableCreateMarker selectedMarker={this.props.selectedMarker} updateCenter={this.updateCenter} isDisabled={this.props.isDisabled} @@ -129,6 +132,9 @@ class MapWidget extends BaseWidget { updateMarker={this.updateMarker} selectMarker={this.onMarkerClick} markers={this.props.markers || []} + disableDrag={() => { + this.disableDrag(false); + }} /> ); } @@ -140,7 +146,7 @@ class MapWidget extends BaseWidget { export interface MarkerProps { lat: number; - lng: number; + long: number; title?: string; description?: string; } @@ -152,14 +158,13 @@ export interface MapWidgetProps extends WidgetProps { zoomLevel: number; allowZoom: boolean; enablePickLocation: boolean; - enableCreateMarker: boolean; mapCenter: { lat: number; - lng: number; + long: number; }; center?: { lat: number; - lng: number; + long: number; }; defaultMarkers?: Array; markers?: Array;