UNPKG

17.3 kBTypeScriptView Raw
1import { _AbstractConstructor } from '@angular/material/core';
2import { AfterContentInit } from '@angular/core';
3import { BooleanInput } from '@angular/cdk/coercion';
4import { CanDisable } from '@angular/material/core';
5import { CanDisableRipple } from '@angular/material/core';
6import { ChangeDetectorRef } from '@angular/core';
7import { _Constructor } from '@angular/material/core';
8import { ControlValueAccessor } from '@angular/forms';
9import { ElementRef } from '@angular/core';
10import { EventEmitter } from '@angular/core';
11import { FocusableOption } from '@angular/cdk/a11y';
12import { FocusKeyManager } from '@angular/cdk/a11y';
13import { FocusMonitor } from '@angular/cdk/a11y';
14import * as i0 from '@angular/core';
15import * as i3 from '@angular/material/core';
16import * as i4 from '@angular/common';
17import * as i5 from '@angular/material/divider';
18import { InjectionToken } from '@angular/core';
19import { MatLine } from '@angular/material/core';
20import { OnChanges } from '@angular/core';
21import { OnDestroy } from '@angular/core';
22import { OnInit } from '@angular/core';
23import { QueryList } from '@angular/core';
24import { SelectionModel } from '@angular/cdk/collections';
25import { SimpleChanges } from '@angular/core';
26import { Subject } from 'rxjs';
27import { ThemePalette } from '@angular/material/core';
28
29declare namespace i1 {
30 export {
31 MAT_LIST,
32 MAT_NAV_LIST,
33 MatNavList,
34 MatList,
35 MatListAvatarCssMatStyler,
36 MatListIconCssMatStyler,
37 MatListSubheaderCssMatStyler,
38 MatListItem
39 }
40}
41
42declare namespace i2 {
43 export {
44 MAT_SELECTION_LIST_VALUE_ACCESSOR,
45 MatSelectionListChange,
46 MatListOptionCheckboxPosition,
47 MatListOption,
48 MatSelectionList
49 }
50}
51
52/**
53 * Injection token that can be used to inject instances of `MatList`. It serves as
54 * alternative token to the actual `MatList` class which could cause unnecessary
55 * retention of the class and its component metadata.
56 */
57export declare const MAT_LIST: InjectionToken<MatList>;
58
59/**
60 * Injection token that can be used to inject instances of `MatNavList`. It serves as
61 * alternative token to the actual `MatNavList` class which could cause unnecessary
62 * retention of the class and its component metadata.
63 */
64export declare const MAT_NAV_LIST: InjectionToken<MatNavList>;
65
66/** @docs-private */
67export declare const MAT_SELECTION_LIST_VALUE_ACCESSOR: any;
68
69export declare class MatList extends _MatListBase implements CanDisable, CanDisableRipple, OnChanges, OnDestroy {
70 private _elementRef;
71 /** Emits when the state of the list changes. */
72 readonly _stateChanges: Subject<void>;
73 constructor(_elementRef: ElementRef<HTMLElement>);
74 _getListType(): 'list' | 'action-list' | null;
75 ngOnChanges(): void;
76 ngOnDestroy(): void;
77 static ɵfac: i0.ɵɵFactoryDeclaration<MatList, never>;
78 static ɵcmp: i0.ɵɵComponentDeclaration<MatList, "mat-list, mat-action-list", ["matList"], { "disableRipple": "disableRipple"; "disabled": "disabled"; }, {}, never, ["*"], false>;
79}
80
81/**
82 * Directive whose purpose is to add the mat- CSS styling to this selector.
83 * @docs-private
84 */
85export declare class MatListAvatarCssMatStyler {
86 static ɵfac: i0.ɵɵFactoryDeclaration<MatListAvatarCssMatStyler, never>;
87 static ɵdir: i0.ɵɵDirectiveDeclaration<MatListAvatarCssMatStyler, "[mat-list-avatar], [matListAvatar]", never, {}, {}, never, never, false>;
88}
89
90/** @docs-private */
91declare const _MatListBase: _Constructor<CanDisable> & _AbstractConstructor<CanDisable> & _Constructor<CanDisableRipple> & _AbstractConstructor<CanDisableRipple> & {
92 new (): {};
93};
94
95/**
96 * Directive whose purpose is to add the mat- CSS styling to this selector.
97 * @docs-private
98 */
99export declare class MatListIconCssMatStyler {
100 static ɵfac: i0.ɵɵFactoryDeclaration<MatListIconCssMatStyler, never>;
101 static ɵdir: i0.ɵɵDirectiveDeclaration<MatListIconCssMatStyler, "[mat-list-icon], [matListIcon]", never, {}, {}, never, never, false>;
102}
103
104/** An item within a Material Design list. */
105export declare class MatListItem extends _MatListItemMixinBase implements AfterContentInit, CanDisableRipple, OnDestroy {
106 private _element;
107 private _isInteractiveList;
108 private _list?;
109 private readonly _destroyed;
110 _lines: QueryList<MatLine>;
111 _avatar: MatListAvatarCssMatStyler;
112 _icon: MatListIconCssMatStyler;
113 constructor(_element: ElementRef<HTMLElement>, _changeDetectorRef: ChangeDetectorRef, navList?: MatNavList, list?: MatList);
114 /** Whether the option is disabled. */
115 get disabled(): boolean;
116 set disabled(value: BooleanInput);
117 private _disabled;
118 ngAfterContentInit(): void;
119 ngOnDestroy(): void;
120 /** Whether this list item should show a ripple effect when clicked. */
121 _isRippleDisabled(): boolean;
122 /** Retrieves the DOM element of the component host. */
123 _getHostElement(): HTMLElement;
124 static ɵfac: i0.ɵɵFactoryDeclaration<MatListItem, [null, null, { optional: true; }, { optional: true; }]>;
125 static ɵcmp: i0.ɵɵComponentDeclaration<MatListItem, "mat-list-item, a[mat-list-item], button[mat-list-item]", ["matListItem"], { "disableRipple": "disableRipple"; "disabled": "disabled"; }, {}, ["_avatar", "_icon", "_lines"], ["[mat-list-avatar], [mat-list-icon], [matListAvatar], [matListIcon]", "[mat-line], [matLine]", "*"], false>;
126}
127
128/** @docs-private */
129declare const _MatListItemMixinBase: _Constructor<CanDisableRipple> & _AbstractConstructor<CanDisableRipple> & {
130 new (): {};
131};
132
133export declare class MatListModule {
134 static ɵfac: i0.ɵɵFactoryDeclaration<MatListModule, never>;
135 static ɵmod: i0.ɵɵNgModuleDeclaration<MatListModule, [typeof i1.MatList, typeof i1.MatNavList, typeof i1.MatListItem, typeof i1.MatListAvatarCssMatStyler, typeof i1.MatListIconCssMatStyler, typeof i1.MatListSubheaderCssMatStyler, typeof i2.MatSelectionList, typeof i2.MatListOption], [typeof i3.MatLineModule, typeof i3.MatRippleModule, typeof i3.MatCommonModule, typeof i3.MatPseudoCheckboxModule, typeof i4.CommonModule], [typeof i1.MatList, typeof i1.MatNavList, typeof i1.MatListItem, typeof i1.MatListAvatarCssMatStyler, typeof i3.MatLineModule, typeof i3.MatCommonModule, typeof i1.MatListIconCssMatStyler, typeof i1.MatListSubheaderCssMatStyler, typeof i3.MatPseudoCheckboxModule, typeof i2.MatSelectionList, typeof i2.MatListOption, typeof i5.MatDividerModule]>;
136 static ɵinj: i0.ɵɵInjectorDeclaration<MatListModule>;
137}
138
139/**
140 * Component for list-options of selection-list. Each list-option can automatically
141 * generate a checkbox and can put current item into the selectionModel of selection-list
142 * if the current item is selected.
143 */
144export declare class MatListOption extends _MatListOptionBase implements AfterContentInit, OnDestroy, OnInit, FocusableOption, CanDisableRipple {
145 private _element;
146 private _changeDetector;
147 /** @docs-private */
148 selectionList: MatSelectionList;
149 private _selected;
150 private _disabled;
151 private _hasFocus;
152 _avatar: MatListAvatarCssMatStyler;
153 _icon: MatListIconCssMatStyler;
154 _lines: QueryList<MatLine>;
155 /**
156 * Emits when the selected state of the option has changed.
157 * Use to facilitate two-data binding to the `selected` property.
158 * @docs-private
159 */
160 readonly selectedChange: EventEmitter<boolean>;
161 /** DOM element containing the item's text. */
162 _text: ElementRef;
163 /** Whether the label should appear before or after the checkbox. Defaults to 'after' */
164 checkboxPosition: MatListOptionCheckboxPosition;
165 /** Theme color of the list option. This sets the color of the checkbox. */
166 get color(): ThemePalette;
167 set color(newValue: ThemePalette);
168 private _color;
169 /**
170 * This is set to true after the first OnChanges cycle so we don't clear the value of `selected`
171 * in the first cycle.
172 */
173 private _inputsInitialized;
174 /** Value of the option */
175 get value(): any;
176 set value(newValue: any);
177 private _value;
178 /** Whether the option is disabled. */
179 get disabled(): boolean;
180 set disabled(value: BooleanInput);
181 /** Whether the option is selected. */
182 get selected(): boolean;
183 set selected(value: BooleanInput);
184 constructor(_element: ElementRef<HTMLElement>, _changeDetector: ChangeDetectorRef,
185 /** @docs-private */
186 selectionList: MatSelectionList);
187 ngOnInit(): void;
188 ngAfterContentInit(): void;
189 ngOnDestroy(): void;
190 /** Toggles the selection state of the option. */
191 toggle(): void;
192 /** Allows for programmatic focusing of the option. */
193 focus(): void;
194 /**
195 * Returns the list item's text label. Implemented as a part of the FocusKeyManager.
196 * @docs-private
197 */
198 getLabel(): any;
199 /** Whether this list item should show a ripple effect when clicked. */
200 _isRippleDisabled(): boolean;
201 _handleClick(): void;
202 _handleFocus(): void;
203 _handleBlur(): void;
204 /** Retrieves the DOM element of the component host. */
205 _getHostElement(): HTMLElement;
206 /** Sets the selected state of the option. Returns whether the value has changed. */
207 _setSelected(selected: boolean): boolean;
208 /**
209 * Notifies Angular that the option needs to be checked in the next change detection run. Mainly
210 * used to trigger an update of the list option if the disabled state of the selection list
211 * changed.
212 */
213 _markForCheck(): void;
214 static ɵfac: i0.ɵɵFactoryDeclaration<MatListOption, never>;
215 static ɵcmp: i0.ɵɵComponentDeclaration<MatListOption, "mat-list-option", ["matListOption"], { "disableRipple": "disableRipple"; "checkboxPosition": "checkboxPosition"; "color": "color"; "value": "value"; "disabled": "disabled"; "selected": "selected"; }, { "selectedChange": "selectedChange"; }, ["_avatar", "_icon", "_lines"], ["*", "[mat-list-avatar], [mat-list-icon], [matListAvatar], [matListIcon]"], false>;
216}
217
218declare const _MatListOptionBase: _Constructor<CanDisableRipple> & _AbstractConstructor<CanDisableRipple> & {
219 new (): {};
220};
221
222/**
223 * Type describing possible positions of a checkbox in a list option
224 * with respect to the list item's text.
225 */
226export declare type MatListOptionCheckboxPosition = 'before' | 'after';
227
228/**
229 * Directive whose purpose is to add the mat- CSS styling to this selector.
230 * @docs-private
231 */
232export declare class MatListSubheaderCssMatStyler {
233 static ɵfac: i0.ɵɵFactoryDeclaration<MatListSubheaderCssMatStyler, never>;
234 static ɵdir: i0.ɵɵDirectiveDeclaration<MatListSubheaderCssMatStyler, "[mat-subheader], [matSubheader]", never, {}, {}, never, never, false>;
235}
236
237export declare class MatNavList extends _MatListBase implements CanDisable, CanDisableRipple, OnChanges, OnDestroy {
238 /** Emits when the state of the list changes. */
239 readonly _stateChanges: Subject<void>;
240 ngOnChanges(): void;
241 ngOnDestroy(): void;
242 static ɵfac: i0.ɵɵFactoryDeclaration<MatNavList, never>;
243 static ɵcmp: i0.ɵɵComponentDeclaration<MatNavList, "mat-nav-list", ["matNavList"], { "disableRipple": "disableRipple"; "disabled": "disabled"; }, {}, never, ["*"], false>;
244}
245
246/**
247 * Material Design list component where each item is a selectable option. Behaves as a listbox.
248 */
249export declare class MatSelectionList extends _MatSelectionListBase implements CanDisableRipple, AfterContentInit, ControlValueAccessor, OnDestroy, OnChanges {
250 private _element;
251 private _changeDetector;
252 private _focusMonitor;
253 private _multiple;
254 private _contentInitialized;
255 /** The FocusKeyManager which handles focus. */
256 _keyManager: FocusKeyManager<MatListOption>;
257 /** The option components contained within this selection-list. */
258 options: QueryList<MatListOption>;
259 /** Emits a change event whenever the selected state of an option changes. */
260 readonly selectionChange: EventEmitter<MatSelectionListChange>;
261 /** Theme color of the selection list. This sets the checkbox color for all list options. */
262 color: ThemePalette;
263 /**
264 * Function used for comparing an option against the selected value when determining which
265 * options should appear as selected. The first argument is the value of an options. The second
266 * one is a value from the selected value. A boolean must be returned.
267 */
268 compareWith: (o1: any, o2: any) => boolean;
269 /** Whether the selection list is disabled. */
270 get disabled(): boolean;
271 set disabled(value: BooleanInput);
272 private _disabled;
273 /** Whether selection is limited to one or multiple items (default multiple). */
274 get multiple(): boolean;
275 set multiple(value: BooleanInput);
276 /** The currently selected options. */
277 selectedOptions: SelectionModel<MatListOption>;
278 /** The tabindex of the selection list. */
279 _tabIndex: number;
280 /** View to model callback that should be called whenever the selected options change. */
281 private _onChange;
282 /** Keeps track of the currently-selected value. */
283 _value: string[] | null;
284 /** Emits when the list has been destroyed. */
285 private readonly _destroyed;
286 /** View to model callback that should be called if the list or its options lost focus. */
287 _onTouched: () => void;
288 /** Whether the list has been destroyed. */
289 private _isDestroyed;
290 constructor(_element: ElementRef<HTMLElement>, _changeDetector: ChangeDetectorRef, _focusMonitor: FocusMonitor);
291 ngAfterContentInit(): void;
292 ngOnChanges(changes: SimpleChanges): void;
293 ngOnDestroy(): void;
294 /** Focuses the selection list. */
295 focus(options?: FocusOptions): void;
296 /** Selects all of the options. Returns the options that changed as a result. */
297 selectAll(): MatListOption[];
298 /** Deselects all of the options. Returns the options that changed as a result. */
299 deselectAll(): MatListOption[];
300 /** Sets the focused option of the selection-list. */
301 _setFocusedOption(option: MatListOption): void;
302 /**
303 * Removes an option from the selection list and updates the active item.
304 * @returns Currently-active item.
305 */
306 _removeOptionFromList(option: MatListOption): MatListOption | null;
307 /** Passes relevant key presses to our key manager. */
308 _keydown(event: KeyboardEvent): void;
309 /** Reports a value change to the ControlValueAccessor */
310 _reportValueChange(): void;
311 /** Emits a change event if the selected state of an option changed. */
312 _emitChangeEvent(options: MatListOption[]): void;
313 /** Implemented as part of ControlValueAccessor. */
314 writeValue(values: string[]): void;
315 /** Implemented as a part of ControlValueAccessor. */
316 setDisabledState(isDisabled: boolean): void;
317 /** Implemented as part of ControlValueAccessor. */
318 registerOnChange(fn: (value: any) => void): void;
319 /** Implemented as part of ControlValueAccessor. */
320 registerOnTouched(fn: () => void): void;
321 /** Sets the selected options based on the specified values. */
322 private _setOptionsFromValues;
323 /** Returns the values of the selected options. */
324 private _getSelectedOptionValues;
325 /** Toggles the state of the currently focused option if enabled. */
326 private _toggleFocusedOption;
327 /**
328 * Sets the selected state on all of the options
329 * and emits an event if anything changed.
330 */
331 private _setAllOptionsSelected;
332 /**
333 * Utility to ensure all indexes are valid.
334 * @param index The index to be checked.
335 * @returns True if the index is valid for our list of options.
336 */
337 private _isValidIndex;
338 /** Returns the index of the specified list option. */
339 private _getOptionIndex;
340 /** Marks all the options to be checked in the next change detection run. */
341 private _markOptionsForCheck;
342 /**
343 * Removes the tabindex from the selection list and resets it back afterwards, allowing the user
344 * to tab out of it. This prevents the list from capturing focus and redirecting it back within
345 * the list, creating a focus trap if it user tries to tab away.
346 */
347 private _allowFocusEscape;
348 /** Updates the tabindex based upon if the selection list is empty. */
349 private _updateTabIndex;
350 static ɵfac: i0.ɵɵFactoryDeclaration<MatSelectionList, never>;
351 static ɵcmp: i0.ɵɵComponentDeclaration<MatSelectionList, "mat-selection-list", ["matSelectionList"], { "disableRipple": "disableRipple"; "color": "color"; "compareWith": "compareWith"; "disabled": "disabled"; "multiple": "multiple"; }, { "selectionChange": "selectionChange"; }, ["options"], ["*"], false>;
352}
353
354declare const _MatSelectionListBase: _Constructor<CanDisableRipple> & _AbstractConstructor<CanDisableRipple> & {
355 new (): {};
356};
357
358/** Change event that is being fired whenever the selected state of an option changes. */
359export declare class MatSelectionListChange {
360 /** Reference to the selection list that emitted the event. */
361 source: MatSelectionList;
362 /** Reference to the options that have been changed. */
363 options: MatListOption[];
364 constructor(
365 /** Reference to the selection list that emitted the event. */
366 source: MatSelectionList,
367 /** Reference to the options that have been changed. */
368 options: MatListOption[]);
369}
370
371export { }