From 76619cf4d06a3241a9b637db0aaf10e54470345f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?V=C3=ADctor=20Oliva?= <v.oliva.v@gmail.com>
Date: Thu, 30 Jun 2016 03:01:03 +0200
Subject: [PATCH] feat(select): add disabled status in select options

---
 src/components/alert/alert-component.ts             |  5 +++--
 src/components/alert/alert-options.ts               |  1 +
 src/components/option/option.ts                     | 13 +++++++++++++
 src/components/select/select.ts                     |  3 ++-
 src/components/select/test/multiple-value/index.ts  |  2 ++
 src/components/select/test/multiple-value/main.html |  9 +++++++++
 src/components/select/test/single-value/index.ts    |  2 ++
 src/components/select/test/single-value/main.html   |  9 +++++++++
 8 files changed, 41 insertions(+), 3 deletions(-)

diff --git a/src/components/alert/alert-component.ts b/src/components/alert/alert-component.ts
index df33f69c71..77921630b2 100644
--- a/src/components/alert/alert-component.ts
+++ b/src/components/alert/alert-component.ts
@@ -26,7 +26,7 @@ import {ViewController} from '../nav/view-controller';
 
         <template ngSwitchCase="radio">
           <div class="alert-radio-group" role="radiogroup" [attr.aria-labelledby]="hdrId" [attr.aria-activedescendant]="activeId">
-            <button category="alert-radio-button" *ngFor="let i of d.inputs" (click)="rbClick(i)" [attr.aria-checked]="i.checked" [attr.id]="i.id" class="alert-tappable alert-radio" role="radio">
+            <button category="alert-radio-button" *ngFor="let i of d.inputs" (click)="rbClick(i)" [attr.aria-checked]="i.checked" [disabled]="i.disabled" [attr.id]="i.id" class="alert-tappable alert-radio" role="radio">
               <div class="alert-radio-icon"><div class="alert-radio-inner"></div></div>
               <div class="alert-radio-label">
                 {{i.label}}
@@ -37,7 +37,7 @@ import {ViewController} from '../nav/view-controller';
 
         <template ngSwitchCase="checkbox">
           <div class="alert-checkbox-group">
-            <button category="alert-checkbox-button" *ngFor="let i of d.inputs" (click)="cbClick(i)" [attr.aria-checked]="i.checked" class="alert-tappable alert-checkbox" role="checkbox">
+            <button category="alert-checkbox-button" *ngFor="let i of d.inputs" (click)="cbClick(i)" [attr.aria-checked]="i.checked" [disabled]="i.disabled" class="alert-tappable alert-checkbox" role="checkbox">
               <div class="alert-checkbox-icon"><div class="alert-checkbox-inner"></div></div>
               <div class="alert-checkbox-label">
                 {{i.label}}
@@ -142,6 +142,7 @@ export class AlertCmp {
         value: isPresent(input.value) ? input.value : '',
         label: input.label,
         checked: !!input.checked,
+        disabled: !!input.disabled,
         id: 'alert-input-' + this.id + '-' + index
       };
     });
diff --git a/src/components/alert/alert-options.ts b/src/components/alert/alert-options.ts
index 3417460b2a..5124c9c5a6 100644
--- a/src/components/alert/alert-options.ts
+++ b/src/components/alert/alert-options.ts
@@ -16,5 +16,6 @@ export interface AlertInputOptions {
   value?: string;
   label?: string;
   checked?: boolean;
+  disabled?: boolean;
   id?: string;
 }
diff --git a/src/components/option/option.ts b/src/components/option/option.ts
index 11626e78f6..8cc85b3429 100644
--- a/src/components/option/option.ts
+++ b/src/components/option/option.ts
@@ -14,6 +14,7 @@ import { isPresent, isTrueProperty } from '../../util/util';
 })
 export class Option {
   private _checked: any = false;
+  private _disabled: any = false;
   private _value: any;
 
   /**
@@ -50,6 +51,18 @@ export class Option {
     this._value = val;
   }
 
+  /**
+   * @input {boolean} Whether or not the option is disabled
+   */
+  @Input()
+  get disabled() {
+    return this._disabled;
+  }
+
+  set disabled(val) {
+    this._disabled = isTrueProperty(val);
+  }
+
   /**
    * @private
    */
diff --git a/src/components/select/select.ts b/src/components/select/select.ts
index 711c6a9921..a7ffc7dde9 100644
--- a/src/components/select/select.ts
+++ b/src/components/select/select.ts
@@ -290,7 +290,8 @@ export class Select {
           type: (this._multi ? 'checkbox' : 'radio'),
           label: input.text,
           value: input.value,
-          checked: input.checked
+          checked: input.checked,
+          disabled: input.disabled
         };
       });
 
diff --git a/src/components/select/test/multiple-value/index.ts b/src/components/select/test/multiple-value/index.ts
index 4d4baa8df4..d3a58b5147 100644
--- a/src/components/select/test/multiple-value/index.ts
+++ b/src/components/select/test/multiple-value/index.ts
@@ -12,6 +12,7 @@ class E2EPage {
   pets: Array<string>;
   petOptions: Array<{text: string, value: string}>;
   authForm: ControlGroup;
+  status: string;
 
   constructor() {
     this.toppings = ['bacon', 'xcheese'];
@@ -24,6 +25,7 @@ class E2EPage {
       { text: 'Honey Badger', value: 'honeybadger' },
       { text: 'Pig', value: 'pig' },
     ];
+    this.status = "checked";
 
     this.authForm = new ControlGroup({
       name: new Control(''),
diff --git a/src/components/select/test/multiple-value/main.html b/src/components/select/test/multiple-value/main.html
index 9baec35ebd..cfa904dc72 100644
--- a/src/components/select/test/multiple-value/main.html
+++ b/src/components/select/test/multiple-value/main.html
@@ -51,6 +51,15 @@
     </ion-select>
   </ion-item>
 
+  <ion-item>
+    <ion-label>Statuses</ion-label>
+    <ion-select multiple [(ngModel)]="status">
+      <ion-option value="checked" checked="true">Checked</ion-option>
+      <ion-option value="default">Default</ion-option>
+      <ion-option value="disabled" disabled="true">Disabled</ion-option>
+    </ion-select>
+  </ion-item>
+
   <p aria-hidden="true" padding>
     <code>toppings: {{toppings}}</code><br>
     <code>carFeatures: {{carFeatures}}</code><br>
diff --git a/src/components/select/test/single-value/index.ts b/src/components/select/test/single-value/index.ts
index d92c58b5da..35c326d11e 100644
--- a/src/components/select/test/single-value/index.ts
+++ b/src/components/select/test/single-value/index.ts
@@ -15,6 +15,7 @@ class E2EPage {
   year: string;
   years: Array<number>;
   notification: string;
+  status: string;
 
   constructor() {
     this.gaming = '';
@@ -23,6 +24,7 @@ class E2EPage {
     this.month = '12';
     this.year = '1994';
     this.notification = 'enable';
+    this.status = "checked";
 
     this.years = [1989, 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999];
 
diff --git a/src/components/select/test/single-value/main.html b/src/components/select/test/single-value/main.html
index f6a6f4b79c..4360f4b77a 100644
--- a/src/components/select/test/single-value/main.html
+++ b/src/components/select/test/single-value/main.html
@@ -86,6 +86,15 @@
     </ion-select>
   </ion-item>
 
+  <ion-item>
+    <ion-label>Statuses</ion-label>
+    <ion-select [(ngModel)]="status">
+      <ion-option value="checked" checked="true">Checked</ion-option>
+      <ion-option value="default">Default</ion-option>
+      <ion-option value="disabled" disabled="true">Disabled</ion-option>
+    </ion-select>
+  </ion-item>
+
   <button (click)="resetGender()">Reset Gender</button>
 
   <p aria-hidden="true" padding>