fix(radio): remove order override from wp mode, use slot instead

$radio-wp-order has been removed

Add Radio to breaking changes

packages/core/src/components/radio/radio.wp.scss

@@ -10,9 +10,6 @@ $radio-wp-color-on:                   color($colors-wp, primary) !default;
 /// @prop - Color of the unchecked radio
 $radio-wp-color-off:                  #333 !default;
 
-/// @prop - Order of the radio (places to the left of the item)
-$radio-wp-order:                      -1 !default;
-
 /// @prop - Width of the radio icon
 $radio-wp-icon-width:                 16px !default;
 
@@ -127,16 +124,12 @@ $radio-wp-item-end-margin-start:      0 !default;
 // -----------------------------------------
 
 .item-wp .radio-wp {
+  @include margin($radio-wp-item-start-margin-top, $radio-wp-item-start-margin-end, $radio-wp-item-start-margin-bottom, $radio-wp-item-start-margin-start);
+
   position: static;
   display: block;
 
-  order: $radio-wp-order;
+  &[slot="end"] {
-
-  @include margin($radio-wp-item-start-margin-top, $radio-wp-item-start-margin-end, $radio-wp-item-start-margin-bottom, $radio-wp-item-start-margin-start);
-
-  &[item-end] {
-    order: 0;
-
     @include margin($radio-wp-item-end-margin-top, $radio-wp-item-end-margin-end, $radio-wp-item-end-margin-bottom, $radio-wp-item-end-margin-start);
   }
 }

packages/ionic-angular/BREAKING.md

@@ -11,6 +11,7 @@ A list of the breaking changes introduced in Ionic Angular v4.
 - [Icon](#icon)
 - [Item](#item)
 - [Option](#option)
+- [Radio](#radio)
 - [Segment](#segment)
 - [Toolbar](#toolbar)
 - [Sass](#sass)
@@ -350,6 +351,103 @@ Select's option element should now be written as `<ion-select-option>`. This mak
 
 The class has been renamed from `Option` to `SelectOption` to keep it consistent with the element tag name.
 
+## Radio
+
+### Slot Required
+
+Previously radio was positioned inside of an item automatically or by using `item-left`/`item-right`. It is now required to have a `slot` to be positioned properly.
+
+** Old Usage Example **
+
+```html
+<ion-item>
+  <ion-label>Apple</ion-label>
+  <ion-radio value="apple"></ion-radio>
+</ion-item>
+
+<ion-item>
+  <ion-label>Grape, checked, disabled</ion-label>
+  <ion-radio item-left value="grape" checked disabled></ion-radio>
+</ion-item>
+
+<ion-item>
+  <ion-label>Cherry</ion-label>
+  <ion-radio item-right color="danger" value="cherry"></ion-radio>
+</ion-item>
+```
+
+** New Usage Example **
+
+```html
+<ion-item>
+  <ion-label>Apple</ion-label>
+  <ion-radio slot="start" value="apple"></ion-radio>
+</ion-item>
+
+<ion-item>
+  <ion-label>Grape, checked, disabled</ion-label>
+  <ion-radio slot="start" value="grape" checked disabled></ion-radio>
+</ion-item>
+
+<ion-item>
+  <ion-label>Cherry</ion-label>
+  <ion-radio slot="end" color="danger" value="cherry"></ion-radio>
+</ion-item>
+```
+
+### Radio Group
+
+Radio group has been changed to an element. It should now be wrapped around any `<ion-radio>` elements as `<ion-radio-group>`.
+
+** Old Usage Example **
+
+```html
+<ion-list radio-group>
+  <ion-item>
+    <ion-label>Apple</ion-label>
+    <ion-radio value="apple"></ion-radio>
+  </ion-item>
+
+  <ion-item>
+    <ion-label>Grape, checked, disabled</ion-label>
+    <ion-radio value="grape" checked disabled></ion-radio>
+  </ion-item>
+
+  <ion-item>
+    <ion-label>Cherry</ion-label>
+    <ion-radio color="danger" value="cherry"></ion-radio>
+  </ion-item>
+</ion-list>
+```
+
+** New Usage Example **
+
+```html
+<ion-list>
+  <ion-radio-group>
+    <ion-item>
+      <ion-label>Apple</ion-label>
+      <ion-radio slot="start" value="apple"></ion-radio>
+    </ion-item>
+
+    <ion-item>
+      <ion-label>Grape, checked, disabled</ion-label>
+      <ion-radio slot="start" value="grape" checked disabled></ion-radio>
+    </ion-item>
+
+    <ion-item>
+      <ion-label>Cherry</ion-label>
+      <ion-radio slot="start" color="danger" value="cherry"></ion-radio>
+    </ion-item>
+  </ion-radio-group>
+</ion-list>
+```
+
+### Order for Windows
+
+Previously a radio inside of an item in Windows Platform mode would align itself to the start of the item. This has been removed, `slot` should always be used to align a radio inside of an item now.
+
+
 ## Segment
 
 The markup hasn't changed for Segments, but now writing `<ion-segment-button>` will render a native button element inside of it.