refactor(radio): remove legacy property and support for legacy syntax (#29038)

BREAKING CHANGE:

The `legacy` property and support for the legacy syntax, which involved placing an `ion-radio` inside of an `ion-item` with an `ion-label`, have been removed from radio. For more information on migrating from the legacy radio syntax, refer to the [Radio documentation](https://ionicframework.com/docs/api/radio#migrating-from-legacy-radio-syntax).

Author: liamdebeasi

BREAKING.md

@@ -24,6 +24,7 @@ This is a comprehensive list of the breaking changes introduced in the major ver
   - [Nav](#version-8x-nav)
   - [Picker](#version-8x-picker)
   - [Progress bar](#version-8x-progress-bar)
+  - [Radio](#version-8x-radio)
   - [Select](#version-8x-select)
   - [Textarea](#version-8x-textarea)
   - [Toggle](#version-8x-toggle)
@@ -178,6 +179,10 @@ For more information on the dynamic font, refer to the [Dynamic Font Scaling doc
 
 For more information on styling toast buttons, refer to the [Toast Theming documentation](https://ionicframework.com/docs/api/toast#theming).
 
+<h4 id="version-8x-radio">Radio</h4>
+
+- The `legacy` property and support for the legacy syntax, which involved placing an `ion-radio` inside of an `ion-item` with an `ion-label`, have been removed. For more information on migrating from the legacy radio syntax, refer to the [Radio documentation](https://ionicframework.com/docs/api/radio#migrating-from-legacy-radio-syntax).
+
 <h4 id="version-8x-select">Select</h4>
 
 - The `legacy` property and support for the legacy syntax, which involved placing an `ion-select` inside of an `ion-item` with an `ion-label`, have been removed. For more information on migrating from the legacy select syntax, refer to the [Select documentation](https://ionicframework.com/docs/api/select#migrating-from-legacy-select-syntax).

core/api.txt

@@ -1037,7 +1037,6 @@ ion-radio,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secon
 ion-radio,prop,disabled,boolean,false,false,false
 ion-radio,prop,justify,"end" | "space-between" | "start",'space-between',false,false
 ion-radio,prop,labelPlacement,"end" | "fixed" | "stacked" | "start",'start',false,false
-ion-radio,prop,legacy,boolean | undefined,undefined,false,false
 ion-radio,prop,mode,"ios" | "md",undefined,false,false
 ion-radio,prop,name,string,this.inputId,false,false
 ion-radio,prop,value,any,undefined,false,false

core/src/components.d.ts

@@ -2253,10 +2253,6 @@ export namespace Components {
           * Where to place the label relative to the radio. `"start"`: The label will appear to the left of the radio in LTR and to the right in RTL. `"end"`: The label will appear to the right of the radio in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("..."). `"stacked"`: The label will appear above the radio regardless of the direction. The alignment of the label can be controlled with the `alignment` property.
          */
         "labelPlacement": 'start' | 'end' | 'fixed' | 'stacked';
-        /**
-          * Set the `legacy` property to `true` to forcibly use the legacy form control markup. Ionic will only opt components in to the modern form markup when they are using either the `aria-label` attribute or the default slot that contains the label text. As a result, the `legacy` property should only be used as an escape hatch when you want to avoid this automatic opt-in behavior. Note that this property will be removed in an upcoming major release of Ionic, and all form components will be opted-in to using the modern form markup.
-         */
-        "legacy"?: boolean;
         /**
           * The mode determines which platform styles to use.
          */
@@ -4145,7 +4141,6 @@ declare global {
         new (): HTMLIonProgressBarElement;
     };
     interface HTMLIonRadioElementEventMap {
-        "ionStyle": StyleEventDetail;
         "ionFocus": void;
         "ionBlur": void;
     }
@@ -6930,10 +6925,6 @@ declare namespace LocalJSX {
           * Where to place the label relative to the radio. `"start"`: The label will appear to the left of the radio in LTR and to the right in RTL. `"end"`: The label will appear to the right of the radio in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("..."). `"stacked"`: The label will appear above the radio regardless of the direction. The alignment of the label can be controlled with the `alignment` property.
          */
         "labelPlacement"?: 'start' | 'end' | 'fixed' | 'stacked';
-        /**
-          * Set the `legacy` property to `true` to forcibly use the legacy form control markup. Ionic will only opt components in to the modern form markup when they are using either the `aria-label` attribute or the default slot that contains the label text. As a result, the `legacy` property should only be used as an escape hatch when you want to avoid this automatic opt-in behavior. Note that this property will be removed in an upcoming major release of Ionic, and all form components will be opted-in to using the modern form markup.
-         */
-        "legacy"?: boolean;
         /**
           * The mode determines which platform styles to use.
          */
@@ -6950,10 +6941,6 @@ declare namespace LocalJSX {
           * Emitted when the radio button has focus.
          */
         "onIonFocus"?: (event: IonRadioCustomEvent<void>) => void;
-        /**
-          * Emitted when the styles change.
-         */
-        "onIonStyle"?: (event: IonRadioCustomEvent<StyleEventDetail>) => void;
         /**
           * the value of the radio.
          */

core/src/components/item/test/disabled/index.html

@@ -43,12 +43,6 @@
             <ion-checkbox disabled checked> Disabled Checkbox </ion-checkbox>
           </ion-item>
 
-          <ion-radio-group value="radio">
-            <ion-item>
-              <ion-radio disabled value="radio"> Disabled Radio </ion-radio>
-            </ion-item>
-          </ion-radio-group>
-
           <ion-item>
             <ion-range disabled value="10">
               <span slot="label">Disabled Range</span>
@@ -61,18 +55,6 @@
             <ion-label>Multiple Input Disabled Items</ion-label>
           </ion-list-header>
 
-          <ion-item>
-            <ion-checkbox aria-label="Checkbox" disabled slot="start"></ion-checkbox>
-            <ion-label>Checkbox + Radio</ion-label>
-            <ion-radio aria-label="Radio" slot="end"></ion-radio>
-          </ion-item>
-
-          <ion-item>
-            <ion-checkbox aria-label="Checkbox" disabled slot="start"></ion-checkbox>
-            <ion-radio aria-label="Radio" slot="start"></ion-radio>
-            <ion-label>Checkbox + Radio</ion-label>
-          </ion-item>
-
           <ion-item>
             <ion-checkbox slot="start" aria-label="Checkbox"></ion-checkbox>
             <ion-label>Checkbox + Range</ion-label>