diff --git a/src/components/inputs/AutocompleteInput.jsx b/src/components/inputs/AutocompleteInput.jsx
index 8f4ed3e..1234684 100644
--- a/src/components/inputs/AutocompleteInput.jsx
+++ b/src/components/inputs/AutocompleteInput.jsx
@@ -44,6 +44,10 @@ class AutocompleteInput extends React.Component {
     this.calcMaxHeight();
   }
 
+  onChange (v) {
+    this.props.onChange(v === "" ? undefined : v);
+  }
+
   render() {
     return <div
       ref={(el) => {
@@ -68,8 +72,8 @@ class AutocompleteInput extends React.Component {
         value={this.props.value}
         items={this.props.options}
         getItemValue={(item) => item[0]}
-        onSelect={v => this.props.onChange(v)}
-        onChange={(e, v) => this.props.onChange(v)}
+        onSelect={v => this.onChange(v)}
+        onChange={(e, v) => this.onChange(v)}
         shouldItemRender={(item, value="") => {
           if (typeof(value) === "string") {
             return item[0].toLowerCase().indexOf(value.toLowerCase()) > -1
diff --git a/src/components/inputs/InputBlock.jsx b/src/components/inputs/InputBlock.jsx
index 9d28d8e..117ba3e 100644
--- a/src/components/inputs/InputBlock.jsx
+++ b/src/components/inputs/InputBlock.jsx
@@ -20,7 +20,7 @@ class InputBlock extends React.Component {
 
   onChange(e) {
     const value = e.target.value
-    return this.props.onChange(value === "" ? null: value)
+    return this.props.onChange(value === "" ? undefined : value)
   }
 
   render() {
diff --git a/src/libs/layer.js b/src/libs/layer.js
index 8d913ba..8a9cca3 100644
--- a/src/libs/layer.js
+++ b/src/libs/layer.js
@@ -31,7 +31,11 @@ export function changeProperty(layer, group, property, newValue) {
   if(newValue === undefined) {
     if(group) {
       const newLayer = {
-        ...layer
+        ...layer,
+        // Change object so the diff works in ./src/components/map/MapboxGlMap.jsx
+        [group]: {
+          ...layer[group]
+        }
       };
       delete newLayer[group][property];