@@ -14,10 +14,11 @@ import {
14
14
inject ,
15
15
input ,
16
16
model ,
17
+ OnDestroy ,
17
18
signal ,
18
19
} from '@angular/core' ;
19
- import { Option } from '.. /ui-patterns/listbox/option' ;
20
- import { ListboxInputs , ListboxPattern } from '.. /ui-patterns/listbox/listbox' ;
20
+ import { OptionPattern } from '@angular/cdk-experimental /ui-patterns/listbox/option' ;
21
+ import { ListboxInputs , ListboxPattern } from '@angular/cdk-experimental /ui-patterns/listbox/listbox' ;
21
22
import { Directionality } from '@angular/cdk/bidi' ;
22
23
import { startWith , takeUntil } from 'rxjs/operators' ;
23
24
import { Subject } from 'rxjs' ;
@@ -40,7 +41,7 @@ import {Subject} from 'rxjs';
40
41
// '(focusin)': '_handleFocusIn()',
41
42
} ,
42
43
} )
43
- export class CdkListbox implements ListboxInputs {
44
+ export class CdkListbox implements ListboxInputs , OnDestroy {
44
45
/** Whether the list is vertically or horizontally oriented. */
45
46
orientation = input < 'vertical' | 'horizontal' > ( 'vertical' ) ;
46
47
@@ -69,31 +70,31 @@ export class CdkListbox implements ListboxInputs {
69
70
activeIndex = model < number > ( 0 ) ;
70
71
71
72
/** The CdkOptions nested inside of the CdkListbox. */
72
- private cdkOptions = contentChildren ( CdkOption , { descendants : true } ) ;
73
+ private _cdkOptions = contentChildren ( CdkOption , { descendants : true } ) ;
73
74
74
75
/** The Option UIPatterns of the child CdkOptions. */
75
- items = computed ( ( ) => this . cdkOptions ( ) . map ( option => option . state ) ) ;
76
+ items = computed ( ( ) => this . _cdkOptions ( ) . map ( option => option . state ) ) ;
76
77
77
78
/** The directionality (LTR / RTL) context for the application (or a subtree of it). */
78
- private dir = inject ( Directionality ) ;
79
+ private _dir = inject ( Directionality ) ;
79
80
80
81
/** A signal wrapper for directionality. */
81
82
directionality = signal < 'rtl' | 'ltr' > ( 'rtl' ) ;
82
83
83
84
/** Emits when the list has been destroyed. */
84
- private readonly destroyed = new Subject < void > ( ) ;
85
+ private readonly _destroyed = new Subject < void > ( ) ;
85
86
86
87
/** The Listbox UIPattern. */
87
88
state : ListboxPattern = new ListboxPattern ( this ) ;
88
89
89
90
constructor ( ) {
90
- this . dir . change
91
- . pipe ( startWith ( this . dir . value ) , takeUntil ( this . destroyed ) )
91
+ this . _dir . change
92
+ . pipe ( startWith ( this . _dir . value ) , takeUntil ( this . _destroyed ) )
92
93
. subscribe ( value => this . directionality . set ( value ) ) ;
93
94
}
94
95
95
96
ngOnDestroy ( ) {
96
- this . destroyed . complete ( ) ;
97
+ this . _destroyed . complete ( ) ;
97
98
}
98
99
}
99
100
@@ -122,16 +123,16 @@ export class CdkOption {
122
123
searchTerm = computed ( ( ) => this . label ( ) ?? this . element ( ) . textContent ) ;
123
124
124
125
/** A reference to the option element. */
125
- private elementRef = inject ( ElementRef ) ;
126
+ private _elementRef = inject ( ElementRef ) ;
126
127
127
- element = computed ( ( ) => this . elementRef . nativeElement ) ;
128
+ element = computed ( ( ) => this . _elementRef . nativeElement ) ;
128
129
129
130
/** The parent CdkListbox. */
130
- private cdkListbox = inject ( CdkListbox ) ;
131
+ private _cdkListbox = inject ( CdkListbox ) ;
131
132
132
133
/** The parent Listbox UIPattern. */
133
- listbox = computed ( ( ) => this . cdkListbox . state ) ;
134
+ listbox = computed ( ( ) => this . _cdkListbox . state ) ;
134
135
135
136
/** The Option UIPattern. */
136
- state : Option = new Option ( this ) ;
137
+ state = new OptionPattern ( this ) ;
137
138
}
0 commit comments