diff --git a/app/imports/ui/components/computation/ComputedForCreature.vue b/app/imports/ui/components/computation/ComputedForCreature.vue
index 096d412f..a676a4fe 100644
--- a/app/imports/ui/components/computation/ComputedForCreature.vue
+++ b/app/imports/ui/components/computation/ComputedForCreature.vue
@@ -11,7 +11,7 @@ import Computed from '/imports/ui/components/computation/Computed.vue';
 
 export default {
   inject: {
-    computationContext: { default: {} }
+    context: { default: {} }
   },
   components: {
     Computed,
@@ -24,8 +24,8 @@ export default {
   },
   computed: {
     scope(){
-      return this.computationContext.creature &&
-      this.computationContext.creature.variables;
+      return this.context.creature &&
+      this.context.creature.variables;
     }
   }
 }
diff --git a/app/imports/ui/components/global/DatePicker.vue b/app/imports/ui/components/global/DatePicker.vue
index 42c77778..9aa2ff74 100644
--- a/app/imports/ui/components/global/DatePicker.vue
+++ b/app/imports/ui/components/global/DatePicker.vue
@@ -1,5 +1,5 @@
 <template lang="html">
-	<v-menu
+  <v-menu
     v-model="menu"
     :close-on-content-click="false"
     lazy
@@ -7,21 +7,25 @@
     full-width
     min-width="290px"
   >
-    <template v-slot:activator="{ on }">
+    <template #activator="{ on }">
       <v-text-field
         :value="formattedSafeValue"
         v-bind="$attrs"
         prepend-icon="event"
         readonly
-        v-on="on"
-				:loading="loading"
+        :loading="loading"
         :error-messages="errors"
-				@focus="focused = true"
-				@blur="focused = false"
-				box
-      ></v-text-field>
+        :disabled="isDisabled"
+        box
+        v-on="on"
+        @focus="focused = true"
+        @blur="focused = false"
+      />
     </template>
-    <v-date-picker :value="formattedSafeValue" @input="dateInput"></v-date-picker>
+    <v-date-picker
+      :value="formattedSafeValue"
+      @input="dateInput"
+    />
   </v-menu>
 </template>
 
@@ -34,17 +38,17 @@ export default {
 	data(){return {
 		menu: false,
 	};},
+	computed: {
+		formattedSafeValue(){
+			return format(this.safeValue, 'YYYY-MM-DD')
+		},
+	},
 	methods: {
 		dateInput(e){
 			this.menu = false;
 			this.input(e);
 		},
 	},
-	computed: {
-		formattedSafeValue(){
-			return format(this.safeValue, 'YYYY-MM-DD')
-		},
-	},
 }
 </script>
 
diff --git a/app/imports/ui/components/global/SmartCheckbox.vue b/app/imports/ui/components/global/SmartCheckbox.vue
new file mode 100644
index 00000000..294ccdd0
--- /dev/null
+++ b/app/imports/ui/components/global/SmartCheckbox.vue
@@ -0,0 +1,18 @@
+<template lang="html">
+  <v-checkbox
+    v-bind="$attrs"
+    :loading="loading"
+    :error-messages="errors"
+    :input-value="safeValue"
+    :disabled="isDisabled"
+    @change="change"
+  />
+</template>
+
+<script>
+  import SmartInput from '/imports/ui/components/global/SmartInputMixin.js';
+
+  export default {
+    mixins: [SmartInput],
+  };
+</script>
diff --git a/app/imports/ui/components/global/SmartCombobox.vue b/app/imports/ui/components/global/SmartCombobox.vue
index d9bcd679..b950f308 100644
--- a/app/imports/ui/components/global/SmartCombobox.vue
+++ b/app/imports/ui/components/global/SmartCombobox.vue
@@ -6,6 +6,7 @@
     :value="safeValue"
     :menu-props="{auto: true, lazy: true}"
     :search-input.sync="searchInput"
+    :disabled="isDisabled"
     box
     @change="customChange"
     @focus="focused = true"
diff --git a/app/imports/ui/components/global/SmartInputMixin.js b/app/imports/ui/components/global/SmartInputMixin.js
index cb2d4a1a..e4b30e5a 100644
--- a/app/imports/ui/components/global/SmartInputMixin.js
+++ b/app/imports/ui/components/global/SmartInputMixin.js
@@ -9,6 +9,9 @@
 import { debounce } from 'lodash';
 
 export default {
+  inject: {
+    context: { default: {} }
+  },
   inheritAttrs: false,
   data(){ return {
     error: false,
@@ -20,12 +23,9 @@ export default {
     inputValue: this.value,
   };},
   props: {
-    value: [String, Number, Date, Array],
-    debounceTime: {
-      type: Number,
-      default: 750,
-    },
+    value: [String, Number, Date, Array, Boolean],
     errorMessages: [String, Array],
+    disabled: Boolean,
   },
   watch: {
     focused(newFocus){
@@ -54,7 +54,7 @@ export default {
         this.safeValue = newValue;
       }
     },
-    safeValue(newSafeValue){
+    safeValue(){
       // The safe value only gets updated from the parent, so it must be valid
       this.error = false;
       this.ackErrors = null;
@@ -104,6 +104,16 @@ export default {
       }
       return errors;
     },
+    isDisabled(){
+      return this.context.editPermission === false || this.disabled;
+    },
+    debounceTime() {
+      if (Number.isFinite(this.context.debounceTime)){
+        return this.context.debounceTime;
+      } else {
+        return 750;
+      }
+    },
   },
   created(){
     this.debouncedChange = debounce(this.change, this.debounceTime);
diff --git a/app/imports/ui/components/global/SmartSelect.vue b/app/imports/ui/components/global/SmartSelect.vue
index 6298f814..81d23b65 100644
--- a/app/imports/ui/components/global/SmartSelect.vue
+++ b/app/imports/ui/components/global/SmartSelect.vue
@@ -1,17 +1,21 @@
 <template lang="html">
   <v-select
-		v-bind="$attrs"
-		:loading="loading"
-		:error-messages="errors"
-		:value="safeValue"
-		:menu-props="{auto: true, lazy: true}"
-		@change="change"
-		@focus="focused = true"
-		@blur="focused = false"
-		box
-	>
-		<slot name="prepend" slot="prepend"/>
-	</v-select>
+    v-bind="$attrs"
+    :loading="loading"
+    :error-messages="errors"
+    :value="safeValue"
+    :menu-props="{auto: true, lazy: true}"
+    :disabled="isDisabled"
+    box
+    @change="change"
+    @focus="focused = true"
+    @blur="focused = false"
+  >
+    <slot
+      slot="prepend"
+      name="prepend"
+    />
+  </v-select>
 </template>
 
 <script>
diff --git a/app/imports/ui/components/global/SmartSwitch.vue b/app/imports/ui/components/global/SmartSwitch.vue
new file mode 100644
index 00000000..1916b48f
--- /dev/null
+++ b/app/imports/ui/components/global/SmartSwitch.vue
@@ -0,0 +1,18 @@
+<template lang="html">
+  <v-switch
+    v-bind="$attrs"
+    :loading="loading"
+    :error-messages="errors"
+    :input-value="safeValue"
+    :disabled="isDisabled"
+    @change="change"
+  />
+</template>
+
+<script>
+  import SmartInput from '/imports/ui/components/global/SmartInputMixin.js';
+
+  export default {
+    mixins: [SmartInput],
+  };
+</script>
diff --git a/app/imports/ui/components/global/TextArea.vue b/app/imports/ui/components/global/TextArea.vue
index 490a9acb..000c3077 100644
--- a/app/imports/ui/components/global/TextArea.vue
+++ b/app/imports/ui/components/global/TextArea.vue
@@ -1,15 +1,16 @@
 <template lang="html">
   <v-textarea
-		v-bind="$attrs"
-		:loading="loading"
-		:error-messages="errors"
-		:value="safeValue"
-		:auto-grow="autoGrow"
-		@input="input"
-		@focus="focused = true"
-		@blur="focused = false"
-		box
-	/>
+    v-bind="$attrs"
+    :loading="loading"
+    :error-messages="errors"
+    :value="safeValue"
+    :disabled="isDisabled"
+    :auto-grow="autoGrow"
+    box
+    @input="input"
+    @focus="focused = true"
+    @blur="focused = false"
+  />
 </template>
 
 <script>
diff --git a/app/imports/ui/components/global/TextField.vue b/app/imports/ui/components/global/TextField.vue
index b542c338..f7fab2f9 100644
--- a/app/imports/ui/components/global/TextField.vue
+++ b/app/imports/ui/components/global/TextField.vue
@@ -1,20 +1,21 @@
 <template lang="html">
   <v-text-field
-		v-bind="$attrs"
-		:loading="loading"
-		:error-messages="errors"
-		:value="safeValue"
-		@input="input"
-		@focus="focused = true"
-		@blur="focused = false"
-		box
-	/>
+    v-bind="$attrs"
+    :loading="loading"
+    :error-messages="errors"
+    :value="safeValue"
+    :disabled="isDisabled"
+    box
+    @input="input"
+    @focus="focused = true"
+    @blur="focused = false"
+  />
 </template>
 
 <script>
-	import SmartInput from '/imports/ui/components/global/SmartInputMixin.js';
+  import SmartInput from '/imports/ui/components/global/SmartInputMixin.js';
 
-	export default {
-		mixins: [SmartInput],
-	};
+  export default {
+    mixins: [SmartInput],
+  };
 </script>
diff --git a/app/imports/ui/components/global/globalIndex.js b/app/imports/ui/components/global/globalIndex.js
index 1e578e5e..e201dea9 100644
--- a/app/imports/ui/components/global/globalIndex.js
+++ b/app/imports/ui/components/global/globalIndex.js
@@ -5,9 +5,11 @@ import TextField from '/imports/ui/components/global/TextField.vue';
 import TextArea from '/imports/ui/components/global/TextArea.vue';
 import SmartSelect from '/imports/ui/components/global/SmartSelect.vue';
 import SmartCombobox from '/imports/ui/components/global/SmartCombobox.vue';
+import SmartSwitch from '/imports/ui/components/global/SmartSwitch.vue';
 
 Vue.component('DatePicker', DatePicker);
 Vue.component('TextField', TextField);
 Vue.component('TextArea', TextArea);
 Vue.component('SmartSelect', SmartSelect);
 Vue.component('SmartCombobox', SmartCombobox);
+Vue.component('SmartSwitch', SmartSwitch);
diff --git a/app/imports/ui/creature/character/CharacterSheet.vue b/app/imports/ui/creature/character/CharacterSheet.vue
index 5aebbef8..381a5c36 100644
--- a/app/imports/ui/creature/character/CharacterSheet.vue
+++ b/app/imports/ui/creature/character/CharacterSheet.vue
@@ -80,7 +80,7 @@
       },
 		},
     reactiveProvide: {
-      name: 'computationContext',
+      name: 'context',
       include: ['creature'],
     },
     onMounted(){
diff --git a/app/imports/ui/creature/creatureProperties/CreaturePropertyDialog.vue b/app/imports/ui/creature/creatureProperties/CreaturePropertyDialog.vue
index adeb2b4c..f6b48da5 100644
--- a/app/imports/ui/creature/creatureProperties/CreaturePropertyDialog.vue
+++ b/app/imports/ui/creature/creatureProperties/CreaturePropertyDialog.vue
@@ -111,6 +111,7 @@ import PropertyIcon from '/imports/ui/properties/shared/PropertyIcon.vue';
 import propertyFormIndex from '/imports/ui/properties/forms/shared/propertyFormIndex.js';
 import propertyViewerIndex from '/imports/ui/properties/viewers/shared/propertyViewerIndex.js';
 import CreaturePropertiesTree from '/imports/ui/creature/creatureProperties/CreaturePropertiesTree.vue';
+import { assertEditPermission } from '/imports/api/creature/creaturePermissions.js';
 import { get, findLast } from 'lodash';
 
 let formIndex = {};
@@ -142,6 +143,14 @@ export default {
 		model(){
 			return CreatureProperties.findOne(this._id);
 		},
+    editPermission(){
+      try {
+        assertEditPermission(this.creature, Meteor.userId());
+        return true;
+      } catch (e) {
+        return false;
+      }
+    },
 	},
   computed: {
     creature(){
@@ -155,19 +164,19 @@ export default {
     }
   },
   reactiveProvide: {
-    name: 'computationContext',
-    include: ['creature'],
+    name: 'context',
+    include: ['creature', 'editPermission'],
   },
 	methods: {
 		getPropertyName,
 		change({path, value, ack}){
-			updateProperty.call({_id: this._id, path, value}, (error, result) =>{
+			updateProperty.call({_id: this._id, path, value}, (error) =>{
         if (error) console.warn(error);
 				ack && ack(error && error.reason || error);
 			});
 		},
 		push({path, value, ack}){
-			pushToProperty.call({_id: this._id, path, value}, (error, result) =>{
+			pushToProperty.call({_id: this._id, path, value}, (error) =>{
         if (error) console.warn(error);
 				ack && ack(error && error.reason || error);
 			});
@@ -175,7 +184,7 @@ export default {
 		pull({path, ack}){
 			let itemId = get(this.model, path)._id;
 			path.pop();
-			pullFromProperty.call({_id: this._id, path, itemId}, (error, result) =>{
+			pullFromProperty.call({_id: this._id, path, itemId}, (error) =>{
         if (error) console.warn(error);
 				ack && ack(error && error.reason || error);
 			});
diff --git a/app/imports/ui/creature/creatureProperties/CreaturePropertyInsertForm.vue b/app/imports/ui/creature/creatureProperties/CreaturePropertyInsertForm.vue
index 88618077..4e2e86ad 100644
--- a/app/imports/ui/creature/creatureProperties/CreaturePropertyInsertForm.vue
+++ b/app/imports/ui/creature/creatureProperties/CreaturePropertyInsertForm.vue
@@ -43,12 +43,17 @@ export default {
 		propertyName: String,
 		type: String,
 	},
+  reactiveProvide: {
+    name: 'context',
+    include: ['debounceTime'],
+  },
 	data(){return {
 		model: {
 			type: this.type,
 		},
 		schema: undefined,
 		validationContext: undefined,
+    debounceTime: 0,
 	};},
 	watch: {
 		type(newType){
diff --git a/app/imports/ui/library/LibraryNodeEditDialog.vue b/app/imports/ui/library/LibraryNodeEditDialog.vue
index 18a5bfd1..86c90072 100644
--- a/app/imports/ui/library/LibraryNodeEditDialog.vue
+++ b/app/imports/ui/library/LibraryNodeEditDialog.vue
@@ -41,57 +41,73 @@
 </template>
 
 <script>
-	import LibraryNodes, {
-		updateLibraryNode,
-		pushToLibraryNode,
-		pullFromLibraryNode,
-		softRemoveLibraryNode,
-	} from '/imports/api/library/LibraryNodes.js';
-	import DialogBase from '/imports/ui/dialogStack/DialogBase.vue';
-	import { getPropertyName } from '/imports/constants/PROPERTIES.js';
-	import PropertyIcon from '/imports/ui/properties/shared/PropertyIcon.vue';
-	import propertyFormIndex from '/imports/ui/properties/forms/shared/propertyFormIndex.js';
-	import { get } from 'lodash';
+  import LibraryNodes, {
+    updateLibraryNode,
+    pushToLibraryNode,
+    pullFromLibraryNode,
+    softRemoveLibraryNode,
+  } from '/imports/api/library/LibraryNodes.js';
+  import DialogBase from '/imports/ui/dialogStack/DialogBase.vue';
+  import { getPropertyName } from '/imports/constants/PROPERTIES.js';
+  import PropertyIcon from '/imports/ui/properties/shared/PropertyIcon.vue';
+  import propertyFormIndex from '/imports/ui/properties/forms/shared/propertyFormIndex.js';
+  import { get } from 'lodash';
+  import { assertDocEditPermission } from '/imports/api/sharing/sharingPermissions.js';
 
-	export default {
-	  components: {
-			...propertyFormIndex,
-			PropertyIcon,
-	    DialogBase,
-	  },
-		props: {
-			_id: String,
-		},
-		meteor: {
-			model(){
-				return LibraryNodes.findOne(this._id);
-			},
-		},
-		methods: {
-			getPropertyName,
-			change({path, value, ack}){
-	      updateLibraryNode.call({_id: this._id, path, value}, (error, result) =>{
-					ack && ack(error && error.reason || error);
-				});
-			},
-	    push({path, value, ack}){
-				pushToLibraryNode.call({_id: this._id, path, value}, (error, result) =>{
-					ack && ack(error && error.reason || error);
-				});
-	    },
-	    pull({path, ack}){
-				let itemId = get(this.model, path)._id;
-				path.pop();
-				pullFromLibraryNode.call({_id: this._id, path, itemId}, (error, result) =>{
-					ack && ack(error && error.reason || error);
-				});
-	    },
-			remove(){
-				softRemoveLibraryNode.call({_id: this._id});
-				this.$store.dispatch('popDialogStack');
-			},
-		}
-	};
+  export default {
+    components: {
+      ...propertyFormIndex,
+      PropertyIcon,
+      DialogBase,
+    },
+    props: {
+      _id: String,
+    },
+    reactiveProvide: {
+      name: 'context',
+      include: ['debounceTime', 'editPermission'],
+    },
+    data(){return {
+      debounceTime: 0,
+    }},
+    meteor: {
+      model(){
+        return LibraryNodes.findOne(this._id);
+      },
+      editPermission(){
+        try {
+          assertDocEditPermission(this.model, Meteor.userId());
+          return true;
+        } catch (e) {
+          return false;
+        }
+      },
+    },
+    methods: {
+      getPropertyName,
+      change({path, value, ack}){
+        updateLibraryNode.call({_id: this._id, path, value}, (error) =>{
+          ack && ack(error && error.reason || error);
+        });
+      },
+      push({path, value, ack}){
+        pushToLibraryNode.call({_id: this._id, path, value}, (error) =>{
+          ack && ack(error && error.reason || error);
+        });
+      },
+      pull({path, ack}){
+        let itemId = get(this.model, path)._id;
+        path.pop();
+        pullFromLibraryNode.call({_id: this._id, path, itemId}, (error) =>{
+          ack && ack(error && error.reason || error);
+        });
+      },
+      remove(){
+        softRemoveLibraryNode.call({_id: this._id});
+        this.$store.dispatch('popDialogStack');
+      },
+    }
+  };
 </script>
 
 <style lang="css" scoped>
diff --git a/app/imports/ui/library/LibraryNodeInsertForm.vue b/app/imports/ui/library/LibraryNodeInsertForm.vue
index 7587d8e6..00654e01 100644
--- a/app/imports/ui/library/LibraryNodeInsertForm.vue
+++ b/app/imports/ui/library/LibraryNodeInsertForm.vue
@@ -44,12 +44,17 @@ export default {
 		propertyName: String,
 		type: String,
 	},
+  reactiveProvide: {
+    name: 'context',
+    include: ['debounceTime'],
+  },
 	data(){return {
 		model: {
 			type: this.type,
 		},
 		schema: undefined,
 		validationContext: undefined,
+    debounceTime: 0,
 	};},
 	watch: {
 		type(newType){
diff --git a/app/imports/ui/properties/forms/ActionForm.vue b/app/imports/ui/properties/forms/ActionForm.vue
index 61ce4e63..0f95f20d 100644
--- a/app/imports/ui/properties/forms/ActionForm.vue
+++ b/app/imports/ui/properties/forms/ActionForm.vue
@@ -3,9 +3,8 @@
     <text-field
       label="Name"
       :value="model.name"
-      :debounce-time="debounceTime"
       :error-messages="errors.name"
-      @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+      @change="change('name', ...arguments)"
     />
     <smart-select
       label="Action type"
@@ -14,23 +13,20 @@
       :error-messages="errors.actionType"
       :menu-props="{auto: true, lazy: true}"
       :hint="actionTypeHints[model.actionType]"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['actionType'], value, ack})"
+      @change="change('actionType', ...arguments)"
     />
     <text-field
       v-if="attackForm"
       label="Roll bonus"
       :value="model.rollBonus"
       :error-messages="errors.rollBonus"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['rollBonus'], value, ack})"
+      @change="change('rollBonus', ...arguments)"
     />
     <text-area
       label="Description"
       :value="model.description"
       :error-messages="errors.description"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['description'], value, ack})"
+      @change="change('description', ...arguments)"
     />
     <form-sections>
       <form-section name="Resources">
@@ -42,14 +38,13 @@
         />
       </form-section>
       <form-section name="Advanced">
-        <v-combobox
+        <smart-combobox
           label="Tags"
           multiple
           chips
           deletable-chips
-          box
           :value="model.tags"
-          @change="(value) => $emit('change', {path: ['tags'], value})"
+          @change="change('tags', ...arguments)"
         />
         <smart-select
           label="Target"
@@ -58,8 +53,7 @@
           :value="model.target"
           :error-messages="errors.target"
           :menu-props="{auto: true, lazy: true}"
-          :debounce-time="debounceTime"
-          @change="(value, ack) => $emit('change', {path: ['target'], value, ack})"
+          @change="change('target', ...arguments)"
         />
         <div class="layout row wrap">
           <text-field
@@ -68,8 +62,7 @@
             style="flex-basis: 300px;"
             :value="model.uses"
             :error-messages="errors.uses"
-            :debounce-time="debounceTime"
-            @change="(value, ack) => $emit('change', {path: ['uses'], value, ack})"
+            @change="change('uses', ...arguments)"
           />
           <text-field
             label="Uses used"
@@ -78,8 +71,7 @@
             style="flex-basis: 300px;"
             :value="model.usesUsed"
             :error-messages="errors.uses"
-            :debounce-time="debounceTime"
-            @change="(value, ack) => $emit('change', {path: ['usesUsed'], value, ack})"
+            @change="change('usesUsed', ...arguments)"
           />
         </div>
         <smart-select
@@ -91,7 +83,7 @@
           :error-messages="errors.reset"
           :menu-props="{auto: true, lazy: true}"
           :debounce-time="debounceTime"
-          @change="(value, ack) => $emit('change', {path: ['reset'], value, ack})"
+          @change="change('reset', ...arguments)"
         />
       </form-section>
     </form-sections>
@@ -101,6 +93,7 @@
 <script>
   import FormSection, {FormSections} from '/imports/ui/properties/forms/shared/FormSection.vue';
   import ResourcesForm from '/imports/ui/properties/forms/ResourcesForm.vue';
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
   export default {
     components: {
@@ -108,25 +101,11 @@
       FormSections,
       ResourcesForm,
     },
+    mixins: [propertyFormMixin],
     props: {
-      stored: {
-        type: Boolean,
-      },
-      model: {
-        type: Object,
-        default: () => ({}),
-      },
-      errors: {
-        type: Object,
-        default: () => ({}),
-      },
       attackForm: {
         type: Boolean,
       },
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
     },
     data(){
       let data = {
diff --git a/app/imports/ui/properties/forms/AdjustmentForm.vue b/app/imports/ui/properties/forms/AdjustmentForm.vue
index 68f60bfd..23272baa 100644
--- a/app/imports/ui/properties/forms/AdjustmentForm.vue
+++ b/app/imports/ui/properties/forms/AdjustmentForm.vue
@@ -8,8 +8,7 @@
         :items="attributeList"
         :value="model.stat"
         :error-messages="errors.stat"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['stat'], value, ack})"
+        @change="change('stat', ...arguments)"
       />
       <text-field
         label="Damage"
@@ -17,8 +16,7 @@
         style="flex-basis: 300px;"
         :value="model.amount"
         :error-messages="errors.amount"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['amount'], value, ack})"
+        @change="change('amount', ...arguments)"
       />
     </div>
     <smart-select
@@ -29,34 +27,22 @@
       :value="model.target"
       :error-messages="errors.target"
       :menu-props="{auto: true, lazy: true}"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['target'], value, ack})"
+      @change="change('target', ...arguments)"
     />
   </div>
 </template>
 
 <script>
 import attributeListMixin from '/imports/ui/properties/forms/shared/lists/attributeListMixin.js';
+import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
 export default {
-  mixins: [attributeListMixin],
+  mixins: [propertyFormMixin, attributeListMixin],
 	props: {
-		model: {
-			type: Object,
-			default: () => ({}),
-		},
-		errors: {
-			type: Object,
-			default: () => ({}),
-		},
 		parentTarget: {
 			type: String,
       default: undefined,
 		},
-    debounceTime: {
-      type: Number,
-      default: undefined,
-    },
 	},
 	computed: {
 		targetOptions(){
diff --git a/app/imports/ui/properties/forms/AttributeConsumedForm.vue b/app/imports/ui/properties/forms/AttributeConsumedForm.vue
index 3442b0e1..172b970e 100644
--- a/app/imports/ui/properties/forms/AttributeConsumedForm.vue
+++ b/app/imports/ui/properties/forms/AttributeConsumedForm.vue
@@ -7,8 +7,7 @@
       :items="attributeList"
       :value="model.variableName"
       :error-messages="errors.variableName"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['variableName'], value, ack})"
+      @change="change('variableName', ...arguments)"
     />
     <text-field
       label="Quantity"
@@ -16,30 +15,16 @@
       style="flex-basis: 300px;"
       :value="model.quantity"
       :error-messages="errors.quantity"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['quantity'], value, ack})"
+      @change="change('quantity', ...arguments)"
     />
   </div>
 </template>
 
 <script>
+import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 import attributeListMixin from '/imports/ui/properties/forms/shared/lists/attributeListMixin.js';
 
 export default {
-  mixins: [attributeListMixin],
-	props: {
-		model: {
-			type: Object,
-			default: () => ({}),
-		},
-		errors: {
-			type: Object,
-			default: () => ({}),
-		},
-    debounceTime: {
-      type: Number,
-      default: undefined,
-    },
-	},
+  mixins: [propertyFormMixin, attributeListMixin],
 }
 </script>
diff --git a/app/imports/ui/properties/forms/AttributeForm.vue b/app/imports/ui/properties/forms/AttributeForm.vue
index c2d0fbf4..79e9e2c6 100644
--- a/app/imports/ui/properties/forms/AttributeForm.vue
+++ b/app/imports/ui/properties/forms/AttributeForm.vue
@@ -8,8 +8,7 @@
         style="width: 332px;"
         :value="model.baseValueCalculation"
         :error-messages="errors.baseValueCalculation"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['baseValueCalculation'], value, ack})"
+        @change="change('baseValueCalculation', ...arguments)"
       />
     </div>
     <div class="layout row wrap">
@@ -17,8 +16,7 @@
         label="Name"
         :value="model.name"
         :error-messages="errors.name"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+        @change="change('name', ...arguments)"
       />
       <text-field
         label="Variable name"
@@ -26,8 +24,7 @@
         style="flex-basis: 300px;"
         hint="Use this name in formulae to reference this attribute"
         :error-messages="errors.variableName"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['variableName'], value, ack})"
+        @change="change('variableName', ...arguments)"
       />
     </div>
     <smart-select
@@ -37,8 +34,7 @@
       :error-messages="errors.attributeType"
       :menu-props="{auto: true, lazy: true}"
       :hint="attributeTypeHints[model.attributeType]"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['attributeType'], value, ack})"
+      @change="change('attributeType', ...arguments)"
     />
     <smart-select
       v-if="model.attributeType === 'hitDice'"
@@ -47,28 +43,26 @@
       :value="model.hitDiceSize"
       :error-messages="errors.hitDiceSize"
       :menu-props="{auto: true, lazy: true}"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['hitDiceSize'], value, ack})"
+      @change="change('hitDiceSize', ...arguments)"
     />
     <text-area
       label="Description"
       :value="model.description"
       :error-messages="errors.description"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['description'], value, ack})"
+      @change="change('description', ...arguments)"
     />
     <form-section
       name="Advanced"
       standalone
     >
       <div class="layout column align-center">
-        <v-switch
+        <smart-switch
           v-if="model.attributeType !== 'hitDice'"
           label="Allow decimal values"
           class="no-flex"
-          :input-value="model.decimal"
+          :value="model.decimal"
           :error-messages="errors.decimal"
-          @change="e => $emit('change', {path: ['decimal'], value: !!e})"
+          @change="change('decimal', ...arguments)"
         />
         <div
           class="layout row justify-center"
@@ -82,8 +76,7 @@
             hint="The attribute's final value is reduced by this amount"
             :value="model.damage"
             :error-messages="errors.damage"
-            :debounce-time="debounceTime"
-            @change="(value, ack) => $emit('change', {path: ['damage'], value, ack})"
+            @change="change('damage', ...arguments)"
           />
         </div>
       </div>
@@ -97,8 +90,7 @@
           :value="model.reset"
           :error-messages="errors.reset"
           :menu-props="{auto: true, lazy: true}"
-          :debounce-time="debounceTime"
-          @change="(value, ack) => $emit('change', {path: ['reset'], value: value, ack})"
+          @change="change('reset', ...arguments)"
         />
       </div>
     </form-section>
@@ -107,25 +99,13 @@
 
 <script>
 	import FormSection from '/imports/ui/properties/forms/shared/FormSection.vue';
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
 	export default {
 		components: {
 			FormSection,
 		},
-		props: {
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
+    mixins: [propertyFormMixin],
 		data(){
 			let data = {
 				attributeTypes: [
diff --git a/app/imports/ui/properties/forms/AttributesConsumedListForm.vue b/app/imports/ui/properties/forms/AttributesConsumedListForm.vue
index 1b6cf952..db99592f 100644
--- a/app/imports/ui/properties/forms/AttributesConsumedListForm.vue
+++ b/app/imports/ui/properties/forms/AttributesConsumedListForm.vue
@@ -9,7 +9,7 @@
           <div style="flex-grow: 1;">
             <attribute-consumed-form
               :model="attribute"
-              @change="({path, value, ack}) => $emit('change', {path: [i, ...path], value, ack})"
+              @change="({path, value, ack}) => change([i, ...path], value, ack)"
             />
           </div>
           <v-btn
@@ -29,23 +29,12 @@
 
 <script>
 	import AttributeConsumedForm from '/imports/ui/properties/forms/AttributeConsumedForm.vue';
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
 	export default {
 		components: {
 			AttributeConsumedForm,
 		},
-		props: {
-			model: {
-				type: Array,
-				default: () => ([]),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
+    mixins: [propertyFormMixin],
 	}
 </script>
-
-<style lang="css" scoped>
-</style>
diff --git a/app/imports/ui/properties/forms/BuffForm.vue b/app/imports/ui/properties/forms/BuffForm.vue
index 876e4dd6..d8d5cb01 100644
--- a/app/imports/ui/properties/forms/BuffForm.vue
+++ b/app/imports/ui/properties/forms/BuffForm.vue
@@ -4,47 +4,34 @@
       label="Name"
       :value="model.name"
       :error-messages="errors.name"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+      @change="change('name', ...arguments)"
     />
     <text-area
       label="Description"
       :value="model.description"
       :error-messages="errors.description"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['description'], value, ack})"
+      @change="change('description', ...arguments)"
     />
     <text-field
       label="Duration"
       hint="How long the buff lasts"
       :value="model.duration"
       :error-messages="errors.duration"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['duration'], value, ack})"
+      @change="change('duration', ...arguments)"
     />
   </div>
 </template>
 
 <script>
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
+
 	export default {
+    mixins: [propertyFormMixin],
 		props: {
-			stored: Boolean,
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
 			parentTarget: {
 				type: String,
         default: undefined,
 			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
 		},
 		computed: {
 			targetOptions(){
diff --git a/app/imports/ui/properties/forms/ClassLevelForm.vue b/app/imports/ui/properties/forms/ClassLevelForm.vue
index 23167891..8251e30a 100644
--- a/app/imports/ui/properties/forms/ClassLevelForm.vue
+++ b/app/imports/ui/properties/forms/ClassLevelForm.vue
@@ -7,8 +7,7 @@
         class="base-value-field text-xs-center large-format no-flex"
         :value="model.level"
         :error-messages="errors.level"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['level'], value, ack})"
+        @change="change('level', ...arguments)"
       />
     </div>
     <div class="layout row wrap">
@@ -16,8 +15,7 @@
         label="Name"
         :value="model.name"
         :error-messages="errors.name"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+        @change="change('name', ...arguments)"
       />
       <text-field
         label="Class variable name"
@@ -25,30 +23,17 @@
         style="flex-basis: 300px;"
         hint="This should be the same for each level in a class"
         :error-messages="errors.variableName"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['variableName'], value, ack})"
+        @change="change('variableName', ...arguments)"
       />
     </div>
   </div>
 </template>
 
 <script>
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
 	export default {
-		props: {
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
+    mixins: [propertyFormMixin],
 	};
 </script>
 
diff --git a/app/imports/ui/properties/forms/ContainerForm.vue b/app/imports/ui/properties/forms/ContainerForm.vue
index cbd3fd7a..f8d4183f 100644
--- a/app/imports/ui/properties/forms/ContainerForm.vue
+++ b/app/imports/ui/properties/forms/ContainerForm.vue
@@ -4,8 +4,7 @@
       label="Name"
       :value="model.name"
       :error-messages="errors.name"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+      @change="change('name', ...arguments)"
     />
     <div class="layout row wrap">
       <text-field
@@ -18,8 +17,7 @@
         style="flex-basis: 300px;"
         :value="model.value"
         :error-messages="errors.value"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['value'], value, ack})"
+        @change="change('value', ...arguments)"
       />
       <text-field
         label="Weight"
@@ -30,32 +28,30 @@
         style="flex-basis: 300px;"
         :value="model.weight"
         :error-messages="errors.weight"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['weight'], value, ack})"
+        @change="change('weight', ...arguments)"
       />
     </div>
     <text-area
       label="Description"
       :value="model.description"
       :error-messages="errors.description"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['description'], value, ack})"
+      @change="change('description', ...arguments)"
     />
     <form-section
       name="Advanced"
       standalone
     >
-      <v-switch
+      <smart-switch
         label="Carried"
-        :input-value="model.carried"
+        :value="model.carried"
         :error-messages="errors.carried"
-        @change="e => $emit('change', {path: ['carried'], value})"
+        @change="change('carried', ...arguments)"
       />
-      <v-switch
+      <smart-switch
         label="Contents are weightless"
-        :input-value="model.contentsWeightless"
+        :value="model.contentsWeightless"
         :error-messages="errors.contentsWeightless"
-        @change="e => $emit('change', {path: ['contentsWeightless'], value})"
+        @change="change('contentsWeightless', ...arguments)"
       />
     </form-section>
   </div>
@@ -63,24 +59,12 @@
 
 <script>
 import FormSection from '/imports/ui/properties/forms/shared/FormSection.vue';
+import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
 export default {
 	components: {
 		FormSection,
 	},
-	props: {
-		model: {
-			type: Object,
-			default: () => ({}),
-		},
-		errors: {
-			type: Object,
-			default: () => ({}),
-		},
-    debounceTime: {
-      type: Number,
-      default: undefined,
-    },
-	},
-	}
+  mixins: [propertyFormMixin],
+}
 </script>
diff --git a/app/imports/ui/properties/forms/DamageForm.vue b/app/imports/ui/properties/forms/DamageForm.vue
index 0e399fbd..d29eb568 100644
--- a/app/imports/ui/properties/forms/DamageForm.vue
+++ b/app/imports/ui/properties/forms/DamageForm.vue
@@ -6,8 +6,7 @@
         style="flex-basis: 300px;"
         :value="model.amount"
         :error-messages="errors.amount"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['amount'], value, ack})"
+        @change="change('amount', ...arguments)"
       />
       <smart-select
         label="Damage Type"
@@ -16,8 +15,7 @@
         :value="model.damageType"
         :error-messages="errors.damageType"
         :menu-props="{auto: true}"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['damageType'], value, ack})"
+        @change="change('damageType', ...arguments)"
       />
     </div>
     <smart-select
@@ -27,33 +25,22 @@
       :value="model.target"
       :error-messages="errors.target"
       :menu-props="{auto: true, lazy: true}"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['target'], value, ack})"
+      @change="change('target', ...arguments)"
     />
   </div>
 </template>
 
 <script>
 import DAMAGE_TYPES from '/imports/constants/DAMAGE_TYPES.js';
+import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
 export default {
+  mixins: [propertyFormMixin],
 	props: {
-		model: {
-			type: Object,
-			default: () => ({}),
-		},
-		errors: {
-			type: Object,
-			default: () => ({}),
-		},
 		parentTarget: {
 			type: String,
       default: undefined,
 		},
-    debounceTime: {
-      type: Number,
-      default: undefined,
-    },
 	},
 	data(){return{
 		DAMAGE_TYPES,
diff --git a/app/imports/ui/properties/forms/DamageMultiplierForm.vue b/app/imports/ui/properties/forms/DamageMultiplierForm.vue
index be43d814..661bbf68 100644
--- a/app/imports/ui/properties/forms/DamageMultiplierForm.vue
+++ b/app/imports/ui/properties/forms/DamageMultiplierForm.vue
@@ -4,8 +4,7 @@
       label="Name"
       :value="model.name"
       :error-messages="errors.name"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+      @change="change('name', ...arguments)"
     />
     <div class="layout row wrap">
       <smart-select
@@ -16,8 +15,7 @@
         :value="model.damageTypes"
         :error-messages="errors.damageTypes"
         :menu-props="{auto: true, lazy: true}"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['damageTypes'], value, ack})"
+        @change="change('damageTypes', ...arguments)"
       />
       <smart-select
         label="Value"
@@ -26,30 +24,18 @@
         :value="model.value"
         :error-messages="errors.value"
         :menu-props="{auto: true, lazy: true}"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['value'], value, ack})"
+        @change="change('value', ...arguments)"
       />
     </div>
   </div>
 </template>
 
 <script>
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
+  
 	export default {
-		props: {
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
 		data(){return {
+      mixins: [propertyFormMixin],
 			damageTypes: [
         {
 					value: 'bludgeoning',
diff --git a/app/imports/ui/properties/forms/EffectForm.vue b/app/imports/ui/properties/forms/EffectForm.vue
index abe75dc1..42124421 100644
--- a/app/imports/ui/properties/forms/EffectForm.vue
+++ b/app/imports/ui/properties/forms/EffectForm.vue
@@ -4,8 +4,7 @@
       label="Name"
       :value="model.name"
       :error-messages="errors.name"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+      @change="change('name', ...arguments)"
     />
     <div class="layout row wrap justify-start">
       <smart-select
@@ -16,7 +15,7 @@
         :menu-props="{transition: 'slide-y-transition', lazy: true}"
         :items="operations"
         :value="model.operation"
-        @change="(value, ack) => $emit('change', {path: ['operation'], value, ack})"
+        @change="change('operation', ...arguments)"
       >
         <v-icon
           slot="prepend"
@@ -46,8 +45,7 @@
         :disabled="!needsValue"
         :error-messages="errors.calculation"
         :hint="!isFinite(model.calculation) && model.result ? model.result + '' : '' "
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['calculation'], value, ack})"
+        @change="change('calculation', ...arguments)"
       />
     </div>
     <smart-combobox
@@ -59,33 +57,19 @@
       :value="model.stats"
       :items="attributeList"
       :error-messages="errors.stats"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['stats'], value, ack})"
+      @change="change('stats', ...arguments)"
     />
   </div>
 </template>
 
 <script>
 	import getEffectIcon from '/imports/ui/utility/getEffectIcon.js';
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
   import attributeListMixin from '/imports/ui/properties/forms/shared/lists/attributeListMixin.js';
 
 	const ICON_SPIN_DURATION = 300;
 	export default {
-    mixins: [attributeListMixin],
-		props: {
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
+    mixins: [propertyFormMixin, attributeListMixin],
 		data(){ return {
 			displayedIcon: 'add',
 			iconClass: '',
diff --git a/app/imports/ui/properties/forms/ExperienceForm.vue b/app/imports/ui/properties/forms/ExperienceForm.vue
index b1f95c9e..460047df 100644
--- a/app/imports/ui/properties/forms/ExperienceForm.vue
+++ b/app/imports/ui/properties/forms/ExperienceForm.vue
@@ -6,8 +6,7 @@
         style="flex-basis: 300px;"
         :value="model.name"
         :error-messages="errors.name"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+        @change="change('name', ...arguments)"
       />
       <text-field
         label="In-World date"
@@ -15,8 +14,7 @@
         style="flex-basis: 300px;"
         hint="The date in-game that the experience occured"
         :error-messages="errors.worldDate"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['worldDate'], value, ack})"
+        @change="change('worldDate', ...arguments)"
       />
       <date-picker
         label="Real date"
@@ -24,16 +22,14 @@
         style="flex-basis: 300px;"
         hint="Real life date"
         :error-messages="errors.date"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['date'], value, ack})"
+        @change="change('date', ...arguments)"
       />
     </div>
     <text-area
       label="Description"
       :value="model.description"
       :error-messages="errors.description"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['description'], value, ack})"
+      @change="change('description', ...arguments)"
     />
     <div class="layout column align-end">
       <text-field
@@ -43,30 +39,18 @@
         hint="The number of experience points gained from this entry"
         :value="model.value"
         :error-messages="errors.value"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['value'], value, ack})"
+        @change="change('value', ...arguments)"
       />
     </div>
   </div>
 </template>
 
 <script>
-	export default {
-		props: {
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
-	};
+import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
+
+export default {
+  mixins: [propertyFormMixin],
+};
 </script>
 
 <style lang="css" scoped>
diff --git a/app/imports/ui/properties/forms/FeatureForm.vue b/app/imports/ui/properties/forms/FeatureForm.vue
index 61d4b4d3..d52dafd8 100644
--- a/app/imports/ui/properties/forms/FeatureForm.vue
+++ b/app/imports/ui/properties/forms/FeatureForm.vue
@@ -4,44 +4,30 @@
       label="Name"
       :value="model.name"
       :error-messages="errors.name"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+      @change="change('name', ...arguments)"
     />
     <text-area
       label="Summary"
       hint="This will appear in the feature card in the character sheet"
       :value="model.summary"
       :error-messages="errors.summary"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['summary'], value, ack})"
+      @change="change('summary', ...arguments)"
     />
     <text-area
       label="Description"
       hint="The rest of the description that doesn't fit in the summary goes here"
       :value="model.description"
       :error-messages="errors.description"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['description'], value, ack})"
+      @change="change('description', ...arguments)"
     />
   </div>
 </template>
 
 <script>
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
+
 	export default {
-		props: {
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
+    mixins: [propertyFormMixin],
 		data(){ return{
 			enabledOptions: [
 				{
diff --git a/app/imports/ui/properties/forms/FolderForm.vue b/app/imports/ui/properties/forms/FolderForm.vue
index 69157a28..791b8489 100644
--- a/app/imports/ui/properties/forms/FolderForm.vue
+++ b/app/imports/ui/properties/forms/FolderForm.vue
@@ -6,29 +6,17 @@
         style="flex-basis: 300px;"
         :value="model.name"
         :error-messages="errors.name"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+        @change="change('name', ...arguments)"
       />
     </div>
   </div>
 </template>
 
 <script>
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
+
 	export default {
-		props: {
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
+    mixins: [propertyFormMixin],
 	};
 </script>
 
diff --git a/app/imports/ui/properties/forms/ItemConsumedForm.vue b/app/imports/ui/properties/forms/ItemConsumedForm.vue
index 24eb50de..77450787 100644
--- a/app/imports/ui/properties/forms/ItemConsumedForm.vue
+++ b/app/imports/ui/properties/forms/ItemConsumedForm.vue
@@ -6,8 +6,7 @@
       style="flex-basis: 300px;"
       :value="model.tag"
       :error-messages="errors.tag"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['tag'], value, ack})"
+      @change="change('tag', ...arguments)"
     />
     <text-field
       label="Quantity"
@@ -15,27 +14,15 @@
       style="flex-basis: 300px;"
       :value="model.quantity"
       :error-messages="errors.quantity"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['quantity'], value, ack})"
+      @change="change('quantity', ...arguments)"
     />
   </div>
 </template>
 
 <script>
+import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
+
 export default {
-	props: {
-		model: {
-			type: Object,
-			default: () => ({}),
-		},
-		errors: {
-			type: Object,
-			default: () => ({}),
-		},
-    debounceTime: {
-      type: Number,
-      default: undefined,
-    },
-	},
-}
+  mixins: [propertyFormMixin],
+};
 </script>
diff --git a/app/imports/ui/properties/forms/ItemForm.vue b/app/imports/ui/properties/forms/ItemForm.vue
index b948d266..c8cb4cdc 100644
--- a/app/imports/ui/properties/forms/ItemForm.vue
+++ b/app/imports/ui/properties/forms/ItemForm.vue
@@ -1,12 +1,12 @@
 <template lang="html">
   <div class="item-form">
     <div class="layout column align-center">
-      <v-switch
+      <smart-switch
         label="Equipped"
         class="no-flex"
-        :input-value="model.equipped"
+        :value="model.equipped"
         :error-messages="errors.equipped"
-        @change="e => $emit('change', {path: ['equipped'], value: !!e})"
+        @change="change('equipped', ...arguments)"
       />
     </div>
     <div class="layout row wrap">
@@ -14,15 +14,13 @@
         label="Name"
         :value="model.name"
         :error-messages="errors.name"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+        @change="change('name', ...arguments)"
       />
       <text-field
         label="Plural name"
         :value="model.plural"
         :error-messages="errors.plural"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['plural'], value, ack})"
+        @change="change('plural', ...arguments)"
       />
     </div>
     <div class="layout row wrap">
@@ -36,8 +34,7 @@
         style="flex-basis: 300px;"
         :value="model.value"
         :error-messages="errors.value"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['value'], value, ack})"
+        @change="change('value', ...arguments)"
       />
       <text-field
         label="Weight"
@@ -48,8 +45,7 @@
         style="flex-basis: 300px;"
         :value="model.weight"
         :error-messages="errors.weight"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['weight'], value, ack})"
+        @change="change('weight', ...arguments)"
       />
     </div>
     <text-field
@@ -58,25 +54,23 @@
       min="0"
       :value="model.quantity"
       :error-messages="errors.quantity"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['quantity'], value, ack})"
+      @change="change('quantity', ...arguments)"
     />
     <text-area
       label="Description"
       :value="model.description"
       :error-messages="errors.description"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['description'], value, ack})"
+      @change="change('description', ...arguments)"
     />
     <form-section
       name="Advanced"
       standalone
     >
-      <v-switch
+      <smart-switch
         label="Show increment buttons"
-        :input-value="model.showIncrement"
+        :value="model.showIncrement"
         :error-messages="errors.showIncrement"
-        @change="value => $emit('change', {path: ['showIncrement'], value})"
+        @change="change('showIncrement', ...arguments)"
       />
       <smart-combobox
         label="Tags"
@@ -86,25 +80,24 @@
         deletable-chips
         :value="model.tags"
         :error-messages="errors.tags"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['tags'], value, ack})"
+        @change="change('tags', ...arguments)"
       />
-      <v-switch
+      <smart-switch
         label="Requires attunement"
-        :input-value="model.requiresAttunement"
+        :value="model.requiresAttunement"
         :error-messages="errors.requiresAttunement"
-        @change="value => $emit('change', {path: ['requiresAttunement'], value})"
+        @change="change('requiresAttunement', ...arguments)"
       />
       <v-expand-transition>
         <div
           v-show="model.requiresAttunement"
           style="padding-top: 0.1px;"
         >
-          <v-switch
+          <smart-switch
             label="Attuned"
-            :input-value="model.attuned"
+            :value="model.attuned"
             :error-messages="errors.attuned"
-            @change="value => $emit('change', {path: ['attuned'], value})"
+            @change="change('attuned', ...arguments)"
           />
         </div>
       </v-expand-transition>
@@ -114,24 +107,12 @@
 
 <script>
 import FormSection from '/imports/ui/properties/forms/shared/FormSection.vue';
+import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
 export default {
 	components: {
 		FormSection,
 	},
-	props: {
-		model: {
-			type: Object,
-			default: () => ({}),
-		},
-		errors: {
-			type: Object,
-			default: () => ({}),
-		},
-		debounceTime: {
-      type: Number,
-      default: undefined,
-    },
-	},
+  mixins: [propertyFormMixin],
 	}
 </script>
diff --git a/app/imports/ui/properties/forms/ItemsConsumedListForm.vue b/app/imports/ui/properties/forms/ItemsConsumedListForm.vue
index 79f500f7..33b0638f 100644
--- a/app/imports/ui/properties/forms/ItemsConsumedListForm.vue
+++ b/app/imports/ui/properties/forms/ItemsConsumedListForm.vue
@@ -9,7 +9,7 @@
           <div style="flex-grow: 1;">
             <item-consumed-form
               :model="item"
-              @change="({path, value, ack}) => $emit('change', {path: [i, ...path], value, ack})"
+              @change="({path, value, ack}) => change([i, ...path], value, ack)"
             />
           </div>
           <v-btn
@@ -29,20 +29,12 @@
 
 <script>
 	import ItemConsumedForm from '/imports/ui/properties/forms/ItemConsumedForm.vue';
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
 	export default {
 		components: {
 			ItemConsumedForm,
 		},
-		props: {
-			model: {
-				type: Array,
-				default: () => ([]),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
+    mixins: [propertyFormMixin],
 	}
 </script>
diff --git a/app/imports/ui/properties/forms/NoteForm.vue b/app/imports/ui/properties/forms/NoteForm.vue
index 45963f9e..ff71d7c0 100644
--- a/app/imports/ui/properties/forms/NoteForm.vue
+++ b/app/imports/ui/properties/forms/NoteForm.vue
@@ -4,37 +4,21 @@
       label="Name"
       :value="model.name"
       :error-messages="errors.name"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+      @change="change('name', ...arguments)"
     />
     <text-area
       label="Description"
       :value="model.description"
       :error-messages="errors.description"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['description'], value, ack})"
+      @change="change('description', ...arguments)"
     />
   </div>
 </template>
 
 <script>
-	export default {
-		props: {
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
-	};
-</script>
+import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
-<style lang="css" scoped>
-</style>
+export default {
+  mixins: [propertyFormMixin],
+}
+</script>
diff --git a/app/imports/ui/properties/forms/ProficiencyForm.vue b/app/imports/ui/properties/forms/ProficiencyForm.vue
index 76278e3c..2d526355 100644
--- a/app/imports/ui/properties/forms/ProficiencyForm.vue
+++ b/app/imports/ui/properties/forms/ProficiencyForm.vue
@@ -4,8 +4,7 @@
       label="Name"
       :value="model.name"
       :error-messages="errors.name"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+      @change="change('name', ...arguments)"
     />
     <div class="layout row wrap justify-start proficiency-form">
       <smart-combobox
@@ -15,15 +14,14 @@
         :value="model.stats"
         :items="skillList"
         :error-messages="errors.stats"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['stats'], value, ack})"
+        @change="change('stats', ...arguments)"
       />
       <proficiency-select
         label="Proficiency"
         style="flex-basis: 300px;"
         :clearable="false"
         :value="model.value"
-        @change="(value, ack) => $emit('change', {path: ['value'], value, ack})"
+        @change="change('stats', ...arguments)"
       />
     </div>
   </div>
@@ -32,30 +30,13 @@
 <script>
 	import ProficiencySelect from '/imports/ui/properties/forms/shared/ProficiencySelect.vue';
   import skillListMixin from '/imports/ui/properties/forms/shared/lists/skillListMixin.js';
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
 	export default {
 		components: {
 			ProficiencySelect,
 		},
-    mixins: [skillListMixin],
-		props: {
-      model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-			stats: {
-				type: Array,
-        default: () => [],
-			},
-		},
+    mixins: [propertyFormMixin, skillListMixin],
 	};
 </script>
 
diff --git a/app/imports/ui/properties/forms/ResourcesForm.vue b/app/imports/ui/properties/forms/ResourcesForm.vue
index 7c7b8772..f82b5450 100644
--- a/app/imports/ui/properties/forms/ResourcesForm.vue
+++ b/app/imports/ui/properties/forms/ResourcesForm.vue
@@ -53,20 +53,17 @@
 <script>
   import AttributesConsumedListForm from '/imports/ui/properties/forms/AttributesConsumedListForm.vue';
   import ItemsConsumedListForm from '/imports/ui/properties/forms/ItemsConsumedListForm.vue';
-  import ResourcesSchema from '/imports/api/properties/subSchemas/ResourcesSchema.js';
   import ItemConsumedSchema from '/imports/api/properties/subSchemas/ItemConsumedSchema.js';
   import AttributeConsumedSchema from '/imports/api/properties/subSchemas/AttributeConsumedSchema.js';
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
   export default {
     components: {
       AttributesConsumedListForm,
       ItemsConsumedListForm,
     },
+    mixins: [propertyFormMixin],
     props: {
-      model: {
-        type: Object,
-        default: () => (ResourcesSchema.clean({})),
-      },
       parentTarget: {
         type: String,
         default: undefined,
@@ -74,10 +71,6 @@
       buffsStored: {
         type: Boolean,
       },
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
     },
     data(){return {
 			addResourceLoading: false,
diff --git a/app/imports/ui/properties/forms/RollForm.vue b/app/imports/ui/properties/forms/RollForm.vue
index 9e316363..dbec3346 100644
--- a/app/imports/ui/properties/forms/RollForm.vue
+++ b/app/imports/ui/properties/forms/RollForm.vue
@@ -4,19 +4,17 @@
       label="Roll"
       :value="model.roll"
       :error-messages="errors.roll"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['roll'], value, ack})"
+      @change="change('roll', ...arguments)"
     />
     <form-sections>
       <form-section name="Advanced">
-        <v-combobox
+        <smart-combobox
           label="Tags"
           multiple
           chips
           deletable-chips
-          box
           :value="model.tags"
-          @change="(value) => $emit('change', {path: ['tags'], value})"
+          @change="change('tags', ...arguments)"
         />
       </form-section>
     </form-sections>
@@ -25,29 +23,14 @@
 
 <script>
 	import FormSection, {FormSections} from '/imports/ui/properties/forms/shared/FormSection.vue';
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
 	export default {
 		components: {
 			FormSection,
 			FormSections,
 		},
-		props: {
-			stored: {
-				type: Boolean,
-			},
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
+    mixins: [propertyFormMixin],
 		data(){return {
 			addResultLoading: false,
 		}},
diff --git a/app/imports/ui/properties/forms/SavingThrowForm.vue b/app/imports/ui/properties/forms/SavingThrowForm.vue
index 4ce3ef21..ff9871ae 100644
--- a/app/imports/ui/properties/forms/SavingThrowForm.vue
+++ b/app/imports/ui/properties/forms/SavingThrowForm.vue
@@ -4,38 +4,24 @@
       label="DC"
       :value="model.dc"
       :error-messages="errors.dc"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['dc'], value, ack})"
+      @change="change('dc', ...arguments)"
     />
-    <text-field
-      label="Ability"
-      hint="Which ability the saving throw targets"
+    <smart-combobox
+      label="Save"
+      hint="Which save the saving throw targets"
       :value="model.ability"
+      :items="saveList"
       :error-messages="errors.ability"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['ability'], value, ack})"
+      @change="change('ability', ...arguments)"
     />
   </div>
 </template>
 
 <script>
-	export default {
-		props: {
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
-	};
-</script>
+import saveListMixin from '/imports/ui/properties/forms/shared/lists/saveListMixin.js';
+import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
-<style lang="css" scoped>
-</style>
+export default {
+  mixins: [saveListMixin, propertyFormMixin],
+};
+</script>
diff --git a/app/imports/ui/properties/forms/SkillForm.vue b/app/imports/ui/properties/forms/SkillForm.vue
index 1b4b1738..5d1595e6 100644
--- a/app/imports/ui/properties/forms/SkillForm.vue
+++ b/app/imports/ui/properties/forms/SkillForm.vue
@@ -5,8 +5,7 @@
         label="Name"
         :value="model.name"
         :error-messages="errors.name"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+        @change="change('name', ...arguments)"
       />
       <text-field
         label="Variable name"
@@ -14,8 +13,7 @@
         style="flex-basis: 300px;"
         hint="Use this name in formulae to reference this skill"
         :error-messages="errors.variableName"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['variableName'], value, ack})"
+        @change="change('variableName', ...arguments)"
       />
       <smart-combobox
         label="Ability"
@@ -24,8 +22,7 @@
         hint="Which ability is this skill based off of"
         :items="abilityScoreList"
         :error-messages="errors.ability"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['ability'], value, ack})"
+        @change="change('ability', ...arguments)"
       />
     </div>
     <smart-select
@@ -34,15 +31,13 @@
       :value="model.skillType"
       :error-messages="errors.skillType"
       :menu-props="{auto: true, lazy: true}"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['skillType'], value, ack})"
+      @change="change('skillType', ...arguments)"
     />
     <text-area
       label="Description"
       :value="model.description"
       :error-messages="errors.description"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['description'], value, ack})"
+      @change="change('description', ...arguments)"
     />
     <form-section
       name="Advanced"
@@ -56,15 +51,14 @@
           :value="model.baseValue"
           hint="This is the value of the skill before effects are applied"
           :error-messages="errors.baseValue"
-          :debounce-time="debounceTime"
-          @change="(value, ack) => $emit('change', {path: ['baseValue'], value, ack})"
+          @change="change('baseValue', ...arguments)"
         />
         <proficiency-select
           style="flex-basis: 300px;"
           label="Base Proficiency"
           :value="model.baseProficiency"
           :error-messages="errors.baseProficiency"
-          @change="(value, ack) => {$emit('change', {path: ['baseProficiency'], value, ack})}"
+          @change="change('baseProficiency', ...arguments)"
         />
       </div>
     </form-section>
@@ -75,26 +69,14 @@
 	import ProficiencySelect from '/imports/ui/properties/forms/shared/ProficiencySelect.vue';
 	import FormSection from '/imports/ui/properties/forms/shared/FormSection.vue';
   import createListOfProperties from '/imports/ui/properties/forms/shared/lists/createListOfProperties.js';
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
 	export default {
 		components: {
 			ProficiencySelect,
 			FormSection,
 		},
-		props: {
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
+    mixins: [propertyFormMixin],
 		data(){return{
 			skillTypes: [
 				{
diff --git a/app/imports/ui/properties/forms/SpellForm.vue b/app/imports/ui/properties/forms/SpellForm.vue
index b0dec3a1..26216e88 100644
--- a/app/imports/ui/properties/forms/SpellForm.vue
+++ b/app/imports/ui/properties/forms/SpellForm.vue
@@ -4,8 +4,7 @@
       label="Name"
       :value="model.name"
       :error-messages="errors.name"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+      @change="change('name', ...arguments)"
     />
     <div class="layout row wrap">
       <smart-select
@@ -15,8 +14,7 @@
         :items="spellLevels"
         :value="model.level"
         :error-messages="errors.level"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['level'], value, ack})"
+        @change="change('level', ...arguments)"
       />
       <smart-select
         label="School"
@@ -25,94 +23,87 @@
         :items="magicSchools"
         :value="model.school"
         :error-messages="errors.school"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['school'], value, ack})"
+        @change="change('school', ...arguments)"
       />
     </div>
     <div class="layout row wrap">
-      <v-switch
+      <smart-switch
         label="Always prepared"
         style="width: 200px; flex-grow: 0;"
         class="ml-2"
-        :input-value="model.alwaysPrepared"
+        :value="model.alwaysPrepared"
         :error-messages="errors.alwaysPrepared"
-        @change="e => $emit('change', {path: ['alwaysPrepared'], value: !!e})"
+        @change="change('alwaysPrepared', ...arguments)"
       />
     </div>
     <text-field
       label="Casting Time"
       :value="model.castingTime"
       :error-messages="errors.castingTime"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['castingTime'], value, ack})"
+      @change="change('castingTime', ...arguments)"
     />
     <text-field
       label="Range"
       :value="model.range"
       :error-messages="errors.range"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['range'], value, ack})"
+      @change="change('range', ...arguments)"
     />
     <div class="layout row wrap justify-space-between">
-      <v-checkbox
+      <smart-checkbox
         label="Verbal"
-        :input-value="model.verbal"
+        :value="model.verbal"
         :error-messages="errors.verbal"
-        @change="(value) => $emit('change', {path: ['verbal'], value})"
+        @change="change('verbal', ...arguments)"
       />
-      <v-checkbox
+      <smart-checkbox
         label="Somatic"
-        :input-value="model.somatic"
+        :value="model.somatic"
         :error-messages="errors.somatic"
-        @change="(value) => $emit('change', {path: ['somatic'], value})"
+        @change="change('somatic', ...arguments)"
       />
-      <v-checkbox
+      <smart-checkbox
         label="Concentration"
-        :input-value="model.concentration"
+        :value="model.concentration"
         :error-messages="errors.concentration"
-        @change="(value) => $emit('change', {path: ['concentration'], value})"
+        @change="change('concentration', ...arguments)"
       />
-      <v-checkbox
+      <smart-checkbox
         label="Ritual"
-        :input-value="model.ritual"
+        :value="model.ritual"
         :error-messages="errors.ritual"
-        @change="(value) => $emit('change', {path: ['ritual'], value})"
+        @change="change('ritual', ...arguments)"
       />
     </div>
     <text-field
       label="Material"
       :value="model.material"
       :error-messages="errors.material"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['material'], value, ack})"
+      @change="change('material', ...arguments)"
     />
     <text-field
       label="Duration"
       :value="model.duration"
       :error-messages="errors.duration"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['duration'], value, ack})"
+      @change="change('duration', ...arguments)"
     />
     <text-area
       label="Description"
       :value="model.description"
       :error-messages="errors.description"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['description'], value, ack})"
+      @change="change('description', ...arguments)"
     />
     <form-sections>
       <form-section
         name="Advanced"
       >
-        <v-combobox
+        <smart-combobox
           label="Spell lists"
           multiple
           chips
           deletable-chips
-          box
           :value="model.spellLists"
           :error-messages="errors.spellLists"
-          @change="(value) => $emit('change', {path: ['spellLists'], value})"
+          @change="change('spellLists', ...arguments)"
         />
       </form-section>
       <form-section
@@ -130,6 +121,7 @@
 <script>
 	import FormSection, { FormSections } from '/imports/ui/properties/forms/shared/FormSection.vue';
   import ActionForm from '/imports/ui/properties/forms/ActionForm.vue'
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
 
 	export default {
 		components: {
@@ -137,20 +129,7 @@
 			FormSection,
       ActionForm,
 		},
-		props: {
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
+    mixins: [propertyFormMixin],
 		data(){return {
 			magicSchools: [
 				{
diff --git a/app/imports/ui/properties/forms/SpellListForm.vue b/app/imports/ui/properties/forms/SpellListForm.vue
index b6b414a9..f9f44511 100644
--- a/app/imports/ui/properties/forms/SpellListForm.vue
+++ b/app/imports/ui/properties/forms/SpellListForm.vue
@@ -5,45 +5,31 @@
         label="Name"
         :value="model.name"
         :error-messages="errors.name"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+        @change="change('name', ...arguments)"
       />
     </div>
     <text-area
       label="Description"
       :value="model.description"
       :error-messages="errors.description"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['description'], value, ack})"
+      @change="change('description', ...arguments)"
     />
     <text-field
       label="Maximum prepared spells"
       :value="model.maxPrepared"
       hint="How many spells can be prepared"
       :error-messages="errors.maxPrepared"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['maxPrepared'], value, ack})"
+      @change="change('maxPrepared', ...arguments)"
     />
   </div>
 </template>
 
 <script>
-	export default {
-		props: {
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
-	};
+import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
+
+export default {
+  mixins: [propertyFormMixin],
+};
 </script>
 
 <style lang="css" scoped>
diff --git a/app/imports/ui/properties/forms/ToggleForm.vue b/app/imports/ui/properties/forms/ToggleForm.vue
index 191d582a..fd7bd63e 100644
--- a/app/imports/ui/properties/forms/ToggleForm.vue
+++ b/app/imports/ui/properties/forms/ToggleForm.vue
@@ -4,8 +4,7 @@
       label="Name"
       :value="model.name"
       :error-messages="errors.name"
-      :debounce-time="debounceTime"
-      @change="(value, ack) => $emit('change', {path: ['name'], value, ack})"
+      @change="change('name', ...arguments)"
     />
     <v-layout
       column
@@ -35,29 +34,17 @@
         label="Condition"
         :value="model.condition"
         :error-messages="errors.condition"
-        :debounce-time="debounceTime"
-        @change="(value, ack) => $emit('change', {path: ['condition'], value, ack})"
+        @change="change('condition', ...arguments)"
       />
     </v-fade-transition>
   </div>
 </template>
 
 <script>
+  import propertyFormMixin from '/imports/ui/properties/forms/shared/propertyFormMixin.js';
+
 	export default {
-		props: {
-			model: {
-				type: Object,
-				default: () => ({}),
-			},
-			errors: {
-				type: Object,
-				default: () => ({}),
-			},
-      debounceTime: {
-        type: Number,
-        default: undefined,
-      },
-		},
+    mixins: [propertyFormMixin],
     computed: {
       radioSelection(){
         if (this.model.disabled){
diff --git a/app/imports/ui/properties/forms/shared/lists/saveListMixin.js b/app/imports/ui/properties/forms/shared/lists/saveListMixin.js
new file mode 100644
index 00000000..035817f6
--- /dev/null
+++ b/app/imports/ui/properties/forms/shared/lists/saveListMixin.js
@@ -0,0 +1,11 @@
+import createListOfProperties from '/imports/ui/properties/forms/shared/lists/createListOfProperties.js'
+
+const saveListMixin = {
+  meteor: {
+    saveList(){
+      return createListOfProperties({type: 'skill', skillType: 'save'});
+    },
+  },
+};
+
+export default saveListMixin;
diff --git a/app/imports/ui/properties/forms/shared/propertyFormMixin.js b/app/imports/ui/properties/forms/shared/propertyFormMixin.js
new file mode 100644
index 00000000..0d697a87
--- /dev/null
+++ b/app/imports/ui/properties/forms/shared/propertyFormMixin.js
@@ -0,0 +1,20 @@
+export default {
+  props: {
+    model: {
+      type: Object,
+      default: () => ({}),
+    },
+    errors: {
+      type: Object,
+      default: () => ({}),
+    },
+  },
+  methods: {
+    change(path, value, ack){
+      if (!Array.isArray(path)){
+        path = [path];
+      }
+      this.$emit('change', {path, value, ack});
+    }
+  }
+}
diff --git a/app/imports/ui/properties/viewers/AttributeViewer.vue b/app/imports/ui/properties/viewers/AttributeViewer.vue
index cd0c93f3..f17b4abb 100644
--- a/app/imports/ui/properties/viewers/AttributeViewer.vue
+++ b/app/imports/ui/properties/viewers/AttributeViewer.vue
@@ -44,7 +44,7 @@
     />
 
     <effect-viewer
-      v-if="computationContext.creature && model.baseValueCalculation"
+      v-if="context.creature && model.baseValueCalculation"
       :model="{
         name: 'Base value',
         result: model.baseValue,
@@ -67,7 +67,7 @@
 
 	export default {
     inject: {
-      computationContext: { default: {} }
+      context: { default: {} }
     },
 		components: {
 			EffectViewer,
@@ -93,8 +93,8 @@
 		},
     meteor: {
       effects(){
-        if (this.computationContext.creature){
-          let creatureId = this.computationContext.creature._id;
+        if (this.context.creature){
+          let creatureId = this.context.creature._id;
           return CreatureProperties.find({
             'ancestors.id': creatureId,
             'stats': this.model.variableName,
diff --git a/app/imports/ui/properties/viewers/SkillViewer.vue b/app/imports/ui/properties/viewers/SkillViewer.vue
index 03c78338..1e3c2160 100644
--- a/app/imports/ui/properties/viewers/SkillViewer.vue
+++ b/app/imports/ui/properties/viewers/SkillViewer.vue
@@ -40,7 +40,7 @@
     />
 
     <effect-viewer
-      v-if="computationContext.creature && model.baseValue"
+      v-if="context.creature && model.baseValue"
       :model="{
         name: 'Base value',
         result: model.baseValue,
@@ -67,7 +67,7 @@ export default {
   },
 	mixins: [propertyViewerMixin],
   inject: {
-    computationContext: { default: {} }
+    context: { default: {} }
   },
   computed: {
     displayedModifier(){
@@ -96,8 +96,8 @@ export default {
   },
   meteor: {
     effects(){
-      if (this.computationContext.creature){
-        let creatureId = this.computationContext.creature._id;
+      if (this.context.creature){
+        let creatureId = this.context.creature._id;
         return CreatureProperties.find({
           'ancestors.id': creatureId,
           stats: this.model.variableName,