From 3716300df5395bc370ee1e1d29db972bc142436f Mon Sep 17 00:00:00 2001
From: Brandy Carney <brandy@ionic.io>
Date: Thu, 8 Feb 2018 14:51:41 -0500
Subject: [PATCH] fix(select): emit proper styles for floating & stacked labels

---
 .../core/src/components/select/select.scss    |  9 ++++++
 .../core/src/components/select/select.tsx     |  3 +-
 .../components/select/test/basic/index.html   | 28 ++++++++++++++++++-
 3 files changed, 38 insertions(+), 2 deletions(-)

diff --git a/packages/core/src/components/select/select.scss b/packages/core/src/components/select/select.scss
index 7faa78e3fc..256f3d64d7 100644
--- a/packages/core/src/components/select/select.scss
+++ b/packages/core/src/components/select/select.scss
@@ -69,3 +69,12 @@ ion-select {
 .select-key button {
   border: 2px solid #5e9ed6;
 }
+
+
+// Stacked & Floating Select
+// --------------------------------------------------
+
+.item-label-stacked .select,
+.item-label-floating .select {
+  max-width: 100%;
+}
\ No newline at end of file
diff --git a/packages/core/src/components/select/select.tsx b/packages/core/src/components/select/select.tsx
index 5016e2f966..ec9c924bc0 100644
--- a/packages/core/src/components/select/select.tsx
+++ b/packages/core/src/components/select/select.tsx
@@ -181,6 +181,7 @@ export class Select {
       value: this.value,
       text: this.text
     });
+    this.emitStyle();
   }
 
   @Listen('ionSelectOptionDidLoad')
@@ -240,7 +241,6 @@ export class Select {
       this.value = this.multiple ? [] : undefined;
     }
     this.name = this.name || this.selectId;
-    this.emitStyle();
   }
 
   componentDidLoad() {
@@ -269,6 +269,7 @@ export class Select {
         this.text = checked.textContent;
       }
     }
+    this.emitStyle();
   }
 
   getLabel() {
diff --git a/packages/core/src/components/select/test/basic/index.html b/packages/core/src/components/select/test/basic/index.html
index 5c260ef266..21e9ac733b 100644
--- a/packages/core/src/components/select/test/basic/index.html
+++ b/packages/core/src/components/select/test/basic/index.html
@@ -207,10 +207,36 @@
           <ion-item>
             <ion-label>Disabled</ion-label>
             <ion-select multiple disabled="true">
-              <ion-select-option checked="true">Selected Text</ion-select-option>
+              <ion-select-option selected="true">Selected Text</ion-select-option>
             </ion-select>
           </ion-item>
 
+          <ion-item>
+            <ion-label stacked>Stacked</ion-label>
+            <ion-select>
+              <ion-select-option>Default</ion-select-option>
+              <ion-select-option>Other</ion-select-option>
+              <ion-select-option>N/A</ion-select-option>
+            </ion-select>
+          </ion-item>
+
+          <ion-item>
+            <ion-label floating>Floating</ion-label>
+            <ion-select>
+              <ion-select-option>Default</ion-select-option>
+              <ion-select-option>Other</ion-select-option>
+              <ion-select-option>N/A</ion-select-option>
+            </ion-select>
+          </ion-item>
+
+          <ion-item>
+            <ion-label floating>Floating</ion-label>
+            <ion-select>
+              <ion-select-option selected="true">Default</ion-select-option>
+              <ion-select-option>Other</ion-select-option>
+              <ion-select-option>N/A</ion-select-option>
+            </ion-select>
+          </ion-item>
         </ion-list>
 
         <div text-center>