fixup! feat(cdk-experimental/listbox): readonly mode

Author: wagnermaciel

src/cdk-experimental/listbox/listbox.ts

@@ -42,6 +42,7 @@ import {_IdGenerator} from '@angular/cdk/a11y';
     'role': 'listbox',
     'class': 'cdk-listbox',
     '[attr.tabindex]': 'pattern.tabindex()',
+    '[attr.aria-readonly]': 'pattern.readonly()',
     '[attr.aria-disabled]': 'pattern.disabled()',
     '[attr.aria-orientation]': 'pattern.orientation()',
     '[attr.aria-multiselectable]': 'pattern.multi()',

src/cdk-experimental/ui-patterns/listbox/listbox.ts

@@ -57,6 +57,9 @@ export class ListboxPattern<V> {
   /** Whether the listbox is disabled. */
   disabled: SignalLike<boolean>;
 
+  /** Whether the listbox is readonly. */
+  readonly: SignalLike<boolean>;
+
   /** The tabindex of the listbox. */
   tabindex = computed(() => this.focusManager.getListTabindex());
 
@@ -95,7 +98,7 @@ export class ListboxPattern<V> {
   keydown = computed(() => {
     const manager = new KeyboardEventManager();
 
-    if (this.inputs.readonly()) {
+    if (this.readonly()) {
       return manager
         .on(this.prevKey, () => this.prev())
         .on(this.nextKey, () => this.next())
@@ -160,8 +163,8 @@ export class ListboxPattern<V> {
   pointerdown = computed(() => {
     const manager = new PointerEventManager();
 
-    if (this.inputs.readonly()) {
-      manager.on(e => this.goto(e));
+    if (this.readonly()) {
+      return manager.on(e => this.goto(e));
     }
 
     if (this.inputs.multi()) {
@@ -175,6 +178,7 @@ export class ListboxPattern<V> {
 
   constructor(readonly inputs: ListboxInputs<V>) {
     this.disabled = inputs.disabled;
+    this.readonly = inputs.readonly;
     this.orientation = inputs.orientation;
     this.multi = inputs.multi;