ashatora/editor
1
0
Fork 0
mirror of https://github.com/maputnik/editor.git synced 2025-12-27 08:30:02 +00:00
Code Issues Projects Releases Wiki Activity

Updated mapbox-gl and react-sortable-hoc usage

Browse Source
This commit is contained in:
orangemug
2018-10-08 09:31:28 +01:00
parent d17d6b43c0
commit 012e4b670e
6 changed files with 73 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/layers/LayerList.jsx
View File

@@ -6,7 +6,7 @@ import LayerListGroup from './LayerListGroup'
import LayerListItem from './LayerListItem'
import AddModal from '../modals/AddModal'
import {SortableContainer, SortableHandle} from 'react-sortable-hoc';
import {SortableContainer} from 'react-sortable-hoc';
const layerListPropTypes = {
layers: PropTypes.array.isRequired,
@@ -35,7 +35,6 @@ function findClosestCommonPrefix(layers, idx) {
}
// List of collapsible layer editors
@SortableContainer
class LayerListContainer extends React.Component {
static propTypes = {...layerListPropTypes}
static defaultProps = {
@@ -197,11 +196,13 @@ class LayerListContainer extends React.Component {
}
}
const LayerListContainerSortable = SortableContainer((props) => <LayerListContainer {...props} />)
export default class LayerList extends React.Component {
static propTypes = {...layerListPropTypes}
render() {
return <LayerListContainer
return <LayerListContainerSortable
{...this.props}
onSortEnd={this.props.onMoveLayer.bind(this)}
useDragHandle={true}

10
src/components/layers/LayerListItem.jsx
View File

@@ -7,7 +7,6 @@ import {MdContentCopy, MdVisibility, MdVisibilityOff, MdDelete} from 'react-icon
import LayerIcon from '../icons/LayerIcon'
import {SortableElement, SortableHandle} from 'react-sortable-hoc'
@SortableHandle
class LayerTypeDragHandle extends React.Component {
static propTypes = LayerIcon.propTypes
@@ -24,6 +23,8 @@ class LayerTypeDragHandle extends React.Component {
}
}
const Handle = SortableHandle((props) => <LayerTypeDragHandle {...props} />)
class IconAction extends React.Component {
static propTypes = {
action: PropTypes.string.isRequired,
@@ -66,7 +67,6 @@ class IconAction extends React.Component {
}
}
@SortableElement
class LayerListItem extends React.Component {
static propTypes = {
layerId: PropTypes.string.isRequired,
@@ -111,7 +111,7 @@ class LayerListItem extends React.Component {
"maputnik-layer-list-item-selected": this.props.isSelected,
[this.props.className]: true,
})}>
<LayerTypeDragHandle type={this.props.layerType} />
<Handle type={this.props.layerType} />
<span className="maputnik-layer-list-item-id">{this.props.layerId}</span>
<span style={{flexGrow: 1}} />
<IconAction
@@ -137,4 +137,6 @@ class LayerListItem extends React.Component {
}
}
export default LayerListItem;
const LayerListItemSortable = SortableElement((props) => <LayerListItem {...props} />);
export default LayerListItemSortable;