schnabu/maputnik
1
0
Fork 0
mirror of https://github.com/a-nyx/maputnik-with-pmtiles.git synced 2025-01-14 17:33:30 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Added 'undo' alongside 'trash' button

Browse source
This commit is contained in:
orangemug 2020-02-08 10:38:31 +00:00
parent 532bbecb47
commit be36eec93d
1 changed files with 28 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

41
src/components/fields/_ExpressionProperty.jsx
View file

@ -3,7 +3,7 @@ import PropTypes from 'prop-types'
import InputBlock from '../inputs/InputBlock' import InputBlock from '../inputs/InputBlock'
import Button from '../Button' import Button from '../Button'
import {MdDelete} from 'react-icons/md' import {MdDelete, MdUndo} from 'react-icons/md'
import StringInput from '../inputs/StringInput' import StringInput from '../inputs/StringInput'
import labelFromFieldName from './_labelFromFieldName' import labelFromFieldName from './_labelFromFieldName'
@ -42,9 +42,9 @@ export default class ExpressionProperty extends React.Component {
this.props.onChange(jsonVal); this.props.onChange(jsonVal);
} }
onDelete = () => { onReset = () => {
const {lastValue} = this.state; const {lastValue} = this.state;
const {value, fieldName, fieldSpec} = this.props; const {value, fieldSpec} = this.props;
if (isLiteralExpression(value)) { if (isLiteralExpression(value)) {
this.props.onDelete(value[1]); this.props.onDelete(value[1]);
@ -52,19 +52,34 @@ export default class ExpressionProperty extends React.Component {
else if (isLiteralExpression(lastValue)) { else if (isLiteralExpression(lastValue)) {
this.props.onDelete(lastValue[1]); this.props.onDelete(lastValue[1]);
} }
else { }
this.props.onDelete(fieldSpec.default);
} onDelete = () => {
const {fieldSpec} = this.props;
this.props.onDelete(fieldSpec.default);
} }
render() { render() {
const {lastValue} = this.state;
const {value} = this.props;
const canUndo = isLiteralExpression(value) || isLiteralExpression(lastValue);
const deleteStopBtn = ( const deleteStopBtn = (
<Button <>
onClick={this.onDelete} <Button
className="maputnik-delete-stop" onClick={this.onReset}
> disabled={!canUndo}
<MdDelete /> className="maputnik-delete-stop"
</Button> >
<MdUndo />
</Button>
<Button
onClick={this.onDelete}
className="maputnik-delete-stop"
>
<MdDelete />
</Button>
</>
); );
return <InputBlock return <InputBlock
@ -76,7 +91,7 @@ export default class ExpressionProperty extends React.Component {
> >
<JSONEditor <JSONEditor
className="maputnik-expression-editor" className="maputnik-expression-editor"
layer={this.props.value} layer={value}
lineNumbers={false} lineNumbers={false}
maxHeight={200} maxHeight={200}
lineWrapping={true} lineWrapping={true}