From 8abf32ae420d9fcc31e282f56de9580d0e585abe Mon Sep 17 00:00:00 2001
From: Ricky Harkins <ricky.harkins@swarmsolutions.com>
Date: Tue, 17 Sep 2019 12:08:58 -0500
Subject: [PATCH 1/5] Set disabled flags on inputs

---
 inputs/abutton.vue                  | 3 ++-
 inputs/autocomplete.vue             | 4 ++--
 inputs/checkbox-group.vue           | 3 ++-
 inputs/checkbox.vue                 | 4 ++--
 inputs/complex-list.vue             | 4 ++--
 inputs/datepicker.vue               | 4 ++--
 inputs/inline.vue                   | 4 ++--
 inputs/radio.vue                    | 3 ++-
 inputs/range.vue                    | 4 +++-
 inputs/segmented-button-segment.vue | 4 ++--
 inputs/segmented-button.vue         | 5 ++++-
 inputs/select.vue                   | 3 ++-
 inputs/simple-list-input.vue        | 4 +++-
 inputs/simple-list.vue              | 4 ++--
 inputs/text.vue                     | 4 ++--
 inputs/timepicker.vue               | 3 ++-
 inputs/wysiwyg.vue                  | 4 ++++
 lib/forms/field.vue                 | 2 +-
 18 files changed, 41 insertions(+), 25 deletions(-)

diff --git a/inputs/abutton.vue b/inputs/abutton.vue
index d25324c7a..8d5d3c04e 100644
--- a/inputs/abutton.vue
+++ b/inputs/abutton.vue
@@ -4,6 +4,7 @@
       color="default"
       type="secondary"
       :ariaLabel="args.tooltip"
+      :disabled="disabled"
       :icon="args.icon || 'check_circle'"
       :loading="loading"
       :tooltip="args.tooltip"
@@ -18,7 +19,7 @@
   import { revealProp } from '../lib/utils/references';
 
   export default {
-    props: ['name', 'data', 'schema', 'args', 'initialFocus'],
+    props: ['name', 'data', 'schema', 'args', 'initialFocus', 'disabled'],
     components: { UiIconButton },
     data() {
       return {
diff --git a/inputs/autocomplete.vue b/inputs/autocomplete.vue
index 74860a5f7..58c4c72c4 100644
--- a/inputs/autocomplete.vue
+++ b/inputs/autocomplete.vue
@@ -1,5 +1,5 @@
 <template>
-  <ol class="autocomplete" v-if="showMatches">
+  <ol class="autocomplete" v-if="showMatches && !disabled">
     <li v-for="(match, index) in matches">
       <item
         :index="index"
@@ -19,7 +19,7 @@
   import { getProp, removeListItem } from '../lib/lists/helpers';
 
   export default {
-    props: ['args', 'select', 'query', 'focusIndex', 'updateFocusIndex', 'updateMatches', 'unselect'],
+    props: ['args', 'select', 'query', 'focusIndex', 'updateFocusIndex', 'updateMatches', 'unselect', 'disabled'],
     data() {
       return {
         localIndex: null,
diff --git a/inputs/checkbox-group.vue b/inputs/checkbox-group.vue
index 83e9b5b73..c36008c5e 100644
--- a/inputs/checkbox-group.vue
+++ b/inputs/checkbox-group.vue
@@ -70,6 +70,7 @@
     :help="args.help"
     :error="errorMessage"
     :invalid="isInvalid"
+    :disabled="disabled"
     v-dynamic-events="customEvents"
     @input="update"></ui-checkbox-group>
   </div>
@@ -88,7 +89,7 @@
 
   export default {
     mixins: [DynamicEvents],
-    props: ['name', 'data', 'schema', 'args'],
+    props: ['name', 'data', 'schema', 'args', 'disabled'],
     data() {
       return {
         isVertical: true
diff --git a/inputs/checkbox.vue b/inputs/checkbox.vue
index 1d4e9bc5a..445243b2d 100644
--- a/inputs/checkbox.vue
+++ b/inputs/checkbox.vue
@@ -33,6 +33,7 @@
       :name="name"
       :label="label"
       :value="data"
+      :disabled="disabled"
       @input="update"
       v-dynamic-events="customEvents">
     </ui-checkbox>
@@ -40,7 +41,6 @@
       <div class="ui-textbox__feedback-text">{{ args.help }}</div>
     </div>
   </div>
-</div>
 </template>
 
 <script>
@@ -51,7 +51,7 @@
 
   export default {
     mixins: [DynamicEvents],
-    props: ['name', 'data', 'schema', 'args'],
+    props: ['name', 'data', 'schema', 'args', 'disabled'],
     data() {
       return {};
     },
diff --git a/inputs/complex-list.vue b/inputs/complex-list.vue
index 2199b518e..93b7546e1 100644
--- a/inputs/complex-list.vue
+++ b/inputs/complex-list.vue
@@ -77,7 +77,7 @@
         </item>
       </transition-group>
     </div>
-    <ui-button v-else buttonType="button" color="accent" icon="add" @click.stop.prevent="addItem(-1)">Add Items</ui-button>
+    <ui-button v-else buttonType="button" color="accent" icon="add" :disabled="disabled" @click.stop.prevent="addItem(-1)">Add Items</ui-button>
   </transition>
 </template>
 
@@ -144,7 +144,7 @@
 
   export default {
     mixins: [DynamicEvents],
-    props: ['name', 'data', 'schema', 'args', 'initialFocus'],
+    props: ['name', 'data', 'schema', 'args', 'initialFocus', 'disabled'],
     data() {
       return {
         currentItem: _.isArray(this.data) ? this.data.length - 1 : 0,
diff --git a/inputs/datepicker.vue b/inputs/datepicker.vue
index b243014f6..4220aa471 100644
--- a/inputs/datepicker.vue
+++ b/inputs/datepicker.vue
@@ -31,7 +31,7 @@
     :floatingLabel="true"
     :help="args.help"
     :error="errorMessage"
-    :disabled="isDisabled"
+    :disabled="isDisabled || disabled"
     iconPosition="right"
     v-dynamic-events="customEvents"
     @input="update">
@@ -52,7 +52,7 @@
 
   export default {
     mixins: [DynamicEvents],
-    props: ['name', 'data', 'schema', 'args'],
+    props: ['name', 'data', 'schema', 'args', 'disabled'],
     data() {
       return {
         isDisabled: false
diff --git a/inputs/inline.vue b/inputs/inline.vue
index f1359dc4c..63453010e 100644
--- a/inputs/inline.vue
+++ b/inputs/inline.vue
@@ -5,7 +5,7 @@
 </docs>
 
 <template>
-  <wysiwyg :name="name" :data="data" :schema="schema" :args="args" :initialFocus="initialFocus"  v-dynamic-events="customEvents" />
+  <wysiwyg :name="name" :data="data" :schema="schema" :args="args" :initialFocus="initialFocus" :disabled="disabled" v-dynamic-events="customEvents" />
 </template>
 
 <script>
@@ -14,7 +14,7 @@
 
   export default {
     mixins: [DynamicEvents],
-    props: ['name', 'data', 'schema', 'args', 'initialFocus'],
+    props: ['name', 'data', 'schema', 'args', 'initialFocus', 'disabled'],
     data() {
       return {
         value: null
diff --git a/inputs/radio.vue b/inputs/radio.vue
index 7832491a6..6922318b7 100644
--- a/inputs/radio.vue
+++ b/inputs/radio.vue
@@ -60,6 +60,7 @@
     :options="options"
     :vertical="isVertical"
     :help="args.help"
+    :disabled="disabled"
     :error="errorMessage"
     :invalid="isInvalid"
     @input="update"
@@ -79,7 +80,7 @@
 
   export default {
     mixins: [DynamicEvents],
-    props: ['name', 'data', 'schema', 'args'],
+    props: ['name', 'data', 'schema', 'args', 'disabled'],
     data() {
       return {
         isVertical: true // todo: allow setting this in the args
diff --git a/inputs/range.vue b/inputs/range.vue
index 95dfa78e4..4d42abebf 100644
--- a/inputs/range.vue
+++ b/inputs/range.vue
@@ -97,7 +97,7 @@
 
   export default {
     mixins: [DynamicEvents],
-    props: ['name', 'data', 'schema', 'args'],
+    props: ['name', 'data', 'schema', 'args', 'disabled'],
     data() {
       return {
         values: this.data || this.isDualPoint ? [0, 0] : 0
@@ -230,6 +230,8 @@
           el.noUiSlider.on(key, this.schema.events[key]);
         });
       }
+
+      slider.setAttribute('disabled', this.disabled);
     }
   };
 </script>
diff --git a/inputs/segmented-button-segment.vue b/inputs/segmented-button-segment.vue
index 0c99d263d..ba37c0795 100644
--- a/inputs/segmented-button-segment.vue
+++ b/inputs/segmented-button-segment.vue
@@ -1,5 +1,5 @@
 <template>
-  <button class="segmented-button-segment" type="button" :class="{ 'is-checked': option.checked }" :id="option.id" :ref="option.id" :name="name" @click.stop.prevent="$emit('update', option.value)">
+  <button class="segmented-button-segment" type="button" :class="{ 'is-checked': option.checked }" :id="option.id" :ref="option.id" :name="name" :disabled="disabled" @click.stop.prevent="$emit('update', option.value)">
     <ui-icon v-if="option.hasMaterialIcon" :icon="option.icon"></ui-icon>
     <img v-else-if="option.hasImgIcon" class="segmented-button-img" :src="option.icon" :alt="option.text" />
     <span v-else class="segmented-button-text">{{ option.text }}</span>
@@ -14,7 +14,7 @@
   import UiRippleInk from 'keen/UiRippleInk';
 
   export default {
-    props: ['name', 'option', 'update'],
+    props: ['name', 'option', 'update', 'disabled'],
     data() {
       return {};
     },
diff --git a/inputs/segmented-button.vue b/inputs/segmented-button.vue
index 9d46d1efb..78b6bb2d8 100644
--- a/inputs/segmented-button.vue
+++ b/inputs/segmented-button.vue
@@ -28,6 +28,7 @@
           :key="optionIndex"
           :name="name"
           :option="option"
+          :disabled="disabled"
           @update="update"
           v-dynamic-events="customEvents"></segmented-button-segment>
       </div>
@@ -51,7 +52,7 @@
 
   export default {
     mixins: [DynamicEvents],
-    props: ['name', 'data', 'schema', 'args'],
+    props: ['name', 'data', 'schema', 'args', 'disabled'],
     data() {
       return {};
     },
@@ -63,6 +64,8 @@
         const data = this.data,
           assetLocation = _.get(this.$store, 'state.site.assetHost') || _.get(this.$store, 'state.site.assetPath');
 
+        console.log('options', this.args.options);
+
         return _.map(this.args.options, (option) => {
           const hasImgIcon = option.icon && _.head(option.icon) === '/',
             hasMaterialIcon = option.icon && _.head(option.icon) !== '/';
diff --git a/inputs/select.vue b/inputs/select.vue
index 01b06592e..c7e1d182e 100644
--- a/inputs/select.vue
+++ b/inputs/select.vue
@@ -83,6 +83,7 @@
     :label="label"
     :floatingLabel="true"
     :help="args.help"
+    :disabled="disabled"
     :error="errorMessage"
     :invalid="isInvalid"
     iconPosition="right"
@@ -109,7 +110,7 @@
 
   export default {
     mixins: [DynamicEvents],
-    props: ['name', 'data', 'schema', 'args'],
+    props: ['name', 'data', 'schema', 'args', 'disabled'],
     data() {
       return {
         listOptions: [],
diff --git a/inputs/simple-list-input.vue b/inputs/simple-list-input.vue
index cfe88e7da..1f2b2b2e6 100644
--- a/inputs/simple-list-input.vue
+++ b/inputs/simple-list-input.vue
@@ -22,6 +22,7 @@
       type="text"
       class="ui-textbox__input simple-list-add"
       ref="input"
+      :disabled="disabled"
       v-model.trim="val"
       @input="onChange"
       @keydown.enter.prevent="onEnter"
@@ -40,6 +41,7 @@
       v-if="showAutocomplete"
       :args="autocomplete"
       :query="val"
+      :disabled="disabled"
       :focusIndex="autocompleteIndex"
       :updateFocusIndex="updateFocusIndex"
       :updateMatches="updateAutocompleteMatches"
@@ -55,7 +57,7 @@
   import autocomplete from './autocomplete.vue';
 
   export default {
-    props: ['items', 'allowRepeatedItems', 'autocomplete', 'currentItem', 'disabled', 'isInitialFocus', 'ignoreComma'],
+    props: ['items', 'allowRepeatedItems', 'autocomplete', 'currentItem', 'disabled', 'isInitialFocus', 'ignoreComma', 'disabled'],
     data() {
       return {
         val: '',
diff --git a/inputs/simple-list.vue b/inputs/simple-list.vue
index 11acfa417..a303bbb2f 100644
--- a/inputs/simple-list.vue
+++ b/inputs/simple-list.vue
@@ -77,7 +77,7 @@
             :autocomplete="args.autocomplete"
             :ignoreComma="args.ignoreComma"
             :currentItem="currentItem"
-            :disabled="isDisabled"
+            :disabled="isDisabled || disabled"
             :isInitialFocus="initialFocus === name"
             @add="addItem"
             @select="selectItem"
@@ -115,7 +115,7 @@
 
   export default {
     mixins: [DynamicEvents],
-    props: ['name', 'data', 'schema', 'args', 'initialFocus'],
+    props: ['name', 'data', 'schema', 'args', 'initialFocus', 'disabled'],
     data() {
       return {
         isActive: false,
diff --git a/inputs/text.vue b/inputs/text.vue
index b454cab8a..049347504 100644
--- a/inputs/text.vue
+++ b/inputs/text.vue
@@ -44,7 +44,7 @@
     :floatingLabel="true"
     :help="args.help"
     :error="errorMessage"
-    :disabled="isDisabled"
+    :disabled="isDisabled || disabled"
     iconPosition="right"
     v-dynamic-events="customEvents"
     @input="update"
@@ -77,7 +77,7 @@
 
   export default {
     mixins: [DynamicEvents],
-    props: ['name', 'data', 'schema', 'args', 'initialFocus'],
+    props: ['name', 'data', 'schema', 'args', 'initialFocus', 'disabled'],
     data() {
       return {
         isDisabled: false,
diff --git a/inputs/timepicker.vue b/inputs/timepicker.vue
index aecf90c9a..11d2a9938 100644
--- a/inputs/timepicker.vue
+++ b/inputs/timepicker.vue
@@ -31,6 +31,7 @@
     :name="name"
     :schema="schema"
     :args="args"
+    :disabled="disabled"
     v-dynamic-events="customEvents"
     @update="update">
   </timepicker>
@@ -48,7 +49,7 @@
 
   export default {
     mixins: [DynamicEvents],
-    props: ['name', 'data', 'schema', 'args'],
+    props: ['name', 'data', 'schema', 'args', 'disabled'],
     data() {
       return {};
     },
diff --git a/inputs/wysiwyg.vue b/inputs/wysiwyg.vue
index d97b69294..7a78f56d6 100644
--- a/inputs/wysiwyg.vue
+++ b/inputs/wysiwyg.vue
@@ -695,6 +695,10 @@
         }
       });
 
+      if (this.schema.disabled) {
+        editor.disable();
+      }
+
       if (this.schema.events && _.isObject(this.schema.events)) {
         Object.keys(this.schema.events).forEach((key) => {
           editor.on(key, this.schema.events[key]);
diff --git a/lib/forms/field.vue b/lib/forms/field.vue
index a96781e38..701a6c58b 100644
--- a/lib/forms/field.vue
+++ b/lib/forms/field.vue
@@ -1,7 +1,7 @@
 <template>
   <transition name="reveal" mode="out-in" @after-enter="onRevealResize">
     <fieldset class="kiln-field" :style="{ minHeight: minHeight }" v-if="inputName && isShown" :disabled="isDisabled">
-      <component :is="inputName" :name="name" :data="data" :schema="schema" :args="expandedInput" :initialFocus="initialFocus" @resize="onResize"></component>
+      <component :is="inputName" :name="name" :data="data" :schema="schema" :args="expandedInput" :initialFocus="initialFocus" :disabled="isDisabled" @resize="onResize"></component>
     </fieldset>
   </transition>
 </template>

From be40e11ef3ba850329ccd723b587454953bc73fb Mon Sep 17 00:00:00 2001
From: Ricky Harkins <ricky.harkins@swarmsolutions.com>
Date: Wed, 18 Sep 2019 10:31:44 -0500
Subject: [PATCH 2/5] Fixing slider disabled

---
 inputs/range.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/inputs/range.vue b/inputs/range.vue
index 4d42abebf..a172dae4c 100644
--- a/inputs/range.vue
+++ b/inputs/range.vue
@@ -231,7 +231,9 @@
         });
       }
 
-      slider.setAttribute('disabled', this.disabled);
+      if (this.disabled) {
+        el.setAttribute('disabled', this.disabled);
+      }
     }
   };
 </script>

From ef586c968c5e9b37b9692ef0ae2c37525b2e2dc0 Mon Sep 17 00:00:00 2001
From: Ricky Harkins <ricky.harkins@swarmsolutions.com>
Date: Mon, 7 Oct 2019 11:47:13 -0500
Subject: [PATCH 3/5] Remove console.log

---
 inputs/segmented-button.vue | 2 --
 1 file changed, 2 deletions(-)

diff --git a/inputs/segmented-button.vue b/inputs/segmented-button.vue
index 78b6bb2d8..cda7f295e 100644
--- a/inputs/segmented-button.vue
+++ b/inputs/segmented-button.vue
@@ -64,8 +64,6 @@
         const data = this.data,
           assetLocation = _.get(this.$store, 'state.site.assetHost') || _.get(this.$store, 'state.site.assetPath');
 
-        console.log('options', this.args.options);
-
         return _.map(this.args.options, (option) => {
           const hasImgIcon = option.icon && _.head(option.icon) === '/',
             hasMaterialIcon = option.icon && _.head(option.icon) !== '/';

From aabd95e945d1cb62881630c273b36cc293fbaaac Mon Sep 17 00:00:00 2001
From: rhark1 <48920257+rhark1@users.noreply.github.com>
Date: Tue, 29 Oct 2019 12:50:28 -0500
Subject: [PATCH 4/5] Update inputs/simple-list-input.vue

Co-Authored-By: MariaFdezJ <mariafernandez@intellisys.com.do>
---
 inputs/simple-list-input.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/inputs/simple-list-input.vue b/inputs/simple-list-input.vue
index 1f2b2b2e6..731687cc3 100644
--- a/inputs/simple-list-input.vue
+++ b/inputs/simple-list-input.vue
@@ -57,7 +57,7 @@
   import autocomplete from './autocomplete.vue';
 
   export default {
-    props: ['items', 'allowRepeatedItems', 'autocomplete', 'currentItem', 'disabled', 'isInitialFocus', 'ignoreComma', 'disabled'],
+    props: ['items', 'allowRepeatedItems', 'autocomplete', 'currentItem', 'disabled', 'isInitialFocus', 'ignoreComma'],
     data() {
       return {
         val: '',

From a4b1460ca243670fe1340f64bcfc48b84fcee043 Mon Sep 17 00:00:00 2001
From: Ricky Harkins <ricky.harkins@swarmsolutions.com>
Date: Tue, 12 Nov 2019 15:49:20 -0600
Subject: [PATCH 5/5] Refactor disable on wysiwyg and range

---
 inputs/range.vue   | 6 +-----
 inputs/wysiwyg.vue | 4 ++--
 2 files changed, 3 insertions(+), 7 deletions(-)

diff --git a/inputs/range.vue b/inputs/range.vue
index a172dae4c..8f6ce5635 100644
--- a/inputs/range.vue
+++ b/inputs/range.vue
@@ -37,7 +37,7 @@
     <div class="ui-textbox__content">
       <label class="ui-textbox__label">
         <div class="ui-textbox__label-text is-floating">{{ label }}</div>
-        <div class="editor-range-input"></div>
+        <div class="editor-range-input" :disabled="disabled"></div>
       </label>
 
       <div class="ui-textbox__feedback" v-if="hasFeedback || showError">
@@ -230,10 +230,6 @@
           el.noUiSlider.on(key, this.schema.events[key]);
         });
       }
-
-      if (this.disabled) {
-        el.setAttribute('disabled', this.disabled);
-      }
     }
   };
 </script>
diff --git a/inputs/wysiwyg.vue b/inputs/wysiwyg.vue
index 7a78f56d6..d8c18e49a 100644
--- a/inputs/wysiwyg.vue
+++ b/inputs/wysiwyg.vue
@@ -181,7 +181,7 @@
 
   export default {
     mixins: [DynamicEvents],
-    props: ['name', 'data', 'schema', 'args', 'initialFocus'],
+    props: ['name', 'data', 'schema', 'args', 'initialFocus', 'disabled'],
     data() {
       return {
         editorData: this.data || '',
@@ -695,7 +695,7 @@
         }
       });
 
-      if (this.schema.disabled) {
+      if (this.disabled) {
         editor.disable();
       }