Merge branch 'next' into ROU-12374

Author: BenOsodrac

BREAKING.md

@@ -1845,7 +1845,7 @@ ion-radio,part,container
 ion-radio,part,label
 ion-radio,part,mark
 
-ion-radio-group,none
+ion-radio-group,shadow
 ion-radio-group,prop,allowEmptySelection,boolean,false,false,false
 ion-radio-group,prop,compareWith,((currentValue: any, compareValue: any) => boolean) | null | string | undefined,undefined,false,false
 ion-radio-group,prop,errorText,string | undefined,undefined,false,false
@@ -1855,6 +1855,9 @@ ion-radio-group,prop,name,string,this.inputId,false,false
 ion-radio-group,prop,theme,"ios" | "md" | "ionic",undefined,false,false
 ion-radio-group,prop,value,any,undefined,false,false
 ion-radio-group,event,ionChange,RadioGroupChangeEventDetail<any>,true
+ion-radio-group,part,error-text
+ion-radio-group,part,helper-text
+ion-radio-group,part,supporting-text
 
 ion-range,shadow
 ion-range,prop,activeBarStart,number | undefined,undefined,false,false

core/api.txt

@@ -244,7 +244,7 @@
 
 // Avatar Disabled
 // --------------------------------------------------
-:host(.avatar-disabled)::before {
+:host(.avatar-disabled)::after {
   @include globals.border-radius(var(--border-radius));
   @include globals.disabled-state();
 }

core/src/components/avatar/avatar.ionic.scss

@@ -12,6 +12,9 @@ configs({ directions: ['ltr'], modes: ['ionic-md'] }).forEach(({ config, screens
         ` 
         <div id="container"> 
           <ion-avatar disabled> AV </ion-avatar>
+          <ion-avatar disabled>
+            <ion-icon name="person-outline"></ion-icon>
+          </ion-avatar>
           <ion-avatar disabled>
             <img src="/src/components/avatar/test/avatar.svg" />
           </ion-avatar>

core/src/components/avatar/test/states/avatar.e2e.ts

@@ -25,6 +25,9 @@
       <ion-content>
         <h3>Disabled</h3>
         <ion-avatar disabled>AV</ion-avatar>
+        <ion-avatar disabled>
+          <ion-icon name="person-outline"></ion-icon>
+        </ion-avatar>
         <ion-avatar disabled>
           <img src="/src/components/avatar/test/avatar.svg" />
         </ion-avatar>

core/src/components/avatar/test/states/avatar.e2e.ts-snapshots/avatar-disabled-ionic-md-ltr-light-Mobile-Chrome-linux.png

@@ -113,11 +113,11 @@ input {
 // ----------------------------------------------------------------
 
 .checkbox-bottom {
-  @include globals.typography(globals.$ion-body-md-regular);
+  @include globals.typography(globals.$ion-body-sm-medium);
 }
 
 .checkbox-bottom .error-text {
-  color: globals.$ion-semantics-danger-800;
+  color: globals.$ion-text-danger;
 }
 
 .checkbox-bottom .helper-text {
@@ -198,7 +198,7 @@ input {
 // Ionic Design Checkbox Invalid
 // --------------------------------------------------
 :host(.ion-invalid) {
-  --focus-ring-color: #{globals.$ion-border-focus-error};
+  --focus-ring-color: #{globals.$ion-border-danger-default};
 }
 
 :host(.ion-invalid:not(.checkbox-checked)),