refactor(alert): body property renamed to message

ionic/components/alert/alert.ios.scss

@@ -18,10 +18,10 @@ $alert-ios-title-font-size:                     17px !default;
 $alert-ios-sub-title-font-size:                 14px !default;
 $alert-ios-sub-title-text-color:                #666 !default;
 
-$alert-ios-body-padding:                        0px 16px 24px !default;
+$alert-ios-message-padding:                     0px 16px 24px !default;
-$alert-ios-body-text-color:                     inherit !default;
+$alert-ios-message-text-color:                  inherit !default;
-$alert-ios-body-text-align:                     center !default;
+$alert-ios-message-text-align:                  center !default;
-$alert-ios-body-font-size:                      13px !default;
+$alert-ios-message-font-size:                   13px !default;
 
 $alert-ios-input-padding:                       6px !default;
 $alert-ios-input-margin-top:                    10px !default;
@@ -64,11 +64,12 @@ ion-alert {
   color: $alert-ios-sub-title-text-color;
 }
 
-.alert-body {
+.alert-message,
-  padding: $alert-ios-body-padding;
+.alert-inputs {
-  color: $alert-ios-body-text-color;
+  padding: $alert-ios-message-padding;
-  text-align: $alert-ios-body-text-align;
+  color: $alert-ios-message-text-color;
-  font-size: $alert-ios-body-font-size;
+  text-align: $alert-ios-message-text-align;
+  font-size: $alert-ios-message-font-size;
 }
 
 .alert-input {

ionic/components/alert/alert.md.scss

@@ -15,8 +15,8 @@ $alert-md-head-padding:                   24px 24px 10px 24px !default;
 $alert-md-title-font-size:                20px !default;
 $alert-md-sub-title-font-size:            15px !default;
 
-$alert-md-body-padding:                   10px 24px 24px 24px !default;
+$alert-md-message-padding:                10px 24px 24px 24px !default;
-$alert-md-body-text-color:                rgba(0,0,0,.5) !default;
+$alert-md-message-text-color:             rgba(0,0,0,.5) !default;
 
 $alert-md-input-border-color:             #dedede !default;
 $alert-md-input-text-color:               #000000 !default;
@@ -51,9 +51,10 @@ $alert-md-buttons-justify-content:        flex-end !default;
   font-size: $alert-md-sub-title-font-size;
 }
 
-.alert-body {
+.alert-message,
-  padding: $alert-md-body-padding;
+.alert-inputs {
-  color: $alert-md-body-text-color;
+  padding: $alert-md-message-padding;
+  color: $alert-md-message-text-color;
 }
 
 .alert-input {

ionic/components/alert/alert.scss

@@ -50,7 +50,7 @@ ion-alert {
   font-weight: normal;
 }
 
-.alert-body {
+.alert-message {
   overflow: auto;
 
   &:empty {

ionic/components/alert/alert.ts

@@ -19,7 +19,7 @@ import {isDefined} from '../../util/util';
  * An alert is created from an array of `buttons` and optionally an array of
  * `inputs`. Each button includes properties for its `text`, and optionally a
  * `handler`. If a handler returns `false` then the alert will not be dismissed.
- * An alert can also optionally have a `title`, `subTitle` and `body`.
+ * An alert can also optionally have a `title`, `subTitle` and `message`.
  *
  * All buttons will show up in the order they have been added to the `buttons`
  * array, from left to right. Note: The right most button (the last one in the
@@ -50,7 +50,7 @@ import {isDefined} from '../../util/util';
  * presentConfirm() {
  *   let alert = Alert.create({
  *     title: 'Confirm purchase',
- *     body: 'Do you want to buy this book?',
+ *     message: 'Do you want to buy this book?',
  *     buttons: [
  *       {
  *         text: 'Cancel',
@@ -141,10 +141,20 @@ export class Alert extends ViewController {
   }
 
   /**
-   * @param {string} body Alert body content
+   * @private
    */
-  setBody(body) {
+  setBody(message) {
-    this.data.body = body;
+    // deprecated warning
+    console.warn('Alert setBody() has been renamed to setMessage()');
+
+    this.setMessage(message);
+  }
+
+  /**
+   * @param {string} message  Alert message content
+   */
+  setMessage(message) {
+    this.data.message = message;
   }
 
   /**
@@ -182,7 +192,7 @@ export class Alert extends ViewController {
         '<h2 id="{{hdrId}}" class="alert-title" *ngIf="d.title">{{d.title}}</h2>' +
         '<h3 id="{{subHdrId}}" class="alert-sub-title" *ngIf="d.subTitle">{{d.subTitle}}</h3>' +
       '</div>' +
-      '<div id="{{bodyId}}" class="alert-body" *ngIf="d.body">{{d.body}}</div>' +
+      '<div id="{{msgId}}" class="alert-message" *ngIf="d.message">{{d.message}}</div>' +
       '<div *ngIf="d.inputs.length" [ngSwitch]="inputType">' +
 
         '<template ngSwitchWhen="radio">' +
@@ -197,7 +207,7 @@ export class Alert extends ViewController {
         '</template>' +
 
         '<template ngSwitchDefault>' +
-          '<div class="alert-body alert-inputs">' +
+          '<div class="alert-inputs">' +
             '<div *ngFor="#i of d.inputs" class="alert-input-wrapper">' +
               '<input [placeholder]="i.placeholder" [(ngModel)]="i.value" [type]="i.type" class="alert-input">' +
             '</div>' +
@@ -236,11 +246,11 @@ class AlertCmp {
     this.descId = '';
     this.hdrId = 'alert-hdr-' + this.id;
     this.subHdrId = 'alert-subhdr-' + this.id;
-    this.bodyId = 'alert-body-' + this.id;
+    this.msgId = 'alert-msg-' + this.id;
     this.activeId = '';
 
-    if (this.d.body) {
+    if (this.d.message) {
-      this.descId = this.bodyId;
+      this.descId = this.msgId;
     } else if (this.d.subTitle) {
       this.descId = this.subHdrId;
     }
@@ -303,6 +313,12 @@ class AlertCmp {
     // normalize the data
     let data = this.d;
 
+    if (data.body) {
+      // deprecated warning
+      console.warn('Alert `body` property has been renamed to `message`');
+      data.message = data.body;
+    }
+
     data.buttons = data.buttons.map(button => {
       if (typeof button === 'string') {
         return { text: button };

ionic/components/alert/test/basic/index.ts

@@ -27,7 +27,7 @@ class E2EPage {
   doConfirm() {
     let alert = Alert.create();
     alert.setTitle('Confirm!');
-    alert.setBody('Body text!!!');
+    alert.setMessage('Message text!!!');
     alert.addButton({
       text: 'Cancel',
       handler: () => {