fix tab navigation when there is a pre-checked radio

umbraco · Jul 25, 2024 · 01b2da1 · 01b2da1
1 parent 43c123d
commit 01b2da1
Showing 1 changed file with 8 additions and 0 deletions.
diff --git a/packages/uui-radio/lib/uui-radio-group.element.ts b/packages/uui-radio/lib/uui-radio-group.element.ts
@@ -255,15 +255,23 @@ export class UUIRadioGroupElement extends UUIFormControlMixin(LitElement, '') {
   }
 
   #updateRadioElementsCheckedState(newValue: FormData | FormDataEntryValue) {
+    const notChecked: Array<UUIRadioElement> = [];
+
     this.#radioElements.forEach((el, index) => {
       if (el.value === newValue) {
         el.checked = true;
         el.makeFocusable();
         this.#selected = index;
       } else {
         el.checked = false;
+        notChecked.push(el);
       }
     });
+
+    // If there is a selected radio, make all other radios unfocusable.
+    if (this.#selected !== null) {
+      notChecked.forEach(el => el.makeUnfocusable());
+    }
   }
 
   #setDisableOnRadios(value: boolean) {