schnabu/maputnik
1
0
Fork 0
mirror of https://github.com/a-nyx/maputnik-with-pmtiles.git synced 2024-12-27 10:45:23 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Scroll selected <LayerListItem/> into view

Browse source
This commit is contained in:
orangemug 2020-04-04 15:41:35 +01:00
parent fcfc7ab874
commit fcad636f85
1 changed files with 22 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
src/components/layers/LayerList.jsx
View file

@ -42,11 +42,15 @@ class LayerListContainer extends React.Component {
onLayerSelect: () => {},
}
state = {
collapsedGroups: {},
areAllGroupsExpanded: false,
isOpen: {
add: false,
constructor(props) {
super(props);
this.selectedItemRef = React.createRef();
this.state = {
collapsedGroups: {},
areAllGroupsExpanded: false,
isOpen: {
add: false,
}
}
}
@ -161,6 +165,13 @@ class LayerListContainer extends React.Component {
return propsChanged;
}
componentDidUpdate () {
const selectedItemNode = this.selectedItemRef.current;
if (selectedItemNode && selectedItemNode.node) {
selectedItemNode.node.scrollIntoView();
}
}
render() {
const listItems = []
@ -189,6 +200,11 @@ class LayerListContainer extends React.Component {
);
});
const additionalProps = {};
if (idx === this.props.selectedLayerIndex) {
additionalProps.ref = this.selectedItemRef;
}
const listItem = <LayerListItem
className={classnames({
'maputnik-layer-list-item-collapsed': layers.length > 1 && this.isCollapsed(groupPrefix, groupIdx) && idx !== this.props.selectedLayerIndex,
@ -205,6 +221,7 @@ class LayerListContainer extends React.Component {
onLayerDestroy={this.props.onLayerDestroy.bind(this)}
onLayerCopy={this.props.onLayerCopy.bind(this)}
onLayerVisibilityToggle={this.props.onLayerVisibilityToggle.bind(this)}
{...additionalProps}
/>
listItems.push(listItem)
idx += 1