refactor(multiple): default softDisabled to true (angular#32240)

* refactor(multiple): default softDisabled to true

Updates the default value of the  input to  across all ARIA components. This allows disabled items to receive focus by default, improving keyboard accessibility.
- Grid focus coordinates behavior has also been updated to correctly handle focus when  is enabled.

* fix(cdk/a11y): update tests to reflect correct behavior

* refactor(cdk/a11y): refine softDisabled behavior and update tests\n\nThis commit refines the  behavior across several a11y components (List, Listbox, Accordion, Tree) to ensure correct interaction between disabled states and navigation/selection. Specifically:\n\n- In , the  method now explicitly checks if the list is disabled before allowing selection updates, preventing unintended selections when  permits navigation.\n- In , a new  method is introduced to clearly distinguish between a 'hard' disabled state (blocking all interaction) and a 'soft' disabled state (allowing navigation but blocking selection).\n- Corresponding tests in , , , and  have been updated and expanded to accurately reflect and verify these refined  interactions, ensuring that navigation and selection behave as expected in various disabled scenarios.

(cherry picked from commit 28a50f5)

Author: tjshiu

src/aria/accordion/accordion.spec.ts

@@ -363,12 +363,19 @@ describe('AccordionGroup', () => {
     });
 
     it('should not allow keyboard navigation if group is disabled', () => {
-      configureAccordionComponent({disabledGroup: true});
+      configureAccordionComponent({disabledGroup: true, softDisabled: false});
 
       downArrowKey(triggerElements[0]);
       expect(isTriggerActive(triggerElements[1])).toBeFalse();
     });
 
+    it('should allow keyboard navigation if group is disabled', () => {
+      configureAccordionComponent({disabledGroup: true});
+
+      downArrowKey(triggerElements[0]);
+      expect(isTriggerActive(triggerElements[1])).toBeTrue();
+    });
+
     it('should not allow expansion if group is disabled', () => {
       configureAccordionComponent({disabledGroup: true});
 
@@ -419,7 +426,7 @@ class AccordionGroupExample {
   value = model<string[]>([]);
   multiExpandable = signal(false);
   disabledGroup = signal(false);
-  softDisabled = signal(false);
+  softDisabled = signal(true);
   wrap = signal(false);
 
   disableItem(itemValue: string, disabled: boolean) {

src/aria/accordion/accordion.ts

@@ -172,7 +172,7 @@ export class AccordionGroup {
   value = model<string[]>([]);
 
   /** Whether to allow disabled items to receive focus. */
-  softDisabled = input(false, {transform: booleanAttribute});
+  softDisabled = input(true, {transform: booleanAttribute});
 
   /** Whether keyboard navigation should wrap around from the last item to the first, and vice-versa. */
   wrap = input(false, {transform: booleanAttribute});

src/aria/grid/grid.ts

@@ -66,7 +66,7 @@ export class Grid {
   readonly disabled = input(false, {transform: booleanAttribute});
 
   /** Whether to allow disabled items to receive focus. */
-  readonly softDisabled = input(false, {transform: booleanAttribute});
+  readonly softDisabled = input(true, {transform: booleanAttribute});
 
   /** The focus strategy used by the grid. */
   readonly focusMode = input<'roving' | 'activedescendant'>('roving');

src/aria/listbox/listbox.spec.ts

@@ -195,11 +195,16 @@ describe('Listbox', () => {
         expect(listboxElement.getAttribute('tabindex')).toBe('-1');
       });
 
-      it('should set tabindex="0" for the listbox when disabled and focusMode is "roving"', () => {
-        setupListbox({disabled: true, focusMode: 'roving'});
+      it('should set tabindex="0" for the listbox when disabled and focusMode is "roving when softDisabled is false"', () => {
+        setupListbox({disabled: true, focusMode: 'roving', softDisabled: false});
         expect(listboxElement.getAttribute('tabindex')).toBe('0');
       });
 
+      it('should set tabindex="-1" for the listbox when disabled and focusMode is "roving"', () => {
+        setupListbox({disabled: true, focusMode: 'roving'});
+        expect(listboxElement.getAttribute('tabindex')).toBe('-1');
+      });
+
       it('should set initial focus (tabindex="0") on the first non-disabled option if no value is set', () => {
         setupListbox({focusMode: 'roving'});
         expect(optionElements[0].getAttribute('tabindex')).toBe('0');
@@ -218,8 +223,23 @@ describe('Listbox', () => {
         expect(optionElements[4].getAttribute('tabindex')).toBe('-1');
       });
 
-      it('should set initial focus (tabindex="0") on the first non-disabled option if selected option is disabled', () => {
-        setupListbox({focusMode: 'roving', value: [1], disabledOptions: [1]});
+      it('should set initial focus (tabindex="0") on the first non-disabled option if selected option is disabled when softDisabled is false', () => {
+        setupListbox({
+          focusMode: 'roving',
+          value: [1],
+          disabledOptions: [0],
+          softDisabled: false,
+        });
+        expect(optionElements[0].getAttribute('tabindex')).toBe('-1');
+        expect(optionElements[1].getAttribute('tabindex')).toBe('0');
+      });
+
+      it('should set initial focus (tabindex="0") on the first option if selected option is disabled', () => {
+        setupListbox({
+          focusMode: 'roving',
+          value: [0],
+          disabledOptions: [0],
+        });
         expect(optionElements[0].getAttribute('tabindex')).toBe('0');
         expect(optionElements[1].getAttribute('tabindex')).toBe('-1');
       });
@@ -247,10 +267,20 @@ describe('Listbox', () => {
       });
 
       it('should set aria-activedescendant to the ID of the first non-disabled option if selected option is disabled', () => {
-        setupListbox({focusMode: 'activedescendant', value: [1], disabledOptions: [1]});
+        setupListbox({focusMode: 'activedescendant', value: [0], disabledOptions: [0]});
         expect(listboxElement.getAttribute('aria-activedescendant')).toBe(optionElements[0].id);
       });
 
+      it('should set aria-activedescendant to the ID of the first non-disabled option if selected option is disabled when softDisabled is false', () => {
+        setupListbox({
+          focusMode: 'activedescendant',
+          value: [1],
+          disabledOptions: [0],
+          softDisabled: false,
+        });
+        expect(listboxElement.getAttribute('aria-activedescendant')).toBe(optionElements[1].id);
+      });
+
       it('should set tabindex="-1" for all options', () => {
         setupListbox({focusMode: 'activedescendant'});
         expect(optionElements[0].getAttribute('tabindex')).toBe('-1');
@@ -553,17 +583,17 @@ describe('Listbox', () => {
     isFocused: (index: number) => boolean,
   ) {
     describe(`keyboard navigation (focusMode="${focusMode}")`, () => {
-      it('should move focus to the last enabled option on End', () => {
+      it('should move focus to the last focusable option on End', () => {
         setupListbox({focusMode, disabledOptions: [4]});
         end();
-        expect(isFocused(3)).toBe(true);
+        expect(isFocused(4)).toBe(true);
       });
 
-      it('should move focus to the first enabled option on Home', () => {
+      it('should move focus to the first focusable option on Home', () => {
         setupListbox({focusMode, disabledOptions: [0]});
         end();
         home();
-        expect(isFocused(1)).toBe(true);
+        expect(isFocused(0)).toBe(true);
       });
 
       it('should allow keyboard navigation if the group is readonly', () => {
@@ -614,6 +644,18 @@ describe('Listbox', () => {
           down();
           expect(isFocused(1)).toBe(true);
         });
+
+        it('should not skip disabled options with ArrowDown when completely disabled', () => {
+          setupListbox({
+            focusMode,
+            orientation: 'vertical',
+            softDisabled: true,
+            disabled: true,
+          });
+
+          down();
+          expect(isFocused(0)).toBe(true);
+        });
       });
 
       describe('horizontal orientation', () => {
@@ -774,7 +816,7 @@ class ListboxExample {
   value: number[] = [];
   disabled = false;
   readonly = false;
-  softDisabled = false;
+  softDisabled = true;
   focusMode: 'roving' | 'activedescendant' = 'roving';
   orientation: 'vertical' | 'horizontal' = 'vertical';
   multi = false;

src/aria/listbox/listbox.ts

@@ -98,7 +98,7 @@ export class Listbox<V> {
   wrap = input(true, {transform: booleanAttribute});
 
   /** Whether to allow disabled items in the list to receive focus. */
-  softDisabled = input(false, {transform: booleanAttribute});
+  softDisabled = input(true, {transform: booleanAttribute});
 
   /** The focus strategy used by the list. */
   focusMode = input<'roving' | 'activedescendant'>('roving');

src/aria/private/accordion/accordion.spec.ts

@@ -66,7 +66,7 @@ describe('Accordion Pattern', () => {
       multiExpandable: signal(true),
       items: signal([]),
       expandedIds: signal<string[]>([]),
-      softDisabled: signal(false),
+      softDisabled: signal(true),
       wrap: signal(true),
       element: signal(document.createElement('div')),
     };

src/aria/private/behaviors/grid/grid-focus.ts

@@ -143,7 +143,7 @@ export class GridFocus<T extends GridFocusCell> {
 
   /** Moves focus to the cell at the given coordinates if it's part of a focusable cell. */
   focusCoordinates(coords: RowCol): boolean {
-    if (this.gridDisabled()) {
+    if (this.gridDisabled() && !this.inputs.softDisabled()) {
       return false;
     }