From 1bd546758e97dd8b36e91520fc9f68b01abd0bcd Mon Sep 17 00:00:00 2001
From: "Manu Mtz.-Almeida" <manu.mtza@gmail.com>
Date: Wed, 9 May 2018 17:13:27 +0200
Subject: [PATCH] fix(inputs): interactive css to rule all them

---
 core/src/components/datetime/datetime.tsx               | 2 +-
 core/src/components/input/input.tsx                     | 1 +
 core/src/components/item-divider/item-divider.md.scss   | 2 +-
 core/src/components/item/item.md.scss                   | 4 ++--
 core/src/components/label/label.ios.scss                | 8 ++------
 core/src/components/label/label.md.scss                 | 8 ++------
 core/src/components/list/list.md.scss                   | 2 +-
 core/src/components/select/select.tsx                   | 2 +-
 core/src/components/select/test/single-value/index.html | 1 -
 core/src/components/textarea/textarea.tsx               | 1 +
 10 files changed, 12 insertions(+), 19 deletions(-)

diff --git a/core/src/components/datetime/datetime.tsx b/core/src/components/datetime/datetime.tsx
index 7f9389b8d9..33d7e0f551 100644
--- a/core/src/components/datetime/datetime.tsx
+++ b/core/src/components/datetime/datetime.tsx
@@ -240,7 +240,7 @@ export class Datetime {
 
   private emitStyle() {
     this.ionStyle.emit({
-      'input': true,
+      'interactive': true,
       'datetime': true,
       'datetime-disabled': this.disabled,
       'input-has-value': this.hasValue()
diff --git a/core/src/components/input/input.tsx b/core/src/components/input/input.tsx
index 5d359759b9..9676459dd6 100644
--- a/core/src/components/input/input.tsx
+++ b/core/src/components/input/input.tsx
@@ -237,6 +237,7 @@ export class Input implements InputComponent {
 
   private emitStyle() {
     this.ionStyle.emit({
+      'interactive': true,
       'input': true,
       'input-disabled': this.disabled,
       'input-has-value': this.hasValue(),
diff --git a/core/src/components/item-divider/item-divider.md.scss b/core/src/components/item-divider/item-divider.md.scss
index 3ce6dda28a..c044404623 100644
--- a/core/src/components/item-divider/item-divider.md.scss
+++ b/core/src/components/item-divider/item-divider.md.scss
@@ -35,7 +35,7 @@
 }
 
 .item-divider-md ion-icon[slot="start"] + .item-inner,
-.item-divider-md ion-icon[slot="start"] + .item-input {
+.item-divider-md ion-icon[slot="start"] + .item-interactive {
   @include margin-horizontal($item-md-padding-start + ($item-md-padding-start / 2), null);
 }
 
diff --git a/core/src/components/item/item.md.scss b/core/src/components/item/item.md.scss
index e4bde9b956..827cb083ac 100644
--- a/core/src/components/item/item.md.scss
+++ b/core/src/components/item/item.md.scss
@@ -77,7 +77,7 @@
 }
 
 // Default input items have a border
-.item-md.item-input {
+.item-md.item-interactive {
   border-bottom-width: $item-md-border-bottom-width;
 }
 
@@ -127,7 +127,7 @@
 }
 
 .item-md > ion-icon[slot="start"] + .item-inner,
-.item-md > ion-icon[slot="start"] + .item-input {
+.item-md > ion-icon[slot="start"] + .item-interactive {
   @include margin-horizontal($item-md-padding-start + ($item-md-padding-start / 2), null);
 }
 
diff --git a/core/src/components/label/label.ios.scss b/core/src/components/label/label.ios.scss
index 22ba29246b..78e30eddb1 100644
--- a/core/src/components/label/label.ios.scss
+++ b/core/src/components/label/label.ios.scss
@@ -19,9 +19,7 @@
 // iOS Default Label Inside An Input/Select Item
 // --------------------------------------------------
 
-.item-input .label-ios,
-.item-select .label-ios,
-.item-datetime .label-ios {
+.item-interactive .label-ios {
   color: $label-ios-text-color;
 }
 
@@ -61,9 +59,7 @@
   $color-base: ion-color($colors-ios, $color-name, base, ios);
 
   .label-ios-#{$color-name},
-  .item-input .label-ios-#{$color-name},
-  .item-select .label-ios-#{$color-name},
-  .item-datetime .label-ios-#{$color-name} {
+  .item-interactive .label-ios-#{$color-name} {
     color: $color-base;
   }
 }
diff --git a/core/src/components/label/label.md.scss b/core/src/components/label/label.md.scss
index 8f332606bc..dd83b5d521 100644
--- a/core/src/components/label/label.md.scss
+++ b/core/src/components/label/label.md.scss
@@ -19,9 +19,7 @@
 // Material Design Default Label Inside An Input/Select Item
 // --------------------------------------------------
 
-.item-input .label-md,
-.item-select .label-md,
-.item-datetime .label-md {
+.item-interactive .label-md {
   color: $label-md-text-color;
 }
 
@@ -63,9 +61,7 @@
   $color-base: ion-color($colors-md, $color-name, base, md);
 
   .label-md-#{$color-name},
-  .item-input .label-md-#{$color-name},
-  .item-select .label-md-#{$color-name},
-  .item-datetime .label-md-#{$color-name} {
+  .item-interactive .label-md-#{$color-name} {
     color: $color-base;
   }
 }
diff --git a/core/src/components/list/list.md.scss b/core/src/components/list/list.md.scss
index e1e89d6508..864582397a 100644
--- a/core/src/components/list/list.md.scss
+++ b/core/src/components/list/list.md.scss
@@ -36,7 +36,7 @@
   border-bottom-width: 0;
 }
 
-.list-md[inset] .item-input {
+.list-md[inset] .item-interactive {
   @include padding-horizontal(0);
 }
 
diff --git a/core/src/components/select/select.tsx b/core/src/components/select/select.tsx
index d418c985e7..91942fa8c8 100644
--- a/core/src/components/select/select.tsx
+++ b/core/src/components/select/select.tsx
@@ -443,7 +443,7 @@ export class Select {
 
   private emitStyle() {
     this.ionStyle.emit({
-      'input': true,
+      'interactive': true,
       'select': true,
       'select-disabled': this.disabled,
       'input-has-value': this.hasValue()
diff --git a/core/src/components/select/test/single-value/index.html b/core/src/components/select/test/single-value/index.html
index bfeb55eea7..54980787a1 100644
--- a/core/src/components/select/test/single-value/index.html
+++ b/core/src/components/select/test/single-value/index.html
@@ -193,7 +193,6 @@
         year.appendChild(option);
       }
 
-      debugger;
       year.componentOnReady().then(() => {
         year.value = 1994;
       });
diff --git a/core/src/components/textarea/textarea.tsx b/core/src/components/textarea/textarea.tsx
index af08b56e84..31cc91d19a 100644
--- a/core/src/components/textarea/textarea.tsx
+++ b/core/src/components/textarea/textarea.tsx
@@ -166,6 +166,7 @@ export class Textarea implements TextareaComponent {
 
   private emitStyle() {
     this.ionStyle.emit({
+      'interactive': true,
       'textarea': true,
       'input': true,
       'input-disabled': this.disabled,