diff --git a/goldens/cdk/menu/index.api.md b/goldens/cdk/menu/index.api.md index 318e551c75c2..0bb19d86f117 100644 --- a/goldens/cdk/menu/index.api.md +++ b/goldens/cdk/menu/index.api.md @@ -235,7 +235,7 @@ export abstract class CdkMenuTriggerBase implements OnDestroy { abstract close(): void; readonly closed: EventEmitter; protected readonly destroyed: Subject; - protected getMenuContentPortal(): TemplatePortal; + protected getMenuContentPortal(): TemplatePortal | undefined; readonly injector: Injector; protected isElementInsideMenuStack(element: Element): boolean; isOpen(): boolean; diff --git a/goldens/cdk/overlay/index.api.md b/goldens/cdk/overlay/index.api.md index 5f83c88501c8..e5c474f19cbf 100644 --- a/goldens/cdk/overlay/index.api.md +++ b/goldens/cdk/overlay/index.api.md @@ -419,7 +419,7 @@ export interface OverlayConnectionPosition { export class OverlayContainer implements OnDestroy { constructor(...args: unknown[]); // (undocumented) - protected _containerElement: HTMLElement; + protected _containerElement: HTMLElement | undefined; protected _createContainer(): void; // (undocumented) protected _document: Document; diff --git a/src/cdk/a11y/focus-monitor/focus-monitor.ts b/src/cdk/a11y/focus-monitor/focus-monitor.ts index 948d0b78cf87..7d23d712b828 100644 --- a/src/cdk/a11y/focus-monitor/focus-monitor.ts +++ b/src/cdk/a11y/focus-monitor/focus-monitor.ts @@ -93,16 +93,16 @@ export class FocusMonitor implements OnDestroy { private _origin: FocusOrigin = null; /** The FocusOrigin of the last focus event tracked by the FocusMonitor. */ - private _lastFocusOrigin: FocusOrigin; + private _lastFocusOrigin: FocusOrigin = null; /** Whether the window has just been focused. */ private _windowFocused = false; /** The timeout id of the window focus timeout. */ - private _windowFocusTimeoutId: ReturnType; + private _windowFocusTimeoutId: ReturnType | undefined; /** The timeout id of the origin clearing timeout. */ - private _originTimeoutId: ReturnType; + private _originTimeoutId: ReturnType | undefined; /** * Whether the origin was determined via a touch interaction. Necessary as properly attributing @@ -617,7 +617,7 @@ export class CdkMonitorFocus implements AfterViewInit, OnDestroy { private _elementRef = inject>(ElementRef); private _focusMonitor = inject(FocusMonitor); - private _monitorSubscription: Subscription; + private _monitorSubscription: Subscription | undefined; private _focusOrigin: FocusOrigin = null; @Output() readonly cdkFocusChange = new EventEmitter(); @@ -641,9 +641,6 @@ export class CdkMonitorFocus implements AfterViewInit, OnDestroy { ngOnDestroy() { this._focusMonitor.stopMonitoring(this._elementRef); - - if (this._monitorSubscription) { - this._monitorSubscription.unsubscribe(); - } + this._monitorSubscription?.unsubscribe(); } } diff --git a/src/cdk/a11y/focus-trap/focus-trap.ts b/src/cdk/a11y/focus-trap/focus-trap.ts index 225410192f8b..9e9f44ea76b0 100644 --- a/src/cdk/a11y/focus-trap/focus-trap.ts +++ b/src/cdk/a11y/focus-trap/focus-trap.ts @@ -36,8 +36,8 @@ import {_CdkPrivateStyleLoader, _VisuallyHiddenLoader} from '../../private'; * Things like `tabIndex > 0`, flex `order`, and shadow roots can cause the two to be misaligned. */ export class FocusTrap { - private _startAnchor: HTMLElement | null; - private _endAnchor: HTMLElement | null; + private _startAnchor: HTMLElement | null = null; + private _endAnchor: HTMLElement | null = null; private _hasAttached = false; // Event listeners for the anchors. Need to be regular functions so that we can unbind them later. @@ -413,7 +413,7 @@ export class CdkTrapFocus implements OnDestroy, AfterContentInit, OnChanges, DoC private _focusTrapFactory = inject(FocusTrapFactory); /** Underlying FocusTrap instance. */ - focusTrap: FocusTrap; + focusTrap: FocusTrap = undefined!; /** Previously focused element to restore focus to upon destroy when using autoCapture. */ private _previouslyFocusedElement: HTMLElement | null = null; @@ -433,7 +433,8 @@ export class CdkTrapFocus implements OnDestroy, AfterContentInit, OnChanges, DoC * Whether the directive should automatically move focus into the trapped region upon * initialization and return focus to the previous activeElement upon destruction. */ - @Input({alias: 'cdkTrapFocusAutoCapture', transform: booleanAttribute}) autoCapture: boolean; + @Input({alias: 'cdkTrapFocusAutoCapture', transform: booleanAttribute}) + autoCapture: boolean = false; constructor(...args: unknown[]); diff --git a/src/cdk/a11y/high-contrast-mode/high-contrast-mode-detector.ts b/src/cdk/a11y/high-contrast-mode/high-contrast-mode-detector.ts index dbcdfa1de28f..6595ee81fd57 100644 --- a/src/cdk/a11y/high-contrast-mode/high-contrast-mode-detector.ts +++ b/src/cdk/a11y/high-contrast-mode/high-contrast-mode-detector.ts @@ -47,7 +47,7 @@ export class HighContrastModeDetector implements OnDestroy { * Figuring out the high contrast mode and adding the body classes can cause * some expensive layouts. This flag is used to ensure that we only do it once. */ - private _hasCheckedHighContrastMode: boolean; + private _hasCheckedHighContrastMode = false; private _document = inject(DOCUMENT); private _breakpointSubscription: Subscription; diff --git a/src/cdk/a11y/key-manager/list-key-manager.ts b/src/cdk/a11y/key-manager/list-key-manager.ts index f2f9b398e462..8e5b8ad5a10f 100644 --- a/src/cdk/a11y/key-manager/list-key-manager.ts +++ b/src/cdk/a11y/key-manager/list-key-manager.ts @@ -45,7 +45,7 @@ export class ListKeyManager { private _typeaheadSubscription = Subscription.EMPTY; private _itemChangesSubscription?: Subscription; private _vertical = true; - private _horizontal: 'ltr' | 'rtl' | null; + private _horizontal: 'ltr' | 'rtl' | null = null; private _allowedModifierKeys: ListKeyManagerModifierKey[] = []; private _homeAndEnd = false; private _pageUpAndDown = {enabled: false, delta: 10}; diff --git a/src/cdk/a11y/live-announcer/live-announcer.ts b/src/cdk/a11y/live-announcer/live-announcer.ts index 2005f9ee4406..355e99c9b33f 100644 --- a/src/cdk/a11y/live-announcer/live-announcer.ts +++ b/src/cdk/a11y/live-announcer/live-announcer.ts @@ -43,7 +43,7 @@ export class LiveAnnouncer implements OnDestroy { private _liveElement: HTMLElement; private _document = inject(DOCUMENT); private _sanitizer = inject(DomSanitizer); - private _previousTimeout: ReturnType; + private _previousTimeout: ReturnType | undefined; private _currentPromise: Promise | undefined; private _currentResolve: (() => void) | undefined; @@ -250,7 +250,7 @@ export class CdkAriaLive implements OnDestroy { if (this._politeness === 'off') { if (this._subscription) { this._subscription.unsubscribe(); - this._subscription = null; + this._subscription = undefined; } } else if (!this._subscription) { this._subscription = this._ngZone.runOutsideAngular(() => { @@ -271,10 +271,10 @@ export class CdkAriaLive implements OnDestroy { private _politeness: AriaLivePoliteness = 'polite'; /** Time in milliseconds after which to clear out the announcer element. */ - @Input('cdkAriaLiveDuration') duration: number; + @Input('cdkAriaLiveDuration') duration!: number; private _previousAnnouncedText?: string; - private _subscription: Subscription | null; + private _subscription: Subscription | undefined; constructor(...args: unknown[]); @@ -283,8 +283,6 @@ export class CdkAriaLive implements OnDestroy { } ngOnDestroy() { - if (this._subscription) { - this._subscription.unsubscribe(); - } + this._subscription?.unsubscribe(); } } diff --git a/src/cdk/bidi/dir.ts b/src/cdk/bidi/dir.ts index 20c1874718f3..ae85f8e21266 100644 --- a/src/cdk/bidi/dir.ts +++ b/src/cdk/bidi/dir.ts @@ -35,7 +35,7 @@ export class Dir implements Directionality, AfterContentInit, OnDestroy { private _isInitialized: boolean = false; /** Direction as passed in by the consumer. */ - _rawDir: string; + _rawDir: string = ''; /** Event emitted when the direction changes. */ @Output('dirChange') readonly change = new EventEmitter(); diff --git a/src/cdk/bidi/directionality.spec.ts b/src/cdk/bidi/directionality.spec.ts index 295f292bfa05..f21993819f25 100644 --- a/src/cdk/bidi/directionality.spec.ts +++ b/src/cdk/bidi/directionality.spec.ts @@ -170,7 +170,7 @@ class InjectsDirectionality { imports: [Dir, InjectsDirectionality], }) class ElementWithDir { - @ViewChild(Dir) dir: Dir; + @ViewChild(Dir) dir!: Dir; direction = signal('rtl'); changeCount = 0; } @@ -180,7 +180,7 @@ class ElementWithDir { imports: [Dir], }) class ElementWithPredefinedAutoDir { - @ViewChild(Dir) dir: Dir; + @ViewChild(Dir) dir!: Dir; } @Component({ @@ -188,7 +188,7 @@ class ElementWithPredefinedAutoDir { imports: [Dir], }) class ElementWithPredefinedUppercaseDir { - @ViewChild(Dir) dir: Dir; + @ViewChild(Dir) dir!: Dir; } interface FakeDocument { diff --git a/src/cdk/clipboard/copy-to-clipboard.ts b/src/cdk/clipboard/copy-to-clipboard.ts index 4a74f7d69b94..d0fb44cc2421 100644 --- a/src/cdk/clipboard/copy-to-clipboard.ts +++ b/src/cdk/clipboard/copy-to-clipboard.ts @@ -63,7 +63,7 @@ export class CdkCopyToClipboard implements OnDestroy { private _pending = new Set(); /** Whether the directive has been destroyed. */ - private _destroyed: boolean; + private _destroyed = false; /** Timeout for the current copy attempt. */ private _currentTimeout: any; diff --git a/src/cdk/collections/selection-model.ts b/src/cdk/collections/selection-model.ts index 3519e9d5dc76..0b6c0eb0f36f 100644 --- a/src/cdk/collections/selection-model.ts +++ b/src/cdk/collections/selection-model.ts @@ -22,7 +22,7 @@ export class SelectionModel { private _selectedToEmit: T[] = []; /** Cache for the array value of the selected items. */ - private _selected: T[] | null; + private _selected: T[] | null = null; /** Selected values. */ get selected(): T[] { diff --git a/src/cdk/dialog/dialog-container.ts b/src/cdk/dialog/dialog-container.ts index c9b33c7b91f6..5ef4296b59e5 100644 --- a/src/cdk/dialog/dialog-container.ts +++ b/src/cdk/dialog/dialog-container.ts @@ -87,7 +87,7 @@ export class CdkDialogContainer protected _document = inject(DOCUMENT); /** The portal outlet inside of this container into which the dialog content will be loaded. */ - @ViewChild(CdkPortalOutlet, {static: true}) _portalOutlet: CdkPortalOutlet; + @ViewChild(CdkPortalOutlet, {static: true}) _portalOutlet!: CdkPortalOutlet; _focusTrapped: Observable = new Subject(); diff --git a/src/cdk/dialog/dialog-ref.ts b/src/cdk/dialog/dialog-ref.ts index 8794605f3fe7..8aabefff4b42 100644 --- a/src/cdk/dialog/dialog-ref.ts +++ b/src/cdk/dialog/dialog-ref.ts @@ -27,16 +27,16 @@ export class DialogRef { * Instance of component opened into the dialog. Will be * null when the dialog is opened using a `TemplateRef`. */ - readonly componentInstance: C | null; + readonly componentInstance: C | null = null; /** * `ComponentRef` of the component opened into the dialog. Will be * null when the dialog is opened using a `TemplateRef`. */ - readonly componentRef: ComponentRef | null; + readonly componentRef: ComponentRef | null = null; /** Instance of the container that is rendering out the dialog content. */ - readonly containerInstance: DialogContainer; + readonly containerInstance!: DialogContainer; /** Whether the user is allowed to close the dialog. */ disableClose: boolean | undefined; diff --git a/src/cdk/drag-drop/directives/drag-placeholder.ts b/src/cdk/drag-drop/directives/drag-placeholder.ts index e1ffb272c589..7f9a916a0b56 100644 --- a/src/cdk/drag-drop/directives/drag-placeholder.ts +++ b/src/cdk/drag-drop/directives/drag-placeholder.ts @@ -30,7 +30,7 @@ export class CdkDragPlaceholder implements OnDestroy { private _drag = inject(CDK_DRAG_PARENT, {optional: true}); /** Context data to be added to the placeholder template instance. */ - @Input() data: T; + @Input() data!: T; constructor(...args: unknown[]); diff --git a/src/cdk/drag-drop/directives/drag-preview.ts b/src/cdk/drag-drop/directives/drag-preview.ts index bd7674e0668a..10131d5b4ff8 100644 --- a/src/cdk/drag-drop/directives/drag-preview.ts +++ b/src/cdk/drag-drop/directives/drag-preview.ts @@ -38,7 +38,7 @@ export class CdkDragPreview implements OnDestroy { private _drag = inject(CDK_DRAG_PARENT, {optional: true}); /** Context data to be added to the preview template instance. */ - @Input() data: T; + @Input() data!: T; /** Whether the preview should preserve the same size as the item that is being dragged. */ @Input({transform: booleanAttribute}) matchSize: boolean = false; diff --git a/src/cdk/drag-drop/directives/drag.ts b/src/cdk/drag-drop/directives/drag.ts index 436b9935943f..679b4ef2baba 100644 --- a/src/cdk/drag-drop/directives/drag.ts +++ b/src/cdk/drag-drop/directives/drag.ts @@ -81,14 +81,14 @@ export class CdkDrag implements AfterViewInit, OnChanges, OnDestroy { private readonly _destroyed = new Subject(); private _handles = new BehaviorSubject([]); - private _previewTemplate: CdkDragPreview | null; - private _placeholderTemplate: CdkDragPlaceholder | null; + private _previewTemplate: CdkDragPreview | null = null; + private _placeholderTemplate: CdkDragPlaceholder | null = null; /** Reference to the underlying drag instance. */ _dragRef: DragRef>; /** Arbitrary data to attach to this drag instance. */ - @Input('cdkDragData') data: T; + @Input('cdkDragData') data!: T; /** Locks the position of the dragged element along the specified axis. */ @Input('cdkDragLockAxis') lockAxis: DragAxis | null = null; @@ -98,7 +98,7 @@ export class CdkDrag implements AfterViewInit, OnChanges, OnDestroy { * the `cdkDrag` element and going up the DOM. Passing an alternate root element is useful * when trying to enable dragging on an element that you might not have access to. */ - @Input('cdkDragRootElement') rootElementSelector: string; + @Input('cdkDragRootElement') rootElementSelector!: string; /** * Node or selector that will be used to determine the element to which the draggable's @@ -106,19 +106,19 @@ export class CdkDrag implements AfterViewInit, OnChanges, OnDestroy { * will be matched starting from the element's parent and going up the DOM until a match * has been found. */ - @Input('cdkDragBoundary') boundaryElement: string | ElementRef | HTMLElement; + @Input('cdkDragBoundary') boundaryElement!: string | ElementRef | HTMLElement; /** * Amount of milliseconds to wait after the user has put their * pointer down before starting to drag the element. */ - @Input('cdkDragStartDelay') dragStartDelay: DragStartDelay; + @Input('cdkDragStartDelay') dragStartDelay!: DragStartDelay; /** * Sets the position of a `CdkDrag` that is outside of a drop container. * Can be used to restore the element's position for a returning user. */ - @Input('cdkDragFreeDragPosition') freeDragPosition: Point; + @Input('cdkDragFreeDragPosition') freeDragPosition!: Point; /** Whether starting to drag this element is disabled. */ @Input({alias: 'cdkDragDisabled', transform: booleanAttribute}) @@ -129,7 +129,7 @@ export class CdkDrag implements AfterViewInit, OnChanges, OnDestroy { this._disabled = value; this._dragRef.disabled = this._disabled; } - private _disabled: boolean; + private _disabled = false; /** * Function that can be used to customize the logic of how the position of the drag item @@ -140,7 +140,7 @@ export class CdkDrag implements AfterViewInit, OnChanges, OnDestroy { @Input('cdkDragConstrainPosition') constrainPosition?: DragConstrainPosition; /** Class to be added to the preview element. */ - @Input('cdkDragPreviewClass') previewClass: string | string[]; + @Input('cdkDragPreviewClass') previewClass!: string | string[]; /** * Configures the place into which the preview of the item will be inserted. Can be configured @@ -155,7 +155,7 @@ export class CdkDrag implements AfterViewInit, OnChanges, OnDestroy { * - `ElementRef | HTMLElement` - Preview will be inserted into a specific element. * Same advantages and disadvantages as `parent`. */ - @Input('cdkDragPreviewContainer') previewContainer: PreviewContainer; + @Input('cdkDragPreviewContainer') previewContainer!: PreviewContainer; /** * If the parent of the dragged element has a `scale` transform, it can throw off the diff --git a/src/cdk/drag-drop/directives/drop-list-shared.spec.ts b/src/cdk/drag-drop/directives/drop-list-shared.spec.ts index a3ed399ffd21..dda1b75b16c3 100644 --- a/src/cdk/drag-drop/directives/drop-list-shared.spec.ts +++ b/src/cdk/drag-drop/directives/drop-list-shared.spec.ts @@ -5030,15 +5030,15 @@ export function getHorizontalFixtures(listOrientation: Exclude; - @ViewChild(CdkDropList) dropInstance: CdkDropList; + @ViewChildren(CdkDrag) dragItems!: QueryList; + @ViewChild(CdkDropList) dropInstance!: CdkDropList; items = [ {value: 'Zero', width: ITEM_WIDTH, margin: 0}, {value: 'One', width: ITEM_WIDTH, margin: 0}, {value: 'Two', width: ITEM_WIDTH, margin: 0}, {value: 'Three', width: ITEM_WIDTH, margin: 0}, ]; - boundarySelector: string; + boundarySelector!: string; droppedSpy = jasmine.createSpy('dropped spy').and.callFake((event: CdkDragDrop) => { moveItemInArray(this.items, event.previousIndex, event.currentIndex); }); @@ -5113,7 +5113,7 @@ export function getHorizontalFixtures(listOrientation: Exclude; + @ViewChildren(CdkDrag) dragItems!: QueryList; items = ['Zero', 'One', 'Two']; } @@ -5160,9 +5160,9 @@ const DROP_ZONE_FIXTURE_TEMPLATE = ` export class DraggableInDropZone implements AfterViewInit { protected _elementRef = inject(ElementRef); - @ViewChildren(CdkDrag) dragItems: QueryList; - @ViewChild(CdkDropList) dropInstance: CdkDropList; - @ViewChild('alternatePreviewContainer') alternatePreviewContainer: ElementRef; + @ViewChildren(CdkDrag) dragItems!: QueryList; + @ViewChild(CdkDropList) dropInstance!: CdkDropList; + @ViewChild('alternatePreviewContainer') alternatePreviewContainer!: ElementRef; items = [ {value: 'Zero', height: ITEM_HEIGHT, margin: 0}, {value: 'One', height: ITEM_HEIGHT, margin: 0}, @@ -5170,8 +5170,8 @@ export class DraggableInDropZone implements AfterViewInit { {value: 'Three', height: ITEM_HEIGHT, margin: 0}, ]; dropZoneId = 'items'; - boundarySelector: string; - previewClass: string | string[]; + boundarySelector!: string; + previewClass: string | string[] = []; sortedSpy = jasmine.createSpy('sorted spy'); droppedSpy = jasmine.createSpy('dropped spy').and.callFake((event: CdkDragDrop) => { moveItemInArray(this.items, event.previousIndex, event.currentIndex); @@ -5252,7 +5252,7 @@ export class DraggableInScrollableVerticalDropZone extends DraggableInDropZone { imports: [CdkDropList, CdkDrag, NgFor, CdkScrollable], }) class DraggableInScrollableParentContainer extends DraggableInDropZone implements AfterViewInit { - @ViewChild('scrollContainer') scrollContainer: ElementRef; + @ViewChild('scrollContainer') scrollContainer!: ElementRef; constructor() { super(); @@ -5329,19 +5329,19 @@ class DraggableInDropZoneWithContainer extends DraggableInDropZone {} imports: [CdkDropList, CdkDrag, CdkDragPreview, NgIf], }) class DraggableInDropZoneWithCustomPreview { - @ViewChild(CdkDropList) dropInstance: CdkDropList; - @ViewChildren(CdkDrag) dragItems: QueryList; + @ViewChild(CdkDropList) dropInstance!: CdkDropList; + @ViewChildren(CdkDrag) dragItems!: QueryList; items: {label: string; lockAxis?: DragAxis}[] = [ {label: 'Zero'}, {label: 'One'}, {label: 'Two'}, {label: 'Three'}, ]; - boundarySelector: string; + boundarySelector!: string; renderCustomPreview = true; matchPreviewSize = false; - previewClass: string | string[]; - constrainPosition: (point: Point) => Point; + previewClass: string | string[] = []; + constrainPosition: ((point: Point) => Point) | undefined; dropLockAxis = signal(undefined); } @@ -5363,8 +5363,8 @@ class DraggableInDropZoneWithCustomPreview { imports: [CdkDropList, CdkDrag, CdkDragPreview], }) class DraggableInDropZoneWithCustomTextOnlyPreview { - @ViewChild(CdkDropList) dropInstance: CdkDropList; - @ViewChildren(CdkDrag) dragItems: QueryList; + @ViewChild(CdkDropList) dropInstance!: CdkDropList; + @ViewChildren(CdkDrag) dragItems!: QueryList; items = ['Zero', 'One', 'Two', 'Three']; } @@ -5385,8 +5385,8 @@ class DraggableInDropZoneWithCustomTextOnlyPreview { imports: [CdkDropList, CdkDrag, CdkDragPreview], }) class DraggableInDropZoneWithCustomMultiNodePreview { - @ViewChild(CdkDropList) dropInstance: CdkDropList; - @ViewChildren(CdkDrag) dragItems: QueryList; + @ViewChild(CdkDropList) dropInstance!: CdkDropList; + @ViewChildren(CdkDrag) dragItems!: QueryList; items = ['Zero', 'One', 'Two', 'Three']; } @@ -5417,7 +5417,7 @@ class DraggableInDropZoneWithCustomMultiNodePreview { imports: [CdkDropList, CdkDrag, CdkDragPlaceholder, NgClass], }) class DraggableInDropZoneWithCustomPlaceholder { - @ViewChildren(CdkDrag) dragItems: QueryList; + @ViewChildren(CdkDrag) dragItems!: QueryList; items = ['Zero', 'One', 'Two', 'Three']; renderPlaceholder = true; extraPlaceholderClass = ''; @@ -5438,7 +5438,7 @@ class DraggableInDropZoneWithCustomPlaceholder { imports: [CdkDropList, CdkDrag, CdkDragPlaceholder], }) class DraggableInDropZoneWithCustomTextOnlyPlaceholder { - @ViewChildren(CdkDrag) dragItems: QueryList; + @ViewChildren(CdkDrag) dragItems!: QueryList; items = ['Zero', 'One', 'Two', 'Three']; } @@ -5459,7 +5459,7 @@ class DraggableInDropZoneWithCustomTextOnlyPlaceholder { imports: [CdkDropList, CdkDrag, CdkDragPlaceholder], }) class DraggableInDropZoneWithCustomMultiNodePlaceholder { - @ViewChildren(CdkDrag) dragItems: QueryList; + @ViewChildren(CdkDrag) dragItems!: QueryList; items = ['Zero', 'One', 'Two', 'Three']; } @@ -5537,8 +5537,8 @@ const CONNECTED_DROP_ZONES_TEMPLATE = ` imports: [CdkDropList, CdkDrag], }) export class ConnectedDropZones implements AfterViewInit { - @ViewChildren(CdkDrag) rawDragItems: QueryList; - @ViewChildren(CdkDropList) dropInstances: QueryList; + @ViewChildren(CdkDrag) rawDragItems!: QueryList; + @ViewChildren(CdkDropList) dropInstances!: QueryList; changeDetectorRef = inject(ChangeDetectorRef); groupedDragItems: CdkDrag[][] = []; @@ -5652,8 +5652,8 @@ class ConnectedDropZonesViaGroupDirective extends ConnectedDropZones { imports: [CdkDropList, CdkDrag], }) class ConnectedDropZonesWithSingleItems { - @ViewChildren(CdkDrag) dragItems: QueryList; - @ViewChildren(CdkDropList) dropInstances: QueryList; + @ViewChildren(CdkDrag) dragItems!: QueryList; + @ViewChildren(CdkDropList) dropInstances!: QueryList; droppedSpy = jasmine.createSpy('dropped spy'); } @@ -5672,9 +5672,9 @@ class ConnectedDropZonesWithSingleItems { imports: [CdkDropList, CdkDropListGroup], }) class NestedDropListGroups { - @ViewChild('group') group: CdkDropListGroup; - @ViewChild('listOne') listOne: CdkDropList; - @ViewChild('listTwo') listTwo: CdkDropList; + @ViewChild('group') group!: CdkDropListGroup; + @ViewChild('listOne') listOne!: CdkDropList; + @ViewChild('listTwo') listTwo!: CdkDropList; } @Component({ @@ -5700,8 +5700,8 @@ class DropListOnNgContainer {} `, }) class DraggableInDropZoneWithoutEvents { - @ViewChildren(CdkDrag) dragItems: QueryList; - @ViewChild(CdkDropList) dropInstance: CdkDropList; + @ViewChildren(CdkDrag) dragItems!: QueryList; + @ViewChild(CdkDropList) dropInstance!: CdkDropList; items = [ {value: 'Zero', height: ITEM_HEIGHT}, {value: 'One', height: ITEM_HEIGHT}, @@ -5724,7 +5724,7 @@ class DraggableInDropZoneWithoutEvents { changeDetection: ChangeDetectionStrategy.OnPush, }) class WrappedDropContainerComponent { - @Input() items: string[]; + @Input() items: string[] | undefined; } @Component({ @@ -5862,8 +5862,8 @@ class DraggableWithInvalidCanvasInDropZone extends DraggableInDropZone {} imports: [CdkDrag], }) class NestedDragsComponent { - @ViewChild('container') container: ElementRef; - @ViewChild('item') item: ElementRef; + @ViewChild('container') container!: ElementRef; + @ViewChild('item') item!: ElementRef; containerDragStartedSpy = jasmine.createSpy('container drag started spy'); containerDragMovedSpy = jasmine.createSpy('container drag moved spy'); @@ -5916,8 +5916,8 @@ class NestedDragsComponent { imports: [CdkDrag, NgTemplateOutlet], }) class NestedDragsThroughTemplate { - @ViewChild('container') container: ElementRef; - @ViewChild('item') item: ElementRef; + @ViewChild('container') container!: ElementRef; + @ViewChild('item') item!: ElementRef; } @Component({ @@ -5941,9 +5941,9 @@ class NestedDragsThroughTemplate { imports: [CdkDropList, CdkDrag], }) class NestedDropZones { - @ViewChildren(CdkDrag) dragItems: QueryList; - @ViewChild('outerList') outerList: ElementRef; - @ViewChild('innerList') innerList: ElementRef; + @ViewChildren(CdkDrag) dragItems!: QueryList; + @ViewChild('outerList') outerList!: ElementRef; + @ViewChild('innerList') innerList!: ElementRef; items = ['Zero', 'One', 'Two', 'Three']; } @@ -5952,7 +5952,7 @@ class NestedDropZones { imports: [CdkDropList], }) class PlainStandaloneDropList { - @ViewChild(CdkDropList) dropList: CdkDropList; + @ViewChild(CdkDropList) dropList!: CdkDropList; } @Component({ styles: CONNECTED_DROP_ZONES_STYLES, @@ -6048,7 +6048,7 @@ class DraggableWithInputsInDropZone extends DraggableInDropZone { imports: [CdkDropList, CdkDrag], }) class DraggableWithRadioInputsInDropZone { - @ViewChildren(CdkDrag) dragItems: QueryList; + @ViewChildren(CdkDrag) dragItems!: QueryList; items = [ {id: 1, checked: false}, {id: 2, checked: false}, @@ -6121,8 +6121,8 @@ class ConnectedDropZonesWithAlternateContainer extends ConnectedDropZones { imports: [CdkDropList, CdkDrag], }) class DraggableWithInvalidAlternateContainer { - @ViewChildren(CdkDrag) dragItems: QueryList; - @ViewChild(CdkDropList) dropInstance: CdkDropList; + @ViewChildren(CdkDrag) dragItems!: QueryList; + @ViewChild(CdkDropList) dropInstance!: CdkDropList; items = ['Zero', 'One', 'Two', 'Three']; } @@ -6143,7 +6143,7 @@ class DraggableWithInvalidAlternateContainer { imports: [CdkDropList, CdkDrag], }) class DraggableWithMissingAlternateContainer { - @ViewChildren(CdkDrag) dragItems: QueryList; - @ViewChild(CdkDropList) dropInstance: CdkDropList; + @ViewChildren(CdkDrag) dragItems!: QueryList; + @ViewChild(CdkDropList) dropInstance!: CdkDropList; items = ['Zero', 'One', 'Two', 'Three']; } diff --git a/src/cdk/drag-drop/directives/drop-list.ts b/src/cdk/drag-drop/directives/drop-list.ts index 7049d55409d0..a1fc256c8a1a 100644 --- a/src/cdk/drag-drop/directives/drop-list.ts +++ b/src/cdk/drag-drop/directives/drop-list.ts @@ -66,7 +66,7 @@ export class CdkDropList implements OnDestroy { private readonly _destroyed = new Subject(); /** Whether the element's scrollable parents have been resolved. */ - private _scrollableParentsResolved: boolean; + private _scrollableParentsResolved = false; /** Keeps track of the drop lists that are currently on the page. */ private static _dropLists: CdkDropList[] = []; @@ -83,10 +83,10 @@ export class CdkDropList implements OnDestroy { connectedTo: (CdkDropList | string)[] | CdkDropList | string = []; /** Arbitrary data to attach to this container. */ - @Input('cdkDropListData') data: T; + @Input('cdkDropListData') data!: T; /** Direction in which the list is oriented. */ - @Input('cdkDropListOrientation') orientation: DropListOrientation; + @Input('cdkDropListOrientation') orientation: DropListOrientation = 'vertical'; /** * Unique ID for the drop zone. Can be used as a reference @@ -109,11 +109,11 @@ export class CdkDropList implements OnDestroy { // the user in a disabled state, so we also need to sync it as it's being set. this._dropListRef.disabled = this._disabled = value; } - private _disabled: boolean; + private _disabled = false; /** Whether sorting within this drop list is disabled. */ @Input({alias: 'cdkDropListSortingDisabled', transform: booleanAttribute}) - sortingDisabled: boolean; + sortingDisabled: boolean = false; /** * Function that is used to determine whether an item @@ -128,7 +128,7 @@ export class CdkDropList implements OnDestroy { /** Whether to auto-scroll the view when the user moves their pointer close to the edges. */ @Input({alias: 'cdkDropListAutoScrollDisabled', transform: booleanAttribute}) - autoScrollDisabled: boolean; + autoScrollDisabled: boolean = false; /** Number of pixels to scroll for each frame when auto-scrolling an element. */ @Input('cdkDropListAutoScrollStep') @@ -148,7 +148,7 @@ export class CdkDropList implements OnDestroy { * * ``` */ - @Input('cdkDropListElementContainer') elementContainerSelector: string | null; + @Input('cdkDropListElementContainer') elementContainerSelector: string | null = null; /** * By default when an item leaves its initial container, its placeholder will be transferred @@ -162,7 +162,7 @@ export class CdkDropList implements OnDestroy { * behavior in a drop list. */ @Input({alias: 'cdkDropListHasAnchor', transform: booleanAttribute}) - hasAnchor: boolean; + hasAnchor: boolean = false; /** Emits when the user drops an item inside the container. */ @Output('cdkDropListDropped') diff --git a/src/cdk/drag-drop/directives/mixed-drop-list.spec.ts b/src/cdk/drag-drop/directives/mixed-drop-list.spec.ts index ae2f7b480a99..6049c69f33f1 100644 --- a/src/cdk/drag-drop/directives/mixed-drop-list.spec.ts +++ b/src/cdk/drag-drop/directives/mixed-drop-list.spec.ts @@ -134,8 +134,8 @@ function getSortedSiblings(item: Element) { imports: [CdkDropList, CdkDrag], }) class DraggableInHorizontalWrappingDropZone { - @ViewChildren(CdkDrag) dragItems: QueryList; - @ViewChild(CdkDropList) dropInstance: CdkDropList; + @ViewChildren(CdkDrag) dragItems!: QueryList; + @ViewChild(CdkDropList) dropInstance!: CdkDropList; items = ['Zero', 'One', 'Two', 'Three', 'Four', 'Five', 'Six', 'Seven']; droppedSpy = jasmine.createSpy('dropped spy').and.callFake((event: CdkDragDrop) => { moveItemInArray(this.items, event.previousIndex, event.currentIndex); diff --git a/src/cdk/drag-drop/directives/standalone-drag.spec.ts b/src/cdk/drag-drop/directives/standalone-drag.spec.ts index e8cf6bdcbd2b..51dce4d322d4 100644 --- a/src/cdk/drag-drop/directives/standalone-drag.spec.ts +++ b/src/cdk/drag-drop/directives/standalone-drag.spec.ts @@ -1876,19 +1876,21 @@ describe('Standalone CdkDrag', () => { imports: [CdkDrag], }) class StandaloneDraggable { - @ViewChild('dragElement') dragElement: ElementRef; - @ViewChild(CdkDrag) dragInstance: CdkDrag; + @ViewChild('dragElement') dragElement!: ElementRef; + @ViewChild(CdkDrag) dragInstance!: CdkDrag; startedSpy = jasmine.createSpy('started spy'); endedSpy = jasmine.createSpy('ended spy'); releasedSpy = jasmine.createSpy('released spy'); - boundary: string | HTMLElement; - dragStartDelay: number | string | {touch: number; mouse: number}; - constrainPosition: ( - userPointerPosition: Point, - dragRef: DragRef, - dimensions: DOMRect, - pickupPositionInElement: Point, - ) => Point; + boundary: string | HTMLElement | undefined; + dragStartDelay: number | string | {touch: number; mouse: number} | undefined; + constrainPosition: + | (( + userPointerPosition: Point, + dragRef: DragRef, + dimensions: DOMRect, + pickupPositionInElement: Point, + ) => Point) + | undefined; freeDragPosition?: {x: number; y: number}; dragDisabled = signal(false); dragLockAxis = signal(undefined); @@ -1903,8 +1905,8 @@ class StandaloneDraggable { imports: [CdkDrag], }) class StandaloneDraggableWithOnPush { - @ViewChild('dragElement') dragElement: ElementRef; - @ViewChild(CdkDrag) dragInstance: CdkDrag; + @ViewChild('dragElement') dragElement!: ElementRef; + @ViewChild(CdkDrag) dragInstance!: CdkDrag; } @Component({ @@ -1917,10 +1919,10 @@ class StandaloneDraggableWithOnPush { imports: [CdkDrag, CdkDragHandle], }) class StandaloneDraggableWithHandle { - @ViewChild('dragElement') dragElement: ElementRef; - @ViewChild('handleElement') handleElement: ElementRef; - @ViewChild(CdkDrag) dragInstance: CdkDrag; - @ViewChild(CdkDragHandle) handleInstance: CdkDragHandle; + @ViewChild('dragElement') dragElement!: ElementRef; + @ViewChild('handleElement') handleElement!: ElementRef; + @ViewChild(CdkDrag) dragInstance!: CdkDrag; + @ViewChild(CdkDragHandle) handleInstance!: CdkDragHandle; draggingDisabled = false; } @@ -1938,9 +1940,9 @@ class StandaloneDraggableWithHandle { imports: [CdkDrag, CdkDragHandle], }) class StandaloneDraggableWithPreDisabledHandle { - @ViewChild('dragElement') dragElement: ElementRef; - @ViewChild('handleElement') handleElement: ElementRef; - @ViewChild(CdkDrag) dragInstance: CdkDrag; + @ViewChild('dragElement') dragElement!: ElementRef; + @ViewChild('handleElement') handleElement!: ElementRef; + @ViewChild(CdkDrag) dragInstance!: CdkDrag; disableHandle = true; } @@ -1958,8 +1960,8 @@ class StandaloneDraggableWithPreDisabledHandle { imports: [CdkDrag, CdkDragHandle], }) class StandaloneDraggableWithDelayedHandle { - @ViewChild('dragElement') dragElement: ElementRef; - @ViewChild('handleElement') handleElement: ElementRef; + @ViewChild('dragElement') dragElement!: ElementRef; + @ViewChild('handleElement') handleElement!: ElementRef; showHandle = false; } @@ -1989,8 +1991,8 @@ class PassthroughComponent {} imports: [CdkDrag, CdkDragHandle, PassthroughComponent], }) class StandaloneDraggableWithIndirectHandle { - @ViewChild('dragElement') dragElement: ElementRef; - @ViewChild('handleElement') handleElement: ElementRef; + @ViewChild('dragElement') dragElement!: ElementRef; + @ViewChild('handleElement') handleElement!: ElementRef; } @Component({ @@ -2013,8 +2015,8 @@ class ShadowWrapper {} imports: [CdkDrag, CdkDragHandle, ShadowWrapper], }) class StandaloneDraggableWithShadowInsideHandle { - @ViewChild('dragElement') dragElement: ElementRef; - @ViewChild('handleChild') handleChild: ElementRef; + @ViewChild('dragElement') dragElement!: ElementRef; + @ViewChild('handleChild') handleChild!: ElementRef; } @Component({ @@ -2038,8 +2040,8 @@ class StandaloneDraggableWithShadowInsideHandle { imports: [CdkDrag, CdkDragHandle], }) class StandaloneDraggableWithMultipleHandles { - @ViewChild('dragElement') dragElement: ElementRef; - @ViewChildren(CdkDragHandle) handles: QueryList; + @ViewChild('dragElement') dragElement!: ElementRef; + @ViewChildren(CdkDragHandle) handles!: QueryList; } @Component({ @@ -2055,10 +2057,10 @@ class StandaloneDraggableWithMultipleHandles { imports: [CdkDrag], }) class DraggableWithAlternateRoot { - @ViewChild('dragElement') dragElement: ElementRef; - @ViewChild('dragRoot') dragRoot: ElementRef; - @ViewChild(CdkDrag) dragInstance: CdkDrag; - rootElementSelector: string; + @ViewChild('dragElement') dragElement!: ElementRef; + @ViewChild('dragRoot') dragRoot!: ElementRef; + @ViewChild(CdkDrag) dragInstance!: CdkDrag; + rootElementSelector: string | undefined; } @Component({ @@ -2093,9 +2095,9 @@ class DragHandleOnNgContainer {} imports: [CdkDrag, CdkDragHandle], }) class DraggableWithAlternateRootAndSelfHandle { - @ViewChild('dragElement') dragElement: ElementRef; - @ViewChild('dragRoot') dragRoot: ElementRef; - @ViewChild(CdkDrag) dragInstance: CdkDrag; + @ViewChild('dragElement') dragElement!: ElementRef; + @ViewChild('dragRoot') dragRoot!: ElementRef; + @ViewChild(CdkDrag) dragInstance!: CdkDrag; } @Component({ @@ -2109,8 +2111,8 @@ class DraggableWithAlternateRootAndSelfHandle { imports: [CdkDrag], }) class DraggableNgContainerWithAlternateRoot { - @ViewChild('dragRoot') dragRoot: ElementRef; - @ViewChild(CdkDrag) dragInstance: CdkDrag; + @ViewChild('dragRoot') dragRoot!: ElementRef; + @ViewChild(CdkDrag) dragInstance!: CdkDrag; } @Component({ @@ -2118,7 +2120,7 @@ class DraggableNgContainerWithAlternateRoot { imports: [CdkDrag], }) class PlainStandaloneDraggable { - @ViewChild(CdkDrag) dragInstance: CdkDrag; + @ViewChild(CdkDrag) dragInstance!: CdkDrag; } @Component({ @@ -2135,7 +2137,7 @@ class PlainStandaloneDraggable { imports: [CdkDrag, CdkDragHandle, NgTemplateOutlet], }) class StandaloneDraggableWithExternalTemplateHandle { - @ViewChild('dragElement') dragElement: ElementRef; + @ViewChild('dragElement') dragElement!: ElementRef; } @Component({ @@ -2149,10 +2151,10 @@ class StandaloneDraggableWithExternalTemplateHandle { imports: [CdkDrag], }) class DragWithResizeableBoundary { - @ViewChild('boundaryElement') boundaryElement: ElementRef; + @ViewChild('boundaryElement') boundaryElement!: ElementRef; - @ViewChild('dragElement') dragElement: ElementRef; - @ViewChild(CdkDrag) dragInstance: CdkDrag; + @ViewChild('dragElement') dragElement!: ElementRef; + @ViewChild(CdkDrag) dragInstance!: CdkDrag; setBoundary(height: string, width: string) { this.boundaryElement.nativeElement.style.height = height; diff --git a/src/cdk/drag-drop/directives/standalone-drag.zone.spec.ts b/src/cdk/drag-drop/directives/standalone-drag.zone.spec.ts index 19fe5f7b2ce8..8e8512c8d29a 100644 --- a/src/cdk/drag-drop/directives/standalone-drag.zone.spec.ts +++ b/src/cdk/drag-drop/directives/standalone-drag.zone.spec.ts @@ -54,13 +54,13 @@ describe('Standalone CdkDrag Zone.js integration', () => { imports: [CdkDrag], }) class StandaloneDraggable { - @ViewChild('dragElement') dragElement: ElementRef; - @ViewChild(CdkDrag) dragInstance: CdkDrag; + @ViewChild('dragElement') dragElement!: ElementRef; + @ViewChild(CdkDrag) dragInstance!: CdkDrag; startedSpy = jasmine.createSpy('started spy'); endedSpy = jasmine.createSpy('ended spy'); releasedSpy = jasmine.createSpy('released spy'); - boundary: string | HTMLElement; - dragStartDelay: number | string | {touch: number; mouse: number}; - constrainPosition: (point: Point) => Point; - freeDragPosition?: {x: number; y: number}; + boundary: string | HTMLElement | undefined; + dragStartDelay: number | string | {touch: number; mouse: number} | undefined; + constrainPosition: ((point: Point) => Point) | undefined; + freeDragPosition: {x: number; y: number} | undefined; } diff --git a/src/cdk/drag-drop/drag-ref.ts b/src/cdk/drag-drop/drag-ref.ts index 63c83d0881af..83a0292d86ef 100644 --- a/src/cdk/drag-drop/drag-ref.ts +++ b/src/cdk/drag-drop/drag-ref.ts @@ -132,28 +132,28 @@ export class DragRef { private _cleanupShadowRootSelectStart: (() => void) | undefined; /** Element displayed next to the user's pointer while the element is dragged. */ - private _preview: PreviewRef | null; + private _preview: PreviewRef | null = null; /** Container into which to insert the preview. */ private _previewContainer: PreviewContainer | undefined; /** Reference to the view of the placeholder element. */ - private _placeholderRef: EmbeddedViewRef | null; + private _placeholderRef: EmbeddedViewRef | null = null; /** Element that is rendered instead of the draggable item while it is being sorted. */ - private _placeholder: HTMLElement; + private _placeholder!: HTMLElement; /** Coordinates within the element at which the user picked up the element. */ - private _pickupPositionInElement: Point; + private _pickupPositionInElement!: Point; /** Coordinates on the page at which the user picked up the element. */ - private _pickupPositionOnPage: Point; + private _pickupPositionOnPage!: Point; /** * Marker node used to save the place in the DOM where the element was * picked up so that it can be restored at the end of the drag sequence. */ - private _marker: Comment; + private _marker!: Comment; /** * Element indicating the position from which the item was picked up initially. @@ -181,13 +181,13 @@ export class DragRef { private _hasStartedDragging = signal(false); /** Whether the element has moved since the user started dragging it. */ - private _hasMoved: boolean; + private _hasMoved = false; /** Drop container in which the DragRef resided when dragging began. */ - private _initialContainer: DropListRef; + private _initialContainer!: DropListRef; /** Index at which the item started in its initial container. */ - private _initialIndex: number; + private _initialIndex!: number; /** Cached positions of scrollable parent elements. */ private _parentPositions: ParentPositionTracker; @@ -202,30 +202,30 @@ export class DragRef { }>(); /** Keeps track of the direction in which the user is dragging along each axis. */ - private _pointerDirectionDelta: {x: -1 | 0 | 1; y: -1 | 0 | 1}; + private _pointerDirectionDelta!: {x: -1 | 0 | 1; y: -1 | 0 | 1}; /** Pointer position at which the last change in the delta occurred. */ - private _pointerPositionAtLastDirectionChange: Point; + private _pointerPositionAtLastDirectionChange!: Point; /** Position of the pointer at the last pointer event. */ - private _lastKnownPointerPosition: Point; + private _lastKnownPointerPosition!: Point; /** * Root DOM node of the drag instance. This is the element that will * be moved around as the user is dragging. */ - private _rootElement: HTMLElement; + private _rootElement!: HTMLElement; /** * Nearest ancestor SVG, relative to which coordinates are calculated if dragging SVGElement */ - private _ownerSVGElement: SVGSVGElement | null; + private _ownerSVGElement: SVGSVGElement | null = null; /** * Inline style value of `-webkit-tap-highlight-color` at the time the * dragging was started. Used to restore the value once we're done dragging. */ - private _rootElementTapHighlight: string; + private _rootElementTapHighlight!: string; /** Subscription to pointer movement events. */ private _pointerMoveSubscription = Subscription.EMPTY; @@ -244,10 +244,10 @@ export class DragRef { * events multiple times on touch devices where the browser will fire a fake * mouse event for each touch event, after a certain time. */ - private _lastTouchEventTime: number; + private _lastTouchEventTime!: number; /** Time at which the last dragging sequence was started. */ - private _dragStartTime: number; + private _dragStartTime!: number; /** Cached reference to the boundary element. */ private _boundaryElement: HTMLElement | null = null; @@ -283,7 +283,7 @@ export class DragRef { private _direction: Direction = 'ltr'; /** Ref that the current drag item is nested in. */ - private _parentDragRef: DragRef | null; + private _parentDragRef: DragRef | null = null; /** * Cached shadow root that the element is placed in. `null` means that the element isn't in @@ -372,7 +372,7 @@ export class DragRef { }> = this._moveEvents; /** Arbitrary data that can be attached to the drag item. */ - data: T; + data!: T; /** * Function that can be used to customize the logic of how the position of the drag item diff --git a/src/cdk/drag-drop/drop-list-ref.ts b/src/cdk/drag-drop/drop-list-ref.ts index 2e2fd8436676..2c2638981b9a 100644 --- a/src/cdk/drag-drop/drop-list-ref.ts +++ b/src/cdk/drag-drop/drop-list-ref.ts @@ -137,10 +137,10 @@ export class DropListRef { }>(); /** Arbitrary data that can be attached to the drop list. */ - data: T; + data!: T; /** Element that is the direct parent of the drag items. */ - private _container: HTMLElement; + private _container!: HTMLElement; /** Whether an item in the list is being dragged. */ private _isDragging = false; @@ -149,7 +149,7 @@ export class DropListRef { private _parentPositions: ParentPositionTracker; /** Strategy being used to sort items within the list. */ - private _sortStrategy: DropListSortStrategy; + private _sortStrategy!: DropListSortStrategy; /** Cached `DOMRect` of the drop list. */ private _domRect: DOMRect | undefined; @@ -173,7 +173,7 @@ export class DropListRef { private _horizontalScrollDirection = AutoScrollHorizontalDirection.NONE; /** Node that is being auto-scrolled. */ - private _scrollNode: HTMLElement | Window; + private _scrollNode!: HTMLElement | Window; /** Used to signal to the current auto-scroll sequence when to stop. */ private readonly _stopScrollTimers = new Subject(); @@ -188,7 +188,7 @@ export class DropListRef { private _scrollableElements: HTMLElement[] = []; /** Initial value for the element's `scroll-snap-type` style. */ - private _initialScrollSnap: string; + private _initialScrollSnap!: string; /** Direction of the list's layout. */ private _direction: Direction = 'ltr'; diff --git a/src/cdk/drag-drop/preview-ref.ts b/src/cdk/drag-drop/preview-ref.ts index 7ffab115a7fb..f4116ed41cac 100644 --- a/src/cdk/drag-drop/preview-ref.ts +++ b/src/cdk/drag-drop/preview-ref.ts @@ -34,10 +34,10 @@ const importantProperties = new Set([ export class PreviewRef { /** Reference to the view of the preview element. */ - private _previewEmbeddedView: EmbeddedViewRef | null; + private _previewEmbeddedView: EmbeddedViewRef | null = null; /** Reference to the preview element. */ - private _preview: HTMLElement; + private _preview!: HTMLElement; get element(): HTMLElement { return this._preview; diff --git a/src/cdk/drag-drop/sorting/mixed-sort-strategy.ts b/src/cdk/drag-drop/sorting/mixed-sort-strategy.ts index d863fec910d6..e35e0d8c3206 100644 --- a/src/cdk/drag-drop/sorting/mixed-sort-strategy.ts +++ b/src/cdk/drag-drop/sorting/mixed-sort-strategy.ts @@ -19,10 +19,10 @@ import type {DragRef} from '../drag-ref'; */ export class MixedSortStrategy implements DropListSortStrategy { /** Root element container of the drop list. */ - private _element: HTMLElement; + private _element!: HTMLElement; /** Function used to determine if an item can be sorted into a specific index. */ - private _sortPredicate: SortPredicate; + private _sortPredicate!: SortPredicate; /** Lazily-resolved root node containing the list. Use `_getRootNode` to read this. */ private _rootNode: DocumentOrShadowRoot | undefined; @@ -32,7 +32,7 @@ export class MixedSortStrategy implements DropListSortStrategy { * that were there at the start of the sequence, as well as any items that have been dragged * in, but haven't been dropped yet. */ - private _activeItems: DragRef[]; + private _activeItems!: DragRef[]; /** * Keeps track of the item that was last swapped with the dragged item, as well as what direction diff --git a/src/cdk/drag-drop/sorting/single-axis-sort-strategy.ts b/src/cdk/drag-drop/sorting/single-axis-sort-strategy.ts index 68c9c39e94d7..648f52cf6b5f 100644 --- a/src/cdk/drag-drop/sorting/single-axis-sort-strategy.ts +++ b/src/cdk/drag-drop/sorting/single-axis-sort-strategy.ts @@ -36,10 +36,10 @@ interface CachedItemPosition { */ export class SingleAxisSortStrategy implements DropListSortStrategy { /** Root element container of the drop list. */ - private _element: HTMLElement; + private _element!: HTMLElement; /** Function used to determine if an item can be sorted into a specific index. */ - private _sortPredicate: SortPredicate; + private _sortPredicate!: SortPredicate; /** Cache of the dimensions of all the items inside the container. */ private _itemPositions: CachedItemPosition[] = []; @@ -49,13 +49,13 @@ export class SingleAxisSortStrategy implements DropListSortStrategy { * that were there at the start of the sequence, as well as any items that have been dragged * in, but haven't been dropped yet. */ - private _activeDraggables: DragRef[]; + private _activeDraggables!: DragRef[]; /** Direction in which the list is oriented. */ orientation: 'vertical' | 'horizontal' = 'vertical'; /** Layout direction of the drop list. */ - direction: Direction; + direction: Direction = 'ltr'; constructor(private _dragDropRegistry: DragDropRegistry) {} diff --git a/src/cdk/listbox/listbox.spec.ts b/src/cdk/listbox/listbox.spec.ts index a64d1ba0a1e6..d588431d4b5b 100644 --- a/src/cdk/listbox/listbox.spec.ts +++ b/src/cdk/listbox/listbox.spec.ts @@ -123,7 +123,7 @@ describe('CdkOption and CdkListbox', () => { expect(options[i].isSelected()).toBeFalse(); expect(optionEls[i].getAttribute('aria-selected')).toBe('false'); } - expect(fixture.componentInstance.changedOption).toBeUndefined(); + expect(fixture.componentInstance.changedOption).toBe(null); }); it('should update when selection is changed programmatically', () => { @@ -134,7 +134,7 @@ describe('CdkOption and CdkListbox', () => { expect(listbox.value).toEqual(['orange']); expect(options[1].isSelected()).toBeTrue(); expect(optionEls[1].getAttribute('aria-selected')).toBe('true'); - expect(fixture.componentInstance.changedOption).toBeUndefined(); + expect(fixture.componentInstance.changedOption).toBe(null); }); it('should update on option clicked', () => { @@ -403,7 +403,7 @@ describe('CdkOption and CdkListbox', () => { fixture.detectChanges(); expect(listbox.value).toEqual([]); - expect(fixture.componentInstance.changedOption).toBeUndefined(); + expect(fixture.componentInstance.changedOption).toBe(null); }); it('should not change selection on click in a disabled listbox', () => { @@ -415,7 +415,7 @@ describe('CdkOption and CdkListbox', () => { fixture.detectChanges(); expect(listbox.value).toEqual([]); - expect(fixture.componentInstance.changedOption).toBeUndefined(); + expect(fixture.componentInstance.changedOption).toBe(null); }); it('should not change selection on keyboard activation in a disabled listbox', () => { @@ -430,7 +430,7 @@ describe('CdkOption and CdkListbox', () => { fixture.detectChanges(); expect(listbox.value).toEqual([]); - expect(fixture.componentInstance.changedOption).toBeUndefined(); + expect(fixture.componentInstance.changedOption).toBe(null); }); it('should not change selection on click of a disabled option', () => { @@ -446,7 +446,7 @@ describe('CdkOption and CdkListbox', () => { fixture.detectChanges(); expect(listbox.value).toEqual([]); - expect(fixture.componentInstance.changedOption).toBeUndefined(); + expect(fixture.componentInstance.changedOption).toBe(null); }); it('should not handle type ahead on a disabled listbox', async (...args: unknown[]) => { @@ -985,7 +985,7 @@ describe('CdkOption and CdkListbox', () => { imports: [CdkListbox, CdkOption], }) class ListboxWithOptions { - changedOption: CdkOption | null; + changedOption: CdkOption | null = null; isListboxDisabled = signal(false); isAppleDisabled = false; isOrangeDisabled = false; @@ -994,12 +994,12 @@ class ListboxWithOptions { navigationWraps = true; navigationSkipsDisabled = true; appleRendered = true; - listboxId: string; - listboxTabindex: number; - appleId: string; - appleTabindex: number; + listboxId!: string; + listboxTabindex: number | undefined; + appleId!: string; + appleTabindex: number | undefined; orientation: 'horizontal' | 'vertical' = 'vertical'; - selectedValue: string[]; + selectedValue: string[] = []; onSelectionChange(event: ListboxValueChangeEvent) { this.changedOption = event.option; diff --git a/src/cdk/listbox/listbox.ts b/src/cdk/listbox/listbox.ts index 8a327f9a15c4..106cad5cde25 100644 --- a/src/cdk/listbox/listbox.ts +++ b/src/cdk/listbox/listbox.ts @@ -108,17 +108,17 @@ export class CdkOption implements ListKeyManagerOption, Highlightab set id(value) { this._id = value; } - private _id: string; + private _id: string | undefined; private _generatedId = inject(_IdGenerator).getId('cdk-option-'); /** The value of this option. */ - @Input('cdkOption') value: T; + @Input('cdkOption') value!: T; /** * The text used to locate this item during listbox typeahead. If not specified, * the `textContent` of the item will be used. */ - @Input('cdkOptionTypeaheadLabel') typeaheadLabel: string | null; + @Input('cdkOptionTypeaheadLabel') typeaheadLabel: string | null = null; /** Whether this option is disabled. */ @Input({alias: 'cdkOptionDisabled', transform: booleanAttribute}) @@ -271,7 +271,7 @@ export class CdkListbox implements AfterContentInit, OnDestroy, Con set id(value) { this._id = value; } - private _id: string; + private _id: string | undefined; private _generatedId = inject(_IdGenerator).getId('cdk-listbox-'); /** The tabindex to use when the listbox is enabled. */ @@ -384,13 +384,13 @@ export class CdkListbox implements AfterContentInit, OnDestroy, Con @Output('cdkListboxValueChange') readonly valueChange = new Subject>(); /** The child options in this listbox. */ - @ContentChildren(CdkOption, {descendants: true}) protected options: QueryList>; + @ContentChildren(CdkOption, {descendants: true}) protected options!: QueryList>; /** The selection model used by the listbox. */ protected selectionModel = new ListboxSelectionModel(); /** The key manager that manages keyboard navigation for this listbox. */ - protected listKeyManager: ActiveDescendantKeyManager>; + protected listKeyManager!: ActiveDescendantKeyManager>; /** Emits when the listbox is destroyed. */ protected readonly destroyed = new Subject(); diff --git a/src/cdk/menu/context-menu-trigger.spec.ts b/src/cdk/menu/context-menu-trigger.spec.ts index 84a8043777af..609bb5a92915 100644 --- a/src/cdk/menu/context-menu-trigger.spec.ts +++ b/src/cdk/menu/context-menu-trigger.spec.ts @@ -286,7 +286,7 @@ describe('CdkContextMenuTrigger', () => { describe('with menubar and inline menu on page', () => { let fixture: ComponentFixture; let nativeMenuBar: HTMLElement; - let nativeMenuBarTrigger: HTMLElement; + let nativeMenuBarTrigger!: HTMLElement; beforeEach(() => { fixture = TestBed.createComponent(ContextMenuWithMenuBarAndInlineMenu); @@ -423,12 +423,12 @@ describe('CdkContextMenuTrigger', () => { imports: [CdkContextMenuTrigger, CdkMenu, CdkMenuItem], }) class SimpleContextMenu { - @ViewChild(CdkContextMenuTrigger) trigger: CdkContextMenuTrigger; - @ViewChild(CdkContextMenuTrigger, {read: ElementRef}) triggerElement: ElementRef; + @ViewChild(CdkContextMenuTrigger) trigger!: CdkContextMenuTrigger; + @ViewChild(CdkContextMenuTrigger, {read: ElementRef}) triggerElement!: ElementRef; @ViewChild(CdkMenu) menu?: CdkMenu; @ViewChild(CdkMenu, {read: ElementRef}) nativeMenu?: ElementRef; - @ViewChildren(CdkMenu) menus: QueryList; + @ViewChildren(CdkMenu) menus!: QueryList; } @Component({ @@ -452,11 +452,11 @@ class SimpleContextMenu { imports: [CdkContextMenuTrigger, CdkMenu], }) class NestedContextMenu { - @ViewChild('cut_trigger', {read: ElementRef}) cutContext: ElementRef; - @ViewChild('copy_trigger', {read: ElementRef}) copyContext: ElementRef; + @ViewChild('cut_trigger', {read: ElementRef}) cutContext!: ElementRef; + @ViewChild('copy_trigger', {read: ElementRef}) copyContext!: ElementRef; - @ViewChild('cut_menu', {read: CdkMenu}) cutMenu: CdkMenu; - @ViewChild('copy_menu', {read: CdkMenu}) copyMenu: CdkMenu; + @ViewChild('cut_menu', {read: CdkMenu}) cutMenu!: CdkMenu; + @ViewChild('copy_menu', {read: CdkMenu}) copyMenu!: CdkMenu; copyMenuDisabled = false; } @@ -478,11 +478,11 @@ class NestedContextMenu { imports: [CdkContextMenuTrigger, CdkMenuTrigger, CdkMenu, CdkMenuItem], }) class ContextMenuWithSubmenu { - @ViewChild(CdkContextMenuTrigger, {read: ElementRef}) context: ElementRef; - @ViewChild(CdkMenuTrigger, {read: ElementRef}) triggerNativeElement: ElementRef; + @ViewChild(CdkContextMenuTrigger, {read: ElementRef}) context!: ElementRef; + @ViewChild(CdkMenuTrigger, {read: ElementRef}) triggerNativeElement!: ElementRef; - @ViewChild('cut_menu', {read: CdkMenu}) cutMenu: CdkMenu; - @ViewChild('copy_menu', {read: CdkMenu}) copyMenu: CdkMenu; + @ViewChild('cut_menu', {read: CdkMenu}) cutMenu!: CdkMenu; + @ViewChild('copy_menu', {read: CdkMenu}) copyMenu!: CdkMenu; } @Component({ @@ -509,16 +509,16 @@ class ContextMenuWithSubmenu { imports: [CdkContextMenuTrigger, CdkMenuTrigger, CdkMenu, CdkMenuItem, CdkMenuBar], }) class ContextMenuWithMenuBarAndInlineMenu { - @ViewChild(CdkMenuBar, {read: ElementRef}) nativeMenuBar: ElementRef; - @ViewChild('trigger', {read: ElementRef}) nativeMenuBarTrigger: ElementRef; + @ViewChild(CdkMenuBar, {read: ElementRef}) nativeMenuBar!: ElementRef; + @ViewChild('trigger', {read: ElementRef}) nativeMenuBarTrigger!: ElementRef; @ViewChild('context_menu') contextMenu?: CdkMenu; - @ViewChild(CdkContextMenuTrigger, {read: ElementRef}) trigger: ElementRef; + @ViewChild(CdkContextMenuTrigger, {read: ElementRef}) trigger!: ElementRef; @ViewChild('file_menu') fileMenu?: CdkMenu; - @ViewChild('inline_menu') nativeInlineMenu: ElementRef; - @ViewChild('inline_menu_button') nativeInlineMenuButton: ElementRef; + @ViewChild('inline_menu') nativeInlineMenu!: ElementRef; + @ViewChild('inline_menu_button') nativeInlineMenuButton!: ElementRef; } @Component({ @@ -538,9 +538,9 @@ class ContextMenuWithMenuBarAndInlineMenu { imports: [CdkMenuBar, CdkContextMenuTrigger, CdkMenu, CdkMenuItem, CdkMenuTrigger], }) class MenuBarAndContextTriggerShareMenu { - @ViewChild(CdkMenuTrigger) menuBarTrigger: CdkMenuTrigger; - @ViewChild(CdkContextMenuTrigger) contextTrigger: CdkContextMenuTrigger; - @ViewChildren(CdkMenu) menus: QueryList; + @ViewChild(CdkMenuTrigger) menuBarTrigger!: CdkMenuTrigger; + @ViewChild(CdkContextMenuTrigger) contextTrigger!: CdkContextMenuTrigger; + @ViewChildren(CdkMenu) menus!: QueryList; } @Component({ @@ -554,6 +554,6 @@ class MenuBarAndContextTriggerShareMenu { imports: [CdkContextMenuTrigger, CdkMenu], }) class ContextTriggerWithData { - @ViewChild(CdkContextMenuTrigger, {read: ElementRef}) triggerElement: ElementRef; + @ViewChild(CdkContextMenuTrigger, {read: ElementRef}) triggerElement!: ElementRef; menuData: unknown; } diff --git a/src/cdk/menu/menu-aim.ts b/src/cdk/menu/menu-aim.ts index 981f33f16759..2610532a247e 100644 --- a/src/cdk/menu/menu-aim.ts +++ b/src/cdk/menu/menu-aim.ts @@ -117,13 +117,13 @@ export class TargetMenuAim implements MenuAim, OnDestroy { private readonly _points: Point[] = []; /** Reference to the root menu in which we are tracking mouse moves. */ - private _menu: Menu; + private _menu!: Menu; /** Reference to the root menu's mouse manager. */ - private _pointerTracker: PointerFocusTracker; + private _pointerTracker!: PointerFocusTracker; /** The id associated with the current timeout call waiting to resolve. */ - private _timeoutId: number | null; + private _timeoutId: number | null = null; /** Emits when this service is destroyed. */ private readonly _destroyed: Subject = new Subject(); diff --git a/src/cdk/menu/menu-bar.spec.ts b/src/cdk/menu/menu-bar.spec.ts index 348fad1c0c5c..a7017fe5b644 100644 --- a/src/cdk/menu/menu-bar.spec.ts +++ b/src/cdk/menu/menu-bar.spec.ts @@ -1115,11 +1115,11 @@ class MenuBarRadioGroup {} }) class MultiMenuWithSubmenu { clickEmitter = new EventEmitter(); - @ViewChild(CdkMenuBar, {read: ElementRef}) nativeMenuBar: ElementRef; + @ViewChild(CdkMenuBar, {read: ElementRef}) nativeMenuBar!: ElementRef; - @ViewChildren(CdkMenu, {read: ElementRef}) nativeMenus: QueryList; + @ViewChildren(CdkMenu, {read: ElementRef}) nativeMenus!: QueryList; - @ViewChildren(CdkMenuItem, {read: ElementRef}) nativeItems: QueryList; + @ViewChildren(CdkMenuItem, {read: ElementRef}) nativeItems!: QueryList; } @Component({ @@ -1140,13 +1140,13 @@ class MultiMenuWithSubmenu { imports: [CdkMenuModule], }) class MenuWithCheckboxes { - @ViewChild(CdkMenuBar, {read: ElementRef}) nativeMenuBar: ElementRef; + @ViewChild(CdkMenuBar, {read: ElementRef}) nativeMenuBar!: ElementRef; - @ViewChildren(CdkMenu, {read: ElementRef}) nativeMenus: QueryList; + @ViewChildren(CdkMenu, {read: ElementRef}) nativeMenus!: QueryList; - @ViewChildren(CdkMenuItem, {read: ElementRef}) nativeItems: QueryList; + @ViewChildren(CdkMenuItem, {read: ElementRef}) nativeItems!: QueryList; - @ViewChildren(CdkMenuItemCheckbox) checkboxItems: QueryList; + @ViewChildren(CdkMenuItemCheckbox) checkboxItems!: QueryList; } @Component({ @@ -1167,13 +1167,13 @@ class MenuWithCheckboxes { imports: [CdkMenuModule], }) class MenuWithRadioButtons { - @ViewChild(CdkMenuBar, {read: ElementRef}) nativeMenuBar: ElementRef; + @ViewChild(CdkMenuBar, {read: ElementRef}) nativeMenuBar!: ElementRef; - @ViewChildren(CdkMenu, {read: ElementRef}) nativeMenus: QueryList; + @ViewChildren(CdkMenu, {read: ElementRef}) nativeMenus!: QueryList; - @ViewChildren(CdkMenuItem, {read: ElementRef}) nativeItems: QueryList; + @ViewChildren(CdkMenuItem, {read: ElementRef}) nativeItems!: QueryList; - @ViewChildren(CdkMenuItemRadio) radioItems: QueryList; + @ViewChildren(CdkMenuItemRadio) radioItems!: QueryList; } @Component({ @@ -1200,9 +1200,9 @@ class MenuWithRadioButtons { imports: [CdkMenuModule], }) class MenuBarWithMenusAndInlineMenu { - @ViewChildren(CdkMenu) menus: QueryList; + @ViewChildren(CdkMenu) menus!: QueryList; - @ViewChildren(CdkMenuTrigger) triggers: QueryList; + @ViewChildren(CdkMenuTrigger) triggers!: QueryList; - @ViewChild('inline_menu_item') nativeInlineMenuItem: ElementRef; + @ViewChild('inline_menu_item') nativeInlineMenuItem!: ElementRef; } diff --git a/src/cdk/menu/menu-base.ts b/src/cdk/menu/menu-base.ts index 42fae274aac6..c6f2fbe48c29 100644 --- a/src/cdk/menu/menu-base.ts +++ b/src/cdk/menu/menu-base.ts @@ -69,7 +69,7 @@ export abstract class CdkMenuBase /** All items inside the menu, including ones that belong to other menus. */ @ContentChildren(CdkMenuItem, {descendants: true}) - protected _allItems: QueryList; + protected _allItems!: QueryList; /** The id of the menu's host element. */ @Input() id: string = inject(_IdGenerator).getId('cdk-menu-'); @@ -87,7 +87,7 @@ export abstract class CdkMenuBase isInline = false; /** Handles keyboard events for the menu. */ - protected keyManager: FocusKeyManager; + protected keyManager!: FocusKeyManager; /** Emits when the MenuBar is destroyed. */ protected readonly destroyed: Subject = new Subject(); diff --git a/src/cdk/menu/menu-group.spec.ts b/src/cdk/menu/menu-group.spec.ts index f23620d3d379..46bfecb48f80 100644 --- a/src/cdk/menu/menu-group.spec.ts +++ b/src/cdk/menu/menu-group.spec.ts @@ -98,7 +98,7 @@ describe('MenuGroup', () => { imports: [CdkMenuModule], }) class CheckboxMenu { - @ViewChild(CdkMenuItem) readonly trigger: CdkMenuItem; + @ViewChild(CdkMenuItem) readonly trigger!: CdkMenuItem; } @Component({ diff --git a/src/cdk/menu/menu-item-radio.ts b/src/cdk/menu/menu-item-radio.ts index 8fbd60907995..4bf985acb30f 100644 --- a/src/cdk/menu/menu-item-radio.ts +++ b/src/cdk/menu/menu-item-radio.ts @@ -41,7 +41,9 @@ export class CdkMenuItemRadio extends CdkMenuItemSelectable implements OnDestroy constructor() { super(); - this._registerDispatcherListener(); + this._removeDispatcherListener = this._selectionDispatcher.listen((id: string) => { + this.checked = this._id === id; + }); } override ngOnDestroy() { @@ -62,11 +64,4 @@ export class CdkMenuItemRadio extends CdkMenuItemSelectable implements OnDestroy this._selectionDispatcher.notify(this._id, ''); } } - - /** Configure the unique selection dispatcher listener in order to toggle the checked state */ - private _registerDispatcherListener() { - this._removeDispatcherListener = this._selectionDispatcher.listen((id: string) => { - this.checked = this._id === id; - }); - } } diff --git a/src/cdk/menu/menu-item.spec.ts b/src/cdk/menu/menu-item.spec.ts index 1eade63e3cc3..f2081486dffa 100644 --- a/src/cdk/menu/menu-item.spec.ts +++ b/src/cdk/menu/menu-item.spec.ts @@ -164,7 +164,7 @@ class SingleMenuItem {} imports: [CdkMenuModule, FakeMatIcon], }) class MenuItemWithIcon { - typeahead: string; + typeahead: string | null = null; } @Component({ @@ -179,7 +179,7 @@ class MenuItemWithIcon { imports: [CdkMenuModule], }) class MenuItemWithIconClass { - typeahead: string; + typeahead: string | null = null; } @Component({ diff --git a/src/cdk/menu/menu-item.ts b/src/cdk/menu/menu-item.ts index 45ecaf9822f2..b4be5f390d51 100644 --- a/src/cdk/menu/menu-item.ts +++ b/src/cdk/menu/menu-item.ts @@ -76,7 +76,7 @@ export class CdkMenuItem implements FocusableOption, FocusableElement, Toggler, * The text used to locate this item during menu typeahead. If not specified, * the `textContent` of the item will be used. */ - @Input('cdkMenuitemTypeaheadLabel') typeaheadLabel: string | null; + @Input('cdkMenuitemTypeaheadLabel') typeaheadLabel: string | null = null; /** * If this MenuItem is a regular MenuItem, outputs when it is triggered by a keyboard or mouse diff --git a/src/cdk/menu/menu-stack.spec.ts b/src/cdk/menu/menu-stack.spec.ts index 4cedd983fc2c..250ee37d250b 100644 --- a/src/cdk/menu/menu-stack.spec.ts +++ b/src/cdk/menu/menu-stack.spec.ts @@ -97,8 +97,8 @@ describe('MenuStack', () => { imports: [CdkMenuModule], }) class MultiMenuWithSubmenu { - @ViewChild(CdkMenuBar) menuBar: CdkMenuBar; + @ViewChild(CdkMenuBar) menuBar!: CdkMenuBar; - @ViewChildren(CdkMenuTrigger) triggers: QueryList; - @ViewChildren(CdkMenu) menus: QueryList; + @ViewChildren(CdkMenuTrigger) triggers!: QueryList; + @ViewChildren(CdkMenu) menus!: QueryList; } diff --git a/src/cdk/menu/menu-trigger-base.ts b/src/cdk/menu/menu-trigger-base.ts index e5addfc550d6..f9af04696c1f 100644 --- a/src/cdk/menu/menu-trigger-base.ts +++ b/src/cdk/menu/menu-trigger-base.ts @@ -88,7 +88,7 @@ export abstract class CdkMenuTriggerBase implements OnDestroy { * A list of preferred menu positions to be used when constructing the * `FlexibleConnectedPositionStrategy` for this trigger's menu. */ - menuPosition: ConnectedPosition[]; + menuPosition!: ConnectedPosition[]; /** Emits when the attached menu is requested to open */ readonly opened: EventEmitter = new EventEmitter(); @@ -97,7 +97,7 @@ export abstract class CdkMenuTriggerBase implements OnDestroy { readonly closed: EventEmitter = new EventEmitter(); /** Template reference variable to the menu this trigger opens */ - menuTemplateRef: TemplateRef | null; + menuTemplateRef: TemplateRef | null = null; /** Context data to be passed along to the menu template */ menuData: unknown; @@ -124,7 +124,7 @@ export abstract class CdkMenuTriggerBase implements OnDestroy { protected childMenu?: Menu; /** The content of the menu panel opened by this trigger. */ - private _menuPortal: TemplatePortal; + private _menuPortal: TemplatePortal | undefined; /** The injector to use for the child menu opened by this trigger. */ private _childMenuInjector?: Injector; diff --git a/src/cdk/menu/menu-trigger.spec.ts b/src/cdk/menu/menu-trigger.spec.ts index 5ab39eb512c3..a7dfe1649e19 100644 --- a/src/cdk/menu/menu-trigger.spec.ts +++ b/src/cdk/menu/menu-trigger.spec.ts @@ -539,8 +539,8 @@ describe('MenuTrigger', () => { imports: [CdkMenuBar, CdkMenu, CdkMenuItem, CdkMenuTrigger], }) class TriggerForEmptyMenu { - @ViewChild(CdkMenuTrigger) trigger: CdkMenuTrigger; - @ViewChild(CdkMenuTrigger, {read: ElementRef}) nativeTrigger: ElementRef; + @ViewChild(CdkMenuTrigger) trigger!: CdkMenuTrigger; + @ViewChild(CdkMenuTrigger, {read: ElementRef}) nativeTrigger!: ElementRef; } @Component({ @@ -564,13 +564,13 @@ class TriggerForEmptyMenu { imports: [CdkMenu, CdkMenuItem, CdkMenuTrigger, CdkMenuBar], }) class MenuBarWithNestedSubMenus { - @ViewChildren(CdkMenu) menus: QueryList; - @ViewChildren(CdkMenu, {read: ElementRef}) nativeMenus: QueryList; + @ViewChildren(CdkMenu) menus!: QueryList; + @ViewChildren(CdkMenu, {read: ElementRef}) nativeMenus!: QueryList; - @ViewChildren(CdkMenuTrigger) triggers: QueryList; - @ViewChildren(CdkMenuTrigger, {read: ElementRef}) nativeTriggers: QueryList; + @ViewChildren(CdkMenuTrigger) triggers!: QueryList; + @ViewChildren(CdkMenuTrigger, {read: ElementRef}) nativeTriggers!: QueryList; - @ViewChildren(CdkMenuItem) menuItems: QueryList; + @ViewChildren(CdkMenuItem) menuItems!: QueryList; } @Component({ @@ -591,11 +591,11 @@ class MenuBarWithNestedSubMenus { imports: [CdkMenu, CdkMenuItem, CdkMenuTrigger, CdkMenuBar], }) class TriggersWithSameMenuDifferentMenuBars { - @ViewChildren(CdkMenuTrigger) triggers: QueryList; - @ViewChildren(CdkMenuTrigger, {read: ElementRef}) nativeTriggers: QueryList; + @ViewChildren(CdkMenuTrigger) triggers!: QueryList; + @ViewChildren(CdkMenuTrigger, {read: ElementRef}) nativeTriggers!: QueryList; - @ViewChildren(CdkMenu) menus: QueryList; - @ViewChildren(CdkMenu, {read: ElementRef}) nativeMenus: QueryList; + @ViewChildren(CdkMenu) menus!: QueryList; + @ViewChildren(CdkMenu, {read: ElementRef}) nativeMenus!: QueryList; } @Component({ @@ -614,8 +614,8 @@ class TriggersWithSameMenuDifferentMenuBars { imports: [CdkMenu, CdkMenuItem, CdkMenuTrigger, CdkMenuBar], }) class TriggersWithSameMenuSameMenuBar { - @ViewChildren(CdkMenuTrigger) triggers: QueryList; - @ViewChildren(CdkMenu) menus: QueryList; + @ViewChildren(CdkMenuTrigger) triggers!: QueryList; + @ViewChildren(CdkMenu) menus!: QueryList; } @Component({ @@ -633,8 +633,8 @@ class TriggersWithSameMenuSameMenuBar { imports: [CdkMenu, CdkMenuItem, CdkMenuTrigger, CdkMenuBar], }) class TriggerOpensItsMenu { - @ViewChildren(CdkMenuTrigger) triggers: QueryList; - @ViewChildren(CdkMenu) menus: QueryList; + @ViewChildren(CdkMenuTrigger) triggers!: QueryList; + @ViewChildren(CdkMenu) menus!: QueryList; } @Component({ @@ -658,10 +658,10 @@ class TriggerOpensItsMenu { imports: [CdkMenu, CdkMenuItem, CdkMenuTrigger], }) class StandaloneTriggerWithInlineMenu { - @ViewChild(CdkMenuItem, {read: ElementRef}) nativeTrigger: ElementRef; - @ViewChild('submenu_item', {read: ElementRef}) submenuItem?: ElementRef; - @ViewChild('inline_item', {read: ElementRef}) nativeInlineItem: ElementRef; - @ViewChildren(CdkMenu, {read: ElementRef}) nativeMenus: QueryList; + @ViewChild(CdkMenuItem, {read: ElementRef}) nativeTrigger!: ElementRef; + @ViewChild('submenu_item', {read: ElementRef}) submenuItem!: ElementRef; + @ViewChild('inline_item', {read: ElementRef}) nativeInlineItem!: ElementRef; + @ViewChildren(CdkMenu, {read: ElementRef}) nativeMenus!: QueryList; useButtonTrigger = true; } @@ -689,8 +689,8 @@ class TriggerWithData { }) class TriggerWithNullValue { @ViewChild(CdkMenuTrigger, {static: true}) - trigger: CdkMenuTrigger; + trigger!: CdkMenuTrigger; @ViewChild(CdkMenuTrigger, {static: true, read: ElementRef}) - nativeTrigger: ElementRef; + nativeTrigger!: ElementRef; } diff --git a/src/cdk/menu/menu-trigger.ts b/src/cdk/menu/menu-trigger.ts index 3b4d5b48dee3..9f7c63a642ed 100644 --- a/src/cdk/menu/menu-trigger.ts +++ b/src/cdk/menu/menu-trigger.ts @@ -85,7 +85,7 @@ export class CdkMenuTrigger extends CdkMenuTriggerBase implements OnChanges, OnD private readonly _directionality = inject(Directionality, {optional: true}); private readonly _renderer = inject(Renderer2); private readonly _injector = inject(Injector); - private _cleanupMouseenter: () => void; + private _cleanupMouseenter!: () => void; /** The app's menu tracking registry */ private readonly _menuTracker = inject(MenuTracker); diff --git a/src/cdk/menu/menu.spec.ts b/src/cdk/menu/menu.spec.ts index faf38d7255c3..b41fb1c0beb3 100644 --- a/src/cdk/menu/menu.spec.ts +++ b/src/cdk/menu/menu.spec.ts @@ -530,7 +530,7 @@ describe('Menu', () => { imports: [CdkMenuModule], }) class MenuCheckboxGroup { - @ViewChild(CdkMenuItem) readonly trigger: CdkMenuItem; + @ViewChild(CdkMenuItem) readonly trigger!: CdkMenuItem; } @Component({ @@ -596,11 +596,11 @@ class InlineMenu {} imports: [CdkMenuModule], }) class WithComplexNestedMenus { - @ViewChild('file_trigger', {read: ElementRef}) nativeFileTrigger: ElementRef; - @ViewChild('edit_trigger', {read: ElementRef}) nativeEditTrigger?: ElementRef; - @ViewChild('share_trigger', {read: ElementRef}) nativeShareTrigger?: ElementRef; + @ViewChild('file_trigger', {read: ElementRef}) nativeFileTrigger!: ElementRef; + @ViewChild('edit_trigger', {read: ElementRef}) nativeEditTrigger!: ElementRef; + @ViewChild('share_trigger', {read: ElementRef}) nativeShareTrigger!: ElementRef; - @ViewChildren(CdkMenu) menus: QueryList; + @ViewChildren(CdkMenu) menus!: QueryList; } @Component({ @@ -656,11 +656,11 @@ class WithComplexNestedMenus { imports: [CdkMenuModule], }) class WithComplexNestedMenusOnBottom { - @ViewChild('file_trigger', {read: ElementRef}) nativeFileTrigger: ElementRef; - @ViewChild('edit_trigger', {read: ElementRef}) nativeEditTrigger?: ElementRef; - @ViewChild('share_trigger', {read: ElementRef}) nativeShareTrigger?: ElementRef; + @ViewChild('file_trigger', {read: ElementRef}) nativeFileTrigger!: ElementRef; + @ViewChild('edit_trigger', {read: ElementRef}) nativeEditTrigger!: ElementRef; + @ViewChild('share_trigger', {read: ElementRef}) nativeShareTrigger!: ElementRef; - @ViewChildren(CdkMenu) menus: QueryList; + @ViewChildren(CdkMenu) menus!: QueryList; } @Component({ @@ -675,7 +675,7 @@ class WithComplexNestedMenusOnBottom { imports: [CdkMenuModule], }) class MenuWithActiveItem { - @ViewChild(CdkMenu) menu: CdkMenu; + @ViewChild(CdkMenu) menu!: CdkMenu; } @Component({ @@ -694,6 +694,6 @@ class MenuWithActiveItem { imports: [CdkMenuModule], }) class NestedMenuDefinition { - @ViewChild('root', {read: CdkMenu}) root: CdkMenu; - @ViewChild('inner', {read: CdkMenu}) inner: CdkMenu; + @ViewChild('root', {read: CdkMenu}) root!: CdkMenu; + @ViewChild('inner', {read: CdkMenu}) inner!: CdkMenu; } diff --git a/src/cdk/menu/pointer-focus-tracker.spec.ts b/src/cdk/menu/pointer-focus-tracker.spec.ts index 6fba4431e432..6f0e35ce3222 100644 --- a/src/cdk/menu/pointer-focus-tracker.spec.ts +++ b/src/cdk/menu/pointer-focus-tracker.spec.ts @@ -125,10 +125,10 @@ class MultiElementWithConditionalComponent implements AfterViewInit { showThird = false; /** All mock elements. */ - @ViewChildren(MockWrapper) readonly _allItems: QueryList; + @ViewChildren(MockWrapper) readonly _allItems!: QueryList; /** Manages elements under mouse focus. */ - focusTracker: PointerFocusTracker; + focusTracker!: PointerFocusTracker; ngAfterViewInit() { this.focusTracker = new PointerFocusTracker(this._renderer, this._allItems); diff --git a/src/cdk/observers/observe-content.spec.ts b/src/cdk/observers/observe-content.spec.ts index 6cd36f13bf1e..a23c72588cec 100644 --- a/src/cdk/observers/observe-content.spec.ts +++ b/src/cdk/observers/observe-content.spec.ts @@ -283,6 +283,6 @@ class ComponentWithDebouncedListener { imports: [ObserversModule], }) class UnobservedComponentWithTextContent { - @ViewChild('contentEl') contentEl: ElementRef; + @ViewChild('contentEl') contentEl!: ElementRef; text = ''; } diff --git a/src/cdk/observers/observe-content.ts b/src/cdk/observers/observe-content.ts index b6eab4a88634..3fa0664a7aac 100644 --- a/src/cdk/observers/observe-content.ts +++ b/src/cdk/observers/observe-content.ts @@ -203,13 +203,13 @@ export class CdkObserveContent implements AfterContentInit, OnDestroy { /** Debounce interval for emitting the changes. */ @Input() get debounce(): number { - return this._debounce; + return this._debounce!; } set debounce(value: NumberInput) { this._debounce = coerceNumberProperty(value); this._subscribe(); } - private _debounce: number; + private _debounce: number | undefined; private _currentSubscription: Subscription | null = null; diff --git a/src/cdk/observers/private/shared-resize-observer.spec.ts b/src/cdk/observers/private/shared-resize-observer.spec.ts index 15e38cbdb79b..3354a03bda61 100644 --- a/src/cdk/observers/private/shared-resize-observer.spec.ts +++ b/src/cdk/observers/private/shared-resize-observer.spec.ts @@ -137,7 +137,7 @@ describe('SharedResizeObserver', () => { `, }) export class TestComponent { - @ViewChild('el1') el1: ElementRef; - @ViewChild('el2') el2: ElementRef; + @ViewChild('el1') el1!: ElementRef; + @ViewChild('el2') el2!: ElementRef; resizeObserver = inject(SharedResizeObserver); } diff --git a/src/cdk/overlay/dispatchers/base-overlay-dispatcher.ts b/src/cdk/overlay/dispatchers/base-overlay-dispatcher.ts index b4de56aeb0d7..9c4c28490271 100644 --- a/src/cdk/overlay/dispatchers/base-overlay-dispatcher.ts +++ b/src/cdk/overlay/dispatchers/base-overlay-dispatcher.ts @@ -20,7 +20,7 @@ export abstract class BaseOverlayDispatcher implements OnDestroy { _attachedOverlays: OverlayRef[] = []; protected _document = inject(DOCUMENT); - protected _isAttached: boolean; + protected _isAttached = false; constructor(...args: unknown[]); diff --git a/src/cdk/overlay/dispatchers/overlay-outside-click-dispatcher.ts b/src/cdk/overlay/dispatchers/overlay-outside-click-dispatcher.ts index b66e0259d1ae..5077f69cfe0d 100644 --- a/src/cdk/overlay/dispatchers/overlay-outside-click-dispatcher.ts +++ b/src/cdk/overlay/dispatchers/overlay-outside-click-dispatcher.ts @@ -22,9 +22,9 @@ export class OverlayOutsideClickDispatcher extends BaseOverlayDispatcher { private _ngZone = inject(NgZone); private _renderer = inject(RendererFactory2).createRenderer(null, null); - private _cursorOriginalValue: string; + private _cursorOriginalValue!: string; private _cursorStyleIsSet = false; - private _pointerDownEventTarget: HTMLElement | null; + private _pointerDownEventTarget: HTMLElement | null = null; private _cleanups: (() => void)[] | undefined; /** Add a new overlay to the list of attached overlay refs. */ diff --git a/src/cdk/overlay/overlay-container.ts b/src/cdk/overlay/overlay-container.ts index 2d22868b0d3a..5b2f8a69f86c 100644 --- a/src/cdk/overlay/overlay-container.ts +++ b/src/cdk/overlay/overlay-container.ts @@ -32,7 +32,7 @@ export class _CdkOverlayStyleLoader {} export class OverlayContainer implements OnDestroy { protected _platform = inject(Platform); - protected _containerElement: HTMLElement; + protected _containerElement: HTMLElement | undefined; protected _document = inject(DOCUMENT); protected _styleLoader = inject(_CdkPrivateStyleLoader); @@ -56,7 +56,7 @@ export class OverlayContainer implements OnDestroy { this._createContainer(); } - return this._containerElement; + return this._containerElement!; } /** diff --git a/src/cdk/overlay/overlay-directives.ts b/src/cdk/overlay/overlay-directives.ts index f69d079035a9..77d671fba1b7 100644 --- a/src/cdk/overlay/overlay-directives.ts +++ b/src/cdk/overlay/overlay-directives.ts @@ -150,29 +150,30 @@ export class CdkConnectedOverlay implements OnDestroy, OnChanges { private _attachSubscription = Subscription.EMPTY; private _detachSubscription = Subscription.EMPTY; private _positionSubscription = Subscription.EMPTY; - private _offsetX: number; - private _offsetY: number; - private _position: FlexibleConnectedPositionStrategy; + private _offsetX: number | undefined; + private _offsetY: number | undefined; + private _position: FlexibleConnectedPositionStrategy | undefined; private _scrollStrategyFactory = inject(CDK_CONNECTED_OVERLAY_SCROLL_STRATEGY); private _ngZone = inject(NgZone); /** Origin for the connected overlay. */ @Input('cdkConnectedOverlayOrigin') - origin: CdkOverlayOrigin | FlexibleConnectedPositionStrategyOrigin; + origin!: CdkOverlayOrigin | FlexibleConnectedPositionStrategyOrigin; /** Registered connected position pairs. */ - @Input('cdkConnectedOverlayPositions') positions: ConnectedPosition[]; + @Input('cdkConnectedOverlayPositions') positions!: ConnectedPosition[]; /** * This input overrides the positions input if specified. It lets users pass * in arbitrary positioning strategies. */ - @Input('cdkConnectedOverlayPositionStrategy') positionStrategy: FlexibleConnectedPositionStrategy; + @Input('cdkConnectedOverlayPositionStrategy') + positionStrategy!: FlexibleConnectedPositionStrategy; /** The offset in pixels for the overlay connection point on the x-axis */ @Input('cdkConnectedOverlayOffsetX') get offsetX(): number { - return this._offsetX; + return this._offsetX!; } set offsetX(offsetX: number) { this._offsetX = offsetX; @@ -185,7 +186,7 @@ export class CdkConnectedOverlay implements OnDestroy, OnChanges { /** The offset in pixels for the overlay connection point on the y-axis */ @Input('cdkConnectedOverlayOffsetY') get offsetY() { - return this._offsetY; + return this._offsetY!; } set offsetY(offsetY: number) { this._offsetY = offsetY; @@ -196,22 +197,22 @@ export class CdkConnectedOverlay implements OnDestroy, OnChanges { } /** The width of the overlay panel. */ - @Input('cdkConnectedOverlayWidth') width: number | string; + @Input('cdkConnectedOverlayWidth') width!: number | string; /** The height of the overlay panel. */ - @Input('cdkConnectedOverlayHeight') height: number | string; + @Input('cdkConnectedOverlayHeight') height!: number | string; /** The min width of the overlay panel. */ - @Input('cdkConnectedOverlayMinWidth') minWidth: number | string; + @Input('cdkConnectedOverlayMinWidth') minWidth!: number | string; /** The min height of the overlay panel. */ - @Input('cdkConnectedOverlayMinHeight') minHeight: number | string; + @Input('cdkConnectedOverlayMinHeight') minHeight!: number | string; /** The custom class to be set on the backdrop element. */ - @Input('cdkConnectedOverlayBackdropClass') backdropClass: string | string[]; + @Input('cdkConnectedOverlayBackdropClass') backdropClass!: string | string[]; /** The custom class to add to the overlay pane element. */ - @Input('cdkConnectedOverlayPanelClass') panelClass: string | string[]; + @Input('cdkConnectedOverlayPanelClass') panelClass!: string | string[]; /** Margin between the overlay and the viewport edges. */ @Input('cdkConnectedOverlayViewportMargin') viewportMargin: ViewportMargin = 0; @@ -226,7 +227,7 @@ export class CdkConnectedOverlay implements OnDestroy, OnChanges { @Input('cdkConnectedOverlayDisableClose') disableClose: boolean = false; /** CSS selector which to set the transform origin. */ - @Input('cdkConnectedOverlayTransformOriginOn') transformOriginSelector: string; + @Input('cdkConnectedOverlayTransformOriginOn') transformOriginSelector!: string; /** Whether or not the overlay should attach a backdrop. */ @Input({alias: 'cdkConnectedOverlayHasBackdrop', transform: booleanAttribute}) @@ -499,15 +500,15 @@ export class CdkConnectedOverlay implements OnDestroy, OnChanges { // Only subscribe to `positionChanges` if requested, because putting // together all the information for it can be expensive. if (this.positionChange.observers.length > 0) { - this._positionSubscription = this._position.positionChanges - .pipe(takeWhile(() => this.positionChange.observers.length > 0)) - .subscribe(position => { - this._ngZone.run(() => this.positionChange.emit(position)); - - if (this.positionChange.observers.length === 0) { - this._positionSubscription.unsubscribe(); - } - }); + this._positionSubscription = this._position!.positionChanges.pipe( + takeWhile(() => this.positionChange.observers.length > 0), + ).subscribe(position => { + this._ngZone.run(() => this.positionChange.emit(position)); + + if (this.positionChange.observers.length === 0) { + this._positionSubscription.unsubscribe(); + } + }); } this.open = true; diff --git a/src/cdk/overlay/overlay-ref.ts b/src/cdk/overlay/overlay-ref.ts index ab9bae62f63c..f60a8a72ad3c 100644 --- a/src/cdk/overlay/overlay-ref.ts +++ b/src/cdk/overlay/overlay-ref.ts @@ -51,13 +51,13 @@ export class OverlayRef implements PortalOutlet { private _backdropRef: BackdropRef | null = null; private _detachContentMutationObserver: MutationObserver | undefined; private _detachContentAfterRenderRef: AfterRenderRef | undefined; - private _disposed: boolean; + private _disposed = false; /** * Reference to the parent of the `_host` at the time it was detached. Used to restore * the `_host` to its original position in the DOM when it gets re-attached. */ - private _previousHostParent: HTMLElement; + private _previousHostParent!: HTMLElement; /** Stream of keydown events dispatched to this overlay. */ readonly _keydownEvents = new Subject(); diff --git a/src/cdk/overlay/position/connected-position.ts b/src/cdk/overlay/position/connected-position.ts index 8291436b8490..323f8c51f703 100644 --- a/src/cdk/overlay/position/connected-position.ts +++ b/src/cdk/overlay/position/connected-position.ts @@ -81,10 +81,10 @@ export class ConnectionPositionPair { * @docs-private */ export class ScrollingVisibility { - isOriginClipped: boolean; - isOriginOutsideView: boolean; - isOverlayClipped: boolean; - isOverlayOutsideView: boolean; + isOriginClipped: boolean = false; + isOriginOutsideView: boolean = false; + isOverlayClipped: boolean = false; + isOverlayOutsideView: boolean = false; } /** The change event emitted by the strategy when a fallback position is used. */ diff --git a/src/cdk/overlay/position/flexible-connected-position-strategy.ts b/src/cdk/overlay/position/flexible-connected-position-strategy.ts index b31c87411b08..c3f2ee0e6201 100644 --- a/src/cdk/overlay/position/flexible-connected-position-strategy.ts +++ b/src/cdk/overlay/position/flexible-connected-position-strategy.ts @@ -78,10 +78,10 @@ export type FlexibleOverlayPopoverLocation = */ export class FlexibleConnectedPositionStrategy implements PositionStrategy { /** The overlay to which this strategy is attached. */ - private _overlayRef: OverlayRef; + private _overlayRef!: OverlayRef; /** Whether we're performing the very first positioning of the overlay. */ - private _isInitialRender: boolean; + private _isInitialRender = false; /** Last size used for the bounding box. Used to avoid resizing the overlay after open. */ private _lastBoundingBoxSize = {width: 0, height: 0}; @@ -102,16 +102,16 @@ export class FlexibleConnectedPositionStrategy implements PositionStrategy { private _positionLocked = false; /** Cached origin dimensions */ - private _originRect: Dimensions; + private _originRect!: Dimensions; /** Cached overlay dimensions */ - private _overlayRect: Dimensions; + private _overlayRect!: Dimensions; /** Cached viewport dimensions */ - private _viewportRect: Dimensions; + private _viewportRect!: Dimensions; /** Cached container dimensions */ - private _containerRect: Dimensions; + private _containerRect!: Dimensions; /** Amount of space that must be maintained between the overlay and the right edge of the viewport. */ private _viewportMargin: ViewportMargin = 0; @@ -123,25 +123,25 @@ export class FlexibleConnectedPositionStrategy implements PositionStrategy { _preferredPositions: ConnectionPositionPair[] = []; /** The origin element against which the overlay will be positioned. */ - _origin: FlexibleConnectedPositionStrategyOrigin; + _origin!: FlexibleConnectedPositionStrategyOrigin; /** The overlay pane element. */ - private _pane: HTMLElement; + private _pane!: HTMLElement; /** Whether the strategy has been disposed of already. */ - private _isDisposed: boolean; + private _isDisposed = false; /** * Parent element for the overlay panel used to constrain the overlay panel's size to fit * within the viewport. */ - private _boundingBox: HTMLElement | null; + private _boundingBox: HTMLElement | null = null; /** The last position to have been calculated as the best fit position. */ - private _lastPosition: ConnectedPosition | null; + private _lastPosition: ConnectedPosition | null = null; /** The last calculated scroll visibility. Only tracked */ - private _lastScrollVisibility: ScrollingVisibility | null; + private _lastScrollVisibility: ScrollingVisibility | null = null; /** Subject that emits whenever the position changes. */ private readonly _positionChanges = new Subject(); @@ -156,13 +156,13 @@ export class FlexibleConnectedPositionStrategy implements PositionStrategy { private _offsetY = 0; /** Selector to be used when finding the elements on which to set the transform origin. */ - private _transformOriginSelector: string; + private _transformOriginSelector!: string; /** Keeps track of the CSS classes that the position strategy has applied on the overlay panel. */ private _appliedPanelClasses: string[] = []; /** Amount by which the overlay was pushed in each axis during the last time it was positioned. */ - private _previousPushAmount: {x: number; y: number} | null; + private _previousPushAmount: {x: number; y: number} | null = null; /** Configures where in the DOM to insert the overlay when popovers are enabled. */ private _popoverLocation: FlexibleOverlayPopoverLocation = 'global'; diff --git a/src/cdk/overlay/position/global-position-strategy.ts b/src/cdk/overlay/position/global-position-strategy.ts index 2c0f11dabcc4..82142aebc8ae 100644 --- a/src/cdk/overlay/position/global-position-strategy.ts +++ b/src/cdk/overlay/position/global-position-strategy.ts @@ -29,7 +29,7 @@ export function createGlobalPositionStrategy(_injector: Injector): GlobalPositio */ export class GlobalPositionStrategy implements PositionStrategy { /** The overlay to which this strategy is attached. */ - private _overlayRef: OverlayRef; + private _overlayRef!: OverlayRef; private _cssPosition = 'static'; private _topOffset = ''; private _bottomOffset = ''; diff --git a/src/cdk/overlay/scroll/block-scroll-strategy.ts b/src/cdk/overlay/scroll/block-scroll-strategy.ts index e3d28d3e5406..e3a5930e6d59 100644 --- a/src/cdk/overlay/scroll/block-scroll-strategy.ts +++ b/src/cdk/overlay/scroll/block-scroll-strategy.ts @@ -28,7 +28,7 @@ export function createBlockScrollStrategy(injector: Injector): BlockScrollStrate */ export class BlockScrollStrategy implements ScrollStrategy { private _previousHTMLStyles = {top: '', left: ''}; - private _previousScrollPosition: {top: number; left: number}; + private _previousScrollPosition: {top: number; left: number} | undefined; private _isEnabled = false; private _document: Document; @@ -87,7 +87,7 @@ export class BlockScrollStrategy implements ScrollStrategy { htmlStyle.scrollBehavior = bodyStyle.scrollBehavior = 'auto'; } - window.scroll(this._previousScrollPosition.left, this._previousScrollPosition.top); + window.scroll(this._previousScrollPosition!.left, this._previousScrollPosition!.top); if (scrollBehaviorSupported) { htmlStyle.scrollBehavior = previousHtmlScrollBehavior; diff --git a/src/cdk/overlay/scroll/close-scroll-strategy.ts b/src/cdk/overlay/scroll/close-scroll-strategy.ts index 2703e386352d..8c0a3e04e22c 100644 --- a/src/cdk/overlay/scroll/close-scroll-strategy.ts +++ b/src/cdk/overlay/scroll/close-scroll-strategy.ts @@ -42,8 +42,8 @@ export function createCloseScrollStrategy( */ export class CloseScrollStrategy implements ScrollStrategy { private _scrollSubscription: Subscription | null = null; - private _overlayRef: OverlayRef; - private _initialScrollPosition: number; + private _overlayRef!: OverlayRef; + private _initialScrollPosition!: number; constructor( private _scrollDispatcher: ScrollDispatcher, diff --git a/src/cdk/overlay/scroll/reposition-scroll-strategy.ts b/src/cdk/overlay/scroll/reposition-scroll-strategy.ts index 1c30c1c6e8b9..a16893ae4b4b 100644 --- a/src/cdk/overlay/scroll/reposition-scroll-strategy.ts +++ b/src/cdk/overlay/scroll/reposition-scroll-strategy.ts @@ -46,7 +46,7 @@ export function createRepositionScrollStrategy( */ export class RepositionScrollStrategy implements ScrollStrategy { private _scrollSubscription: Subscription | null = null; - private _overlayRef: OverlayRef; + private _overlayRef!: OverlayRef; constructor( private _scrollDispatcher: ScrollDispatcher, diff --git a/src/cdk/portal/portal-directives.ts b/src/cdk/portal/portal-directives.ts index e50814e91e9b..22269dd2111c 100644 --- a/src/cdk/portal/portal-directives.ts +++ b/src/cdk/portal/portal-directives.ts @@ -69,7 +69,7 @@ export class CdkPortalOutlet extends BasePortalOutlet implements OnInit, OnDestr private _isInitialized = false; /** Reference to the currently-attached component/view ref. */ - private _attachedRef: CdkPortalOutletAttachedRef; + private _attachedRef: CdkPortalOutletAttachedRef = null; constructor(...args: unknown[]); diff --git a/src/cdk/portal/portal.ts b/src/cdk/portal/portal.ts index 7865c6d0781e..e67cf3db866a 100644 --- a/src/cdk/portal/portal.ts +++ b/src/cdk/portal/portal.ts @@ -33,7 +33,7 @@ export interface ComponentType { * It can be attach to / detached from a `PortalOutlet`. */ export abstract class Portal { - private _attachedHost: PortalOutlet | null; + private _attachedHost: PortalOutlet | null = null; /** Attach this portal to a host. */ attach(host: PortalOutlet): T { @@ -186,10 +186,10 @@ export interface PortalOutlet { */ export abstract class BasePortalOutlet implements PortalOutlet { /** The portal currently attached to the host. */ - protected _attachedPortal: Portal | null; + protected _attachedPortal: Portal | null = null; /** A function that will permanently dispose this host. */ - private _disposeFn: (() => void) | null; + private _disposeFn: (() => void) | null = null; /** Whether this host has already been permanently disposed. */ private _isDisposed: boolean = false; diff --git a/src/cdk/scrolling/viewport-ruler.ts b/src/cdk/scrolling/viewport-ruler.ts index 66ea77dd9f79..b3b65a586b36 100644 --- a/src/cdk/scrolling/viewport-ruler.ts +++ b/src/cdk/scrolling/viewport-ruler.ts @@ -30,7 +30,7 @@ export class ViewportRuler implements OnDestroy { private _listeners: (() => void)[] | undefined; /** Cached viewport dimensions. */ - private _viewportSize: {width: number; height: number} | null; + private _viewportSize: {width: number; height: number} | null = null; /** Stream of viewport change events. */ private readonly _change = new Subject(); diff --git a/src/cdk/scrolling/virtual-for-of.ts b/src/cdk/scrolling/virtual-for-of.ts index 564486c70b1a..2173510ea50b 100644 --- a/src/cdk/scrolling/virtual-for-of.ts +++ b/src/cdk/scrolling/virtual-for-of.ts @@ -169,13 +169,13 @@ export class CdkVirtualForOf private _differ: IterableDiffer | null = null; /** The most recent data emitted from the DataSource. */ - private _data: readonly T[]; + private _data: readonly T[] = []; /** The currently rendered items. */ - private _renderedItems: T[]; + private _renderedItems: T[] = []; /** The currently rendered range of indices. */ - private _renderedRange: ListRange; + private _renderedRange: ListRange = {start: 0, end: 0}; /** Whether the rendered data should be updated during the next ngDoCheck cycle. */ private _needsUpdate = false; diff --git a/src/cdk/scrolling/virtual-scroll-viewport.ts b/src/cdk/scrolling/virtual-scroll-viewport.ts index e3aeebeb8bd2..27f8ae2ea710 100644 --- a/src/cdk/scrolling/virtual-scroll-viewport.ts +++ b/src/cdk/scrolling/virtual-scroll-viewport.ts @@ -137,7 +137,7 @@ export class CdkVirtualScrollViewport extends CdkVirtualScrollable implements On ); /** The element that wraps the rendered content. */ - @ViewChild('contentWrapper', {static: true}) _contentWrapper: ElementRef; + @ViewChild('contentWrapper', {static: true}) _contentWrapper!: ElementRef; /** A stream that emits whenever the rendered range changes. */ readonly renderedRangeStream: Observable = this._renderedRangeSubject; @@ -165,7 +165,7 @@ export class CdkVirtualScrollViewport extends CdkVirtualScrollable implements On * The CSS transform applied to the rendered subset of items so that they appear within the bounds * of the visible viewport. */ - private _renderedContentTransform: string; + private _renderedContentTransform: string | undefined; /** The currently rendered range of indices. */ private _renderedRange: ListRange = {start: 0, end: 0}; @@ -177,7 +177,7 @@ export class CdkVirtualScrollViewport extends CdkVirtualScrollable implements On private _viewportSize = 0; /** the currently attached CdkVirtualScrollRepeater. */ - private _forOf: CdkVirtualScrollRepeater | null; + private _forOf: CdkVirtualScrollRepeater | null = null; /** The last rendered content offset that was set. */ private _renderedContentOffset = 0; @@ -545,7 +545,7 @@ export class CdkVirtualScrollViewport extends CdkVirtualScrollable implements On // bypassSecurityTrustStyle is banned in Google. However the value is safe, it's composed of // string literals, a variable that can only be 'X' or 'Y', and user input that is run through // the `Number` function first to coerce it to a numeric value. - this._contentWrapper.nativeElement.style.transform = this._renderedContentTransform; + this._contentWrapper.nativeElement.style.transform = this._renderedContentTransform!; this._renderedContentOffsetSubject.next(this.getOffsetToRenderedContentStart()); afterNextRender( diff --git a/src/cdk/stepper/stepper.ts b/src/cdk/stepper/stepper.ts index 06d82f8af560..259a897c1dba 100644 --- a/src/cdk/stepper/stepper.ts +++ b/src/cdk/stepper/stepper.ts @@ -60,16 +60,16 @@ export type StepperOrientation = 'horizontal' | 'vertical'; /** Change event emitted on selection changes. */ export class StepperSelectionEvent { /** Index of the step now selected. */ - selectedIndex: number; + selectedIndex!: number; /** Index of the step previously selected. */ - previouslySelectedIndex: number; + previouslySelectedIndex!: number; /** The step instance now selected. */ - selectedStep: CdkStep; + selectedStep!: CdkStep; /** The step instance previously selected. */ - previouslySelectedStep: CdkStep; + previouslySelectedStep!: CdkStep; } /** The state of each step. */ @@ -115,7 +115,7 @@ export class CdkStep implements OnChanges { _displayDefaultIndicatorType: boolean; /** Template for step label if it exists. */ - @ContentChild(CdkStepLabel) stepLabel: CdkStepLabel; + @ContentChild(CdkStepLabel) stepLabel!: CdkStepLabel; /** Forms that have been projected into the step. */ @ContentChildren( @@ -131,10 +131,10 @@ export class CdkStep implements OnChanges { protected _childForms: QueryList> | undefined; /** Template for step content. */ - @ViewChild(TemplateRef, {static: true}) content: TemplateRef; + @ViewChild(TemplateRef, {static: true}) content!: TemplateRef; /** The top level abstract control of the step. */ - @Input() stepControl: AbstractControl; + @Input() stepControl!: AbstractControl; /** Whether user has attempted to move away from the step. */ get interacted(): boolean { @@ -150,19 +150,19 @@ export class CdkStep implements OnChanges { readonly interactedStream: EventEmitter = new EventEmitter(); /** Plain text label of the step. */ - @Input() label: string; + @Input() label!: string; /** Error message to display when there's an error. */ - @Input() errorMessage: string; + @Input() errorMessage!: string; /** Aria label for the tab. */ - @Input('aria-label') ariaLabel: string; + @Input('aria-label') ariaLabel!: string; /** * Reference to the element that the tab is labelled by. * Will be cleared if `aria-label` is set at the same time. */ - @Input('aria-labelledby') ariaLabelledby: string; + @Input('aria-labelledby') ariaLabelledby!: string; /** State of the step. */ @Input() @@ -329,13 +329,13 @@ export class CdkStepper implements AfterContentInit, AfterViewInit, OnDestroy { private _keyManager: FocusKeyManager | undefined; /** Full list of steps inside the stepper, including inside nested steppers. */ - @ContentChildren(CdkStep, {descendants: true}) _steps: QueryList; + @ContentChildren(CdkStep, {descendants: true}) _steps!: QueryList; /** Steps that belong to the current stepper, excluding ones from nested steppers. */ readonly steps: QueryList = new QueryList(); /** The list of step headers of the steps in the stepper. */ - @ContentChildren(CdkStepHeader, {descendants: true}) _stepHeader: QueryList; + @ContentChildren(CdkStepHeader, {descendants: true}) _stepHeader!: QueryList; /** List of step headers sorted based on their DOM order. */ private _sortedHeaders = new QueryList(); diff --git a/src/cdk/table/cell.ts b/src/cdk/table/cell.ts index 3174953b886a..37d4fca1d426 100644 --- a/src/cdk/table/cell.ts +++ b/src/cdk/table/cell.ts @@ -89,7 +89,7 @@ export class CdkColumnDef implements CanStick { set name(name: string) { this._setNameInput(name); } - protected _name: string; + protected _name!: string; /** Whether the cell is sticky. */ @Input({transform: booleanAttribute}) @@ -122,26 +122,26 @@ export class CdkColumnDef implements CanStick { _stickyEnd: boolean = false; /** @docs-private */ - @ContentChild(CdkCellDef) cell: CdkCellDef; + @ContentChild(CdkCellDef) cell!: CdkCellDef; /** @docs-private */ - @ContentChild(CdkHeaderCellDef) headerCell: CdkHeaderCellDef; + @ContentChild(CdkHeaderCellDef) headerCell!: CdkHeaderCellDef; /** @docs-private */ - @ContentChild(CdkFooterCellDef) footerCell: CdkFooterCellDef; + @ContentChild(CdkFooterCellDef) footerCell!: CdkFooterCellDef; /** * Transformed version of the column name that can be used as part of a CSS classname. Excludes * all non-alphanumeric characters and the special characters '-' and '_'. Any characters that * do not match are replaced by the '-' character. */ - cssClassFriendlyName: string; + cssClassFriendlyName!: string; /** * Class name for cells in this column. * @docs-private */ - _columnCssClassName: string[]; + _columnCssClassName!: string[]; constructor(...args: unknown[]); constructor() {} diff --git a/src/cdk/table/row.ts b/src/cdk/table/row.ts index 588c83eaf525..1205a883aa30 100644 --- a/src/cdk/table/row.ts +++ b/src/cdk/table/row.ts @@ -43,10 +43,10 @@ export abstract class BaseRowDef implements OnChanges { protected _differs = inject(IterableDiffers); /** The columns to be displayed on this row. */ - columns: Iterable; + columns!: Iterable; /** Differ used to check if any changes were made to the columns. */ - protected _columnsDiffer: IterableDiffer; + protected _columnsDiffer!: IterableDiffer; constructor(...args: unknown[]); constructor() {} @@ -205,7 +205,7 @@ export class CdkRowDef extends BaseRowDef { * when no other when functions return true for the data. * For every row, there must be at least one when function that passes or an undefined to default. */ - when: (index: number, rowData: T) => boolean; + when!: (index: number, rowData: T) => boolean; constructor(...args: unknown[]); @@ -282,7 +282,7 @@ export class CdkCellOutlet implements OnDestroy { _viewContainer = inject(ViewContainerRef); /** The ordered list of cells to render within this outlet's view container */ - cells: CdkCellDef[]; + cells!: CdkCellDef[]; /** The data context to be provided to each cell */ context: any; diff --git a/src/cdk/table/table.spec.ts b/src/cdk/table/table.spec.ts index 99dea6982ef5..842033adad87 100644 --- a/src/cdk/table/table.spec.ts +++ b/src/cdk/table/table.spec.ts @@ -2209,7 +2209,7 @@ class SimpleCdkTableApp { columnsToRender = ['column_a', 'column_b', 'column_c']; contentChangedCount = 0; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; } @Component({ @@ -2240,7 +2240,7 @@ class CdkTableWithDifferentDataInputsApp { dataSource: DataSource | Observable | TestData[] | any = null; columnsToRender = ['column_a', 'column_b', 'column_c']; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; } @Component({ @@ -2375,7 +2375,7 @@ class WhenRowCdkTableApp { this.dataSource.addData(); } - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; showIndexColumns() { const indexColumns = ['index', 'dataIndex', 'renderIndex']; @@ -2480,7 +2480,7 @@ class WhenRowWithoutDefaultCdkTableApp { isIndex1 = (index: number, _rowData: TestData) => index == 1; hasC3 = (_index: number, rowData: TestData) => rowData.c == 'c_3'; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; } @Component({ @@ -2524,7 +2524,7 @@ class WhenRowMultipleDefaultsCdkTableApp { columnsToRender = ['column_a', 'column_b', 'column_c']; hasC3 = (_index: number, rowData: TestData) => rowData.c == 'c_3'; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; } @Component({ @@ -2542,10 +2542,10 @@ class WhenRowMultipleDefaultsCdkTableApp { imports: [CdkTableModule], }) class DynamicDataSourceCdkTableApp { - dataSource: FakeDataSource; + dataSource!: FakeDataSource; columnsToRender = ['column_a']; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; } @Component({ @@ -2573,7 +2573,7 @@ class TrackByCdkTableApp { dataSource = new FakeDataSource(); columnsToRender = ['column_a', 'column_b']; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; trackBy = (index: number, item: TestData) => { switch (this.trackByStrategy) { @@ -2656,7 +2656,7 @@ class StickyFlexLayoutCdkTableApp extends StickyPositioningListenerTest { dataSource = new FakeDataSource(); columns = ['column-1', 'column-2', 'column-3', 'column-4', 'column-5', 'column-6']; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; dir: Direction = 'ltr'; stickyHeaders: string[] = []; @@ -2713,7 +2713,7 @@ class StickyNativeLayoutCdkTableApp extends StickyPositioningListenerTest { dataSource = new FakeDataSource(); columns = ['column-1', 'column-2', 'column-3', 'column-4', 'column-5', 'column-6']; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; stickyHeaders: string[] = []; stickyFooters: string[] = []; @@ -2745,7 +2745,7 @@ class DynamicColumnDefinitionsCdkTableApp { dynamicColumns: any[] = []; dataSource = new FakeDataSource(); - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; } @Component({ @@ -2766,7 +2766,7 @@ class CustomRoleCdkTableApp { dataSource = new FakeDataSource(); columnsToRender = ['column_a']; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; } @Component({ @@ -2787,7 +2787,7 @@ class CrazyColumnNameCdkTableApp { dataSource = new FakeDataSource(); columnsToRender = ['crazy-column-NAME-1!@#$%^-_&*()2']; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; } @Component({ @@ -2846,7 +2846,7 @@ class MissingColumnDefCdkTableApp { imports: [CdkTableModule], }) class MissingColumnDefAfterRenderCdkTableApp implements AfterViewInit { - dataSource: FakeDataSource; + dataSource!: FakeDataSource; displayedColumns: string[] = []; cdr = inject(ChangeDetectorRef); @@ -2945,7 +2945,7 @@ class MissingFooterRowDefCdkTableApp { imports: [CdkTableModule], }) class UndefinedColumnsCdkTableApp { - undefinedColumns: string[]; + undefinedColumns: string[] | undefined; dataSource = new FakeDataSource(); } @@ -3006,15 +3006,15 @@ class RowContextCdkTableApp { imports: [CdkTableModule], }) class WrapperCdkTableApp implements AfterContentInit { - @ContentChildren(CdkColumnDef, {descendants: false}) columnDefs: QueryList; - @ContentChild(CdkHeaderRowDef) headerRowDef: CdkHeaderRowDef; - @ContentChildren(CdkRowDef, {descendants: false}) rowDefs: QueryList>; - @ContentChild(CdkNoDataRow) noDataRow: CdkNoDataRow; + @ContentChildren(CdkColumnDef, {descendants: false}) columnDefs!: QueryList; + @ContentChild(CdkHeaderRowDef) headerRowDef!: CdkHeaderRowDef; + @ContentChildren(CdkRowDef, {descendants: false}) rowDefs!: QueryList>; + @ContentChild(CdkNoDataRow) noDataRow!: CdkNoDataRow; - @ViewChild(CdkTable, {static: true}) table: CdkTable; + @ViewChild(CdkTable, {static: true}) table!: CdkTable; - @Input() columns: string[]; - @Input() dataSource: DataSource; + @Input() columns!: string[]; + @Input() dataSource!: DataSource; ngAfterContentInit() { // Register the content's column, row, and header row definitions. @@ -3092,7 +3092,7 @@ class NativeHtmlTableApp { dataSource = new FakeDataSource(); columnsToRender = ['column_a', 'column_b', 'column_c']; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; } @Component({ @@ -3171,7 +3171,7 @@ class NativeTableWithNoHeaderOrFooterRows { dataSource = new FakeDataSource(); columnsToRender = ['column_a', 'column_b', 'column_c']; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; } @Component({ @@ -3193,7 +3193,7 @@ class NativeHtmlTableWithCaptionApp { dataSource = new FakeDataSource(); columnsToRender = ['column_a']; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; } @Component({ @@ -3222,7 +3222,7 @@ class NativeHtmlTableWithColgroupAndCol { dataSource = new FakeDataSource(); columnsToRender = ['column_a', 'column_b']; - @ViewChild(CdkTable) table: CdkTable; + @ViewChild(CdkTable) table!: CdkTable; } @Component({ @@ -3276,7 +3276,7 @@ class TableWithIndirectDescendantDefs { imports: [CdkTableModule], }) class NativeHtmlTableAppOnPush { - @Input() dataSource: FakeDataSource; + @Input() dataSource!: FakeDataSource; columnsToRender = ['column_a', 'column_b', 'column_c']; } @@ -3327,8 +3327,8 @@ class WrapNativeHtmlTableAppOnPush { `, }) class TableWithVirtualScroll { - @ViewChild(CdkTable) table: CdkTable; - @ViewChild(CdkVirtualScrollViewport) viewport: CdkVirtualScrollViewport; + @ViewChild(CdkTable) table!: CdkTable; + @ViewChild(CdkVirtualScrollViewport) viewport!: CdkVirtualScrollViewport; dataSource = new FakeDataSource(); columnsToRender = ['column_a', 'column_b', 'column_c']; isFixedLayout = signal(true); diff --git a/src/cdk/table/table.ts b/src/cdk/table/table.ts index a50673835f02..8d1781ae5be4 100644 --- a/src/cdk/table/table.ts +++ b/src/cdk/table/table.ts @@ -297,7 +297,7 @@ export class CdkTable protected readonly _elementRef = inject(ElementRef); protected readonly _dir = inject(Directionality, {optional: true}); private _platform = inject(Platform); - protected _viewRepeater: _ViewRepeater, RowContext>; + protected _viewRepeater!: _ViewRepeater, RowContext>; private readonly _viewportRuler = inject(ViewportRuler); private _injector = inject(Injector); private _virtualScrollViewport = inject(CDK_VIRTUAL_SCROLL_VIEWPORT, { @@ -322,10 +322,10 @@ export class CdkTable private readonly _onDestroy = new Subject(); /** List of the rendered rows as identified by their `RenderRow` object. */ - private _renderRows: RenderRow[]; + private _renderRows!: RenderRow[]; /** Subscription that listens for the data provided by the data source. */ - private _renderChangeSubscription: Subscription | null; + private _renderChangeSubscription: Subscription | null = null; /** * Map of all the user's defined columns (header, data, and footer cell template) identified by @@ -338,27 +338,27 @@ export class CdkTable * Set of all row definitions that can be used by this table. Populated by the rows gathered by * using `ContentChildren` as well as any custom row definitions added to `_customRowDefs`. */ - private _rowDefs: CdkRowDef[]; + private _rowDefs!: CdkRowDef[]; /** * Set of all header row definitions that can be used by this table. Populated by the rows * gathered by using `ContentChildren` as well as any custom row definitions added to * `_customHeaderRowDefs`. */ - private _headerRowDefs: CdkHeaderRowDef[]; + private _headerRowDefs!: CdkHeaderRowDef[]; /** * Set of all row definitions that can be used by this table. Populated by the rows gathered by * using `ContentChildren` as well as any custom row definitions added to * `_customFooterRowDefs`. */ - private _footerRowDefs: CdkFooterRowDef[]; + private _footerRowDefs!: CdkFooterRowDef[]; /** Differ used to find the changes in the data provided by the data source. */ private _dataDiffer: IterableDiffer>; /** Stores the row definition that does not have a when predicate. */ - private _defaultRowDef: CdkRowDef | null; + private _defaultRowDef: CdkRowDef | null = null; /** * Column definitions that were defined outside of the direct content children of the table. @@ -389,7 +389,7 @@ export class CdkTable private _customFooterRowDefs = new Set(); /** No data row that was defined outside of the direct content children of the table. */ - private _customNoDataRow: CdkNoDataRow | null; + private _customNoDataRow: CdkNoDataRow | null = null; /** * Whether the header row definition has been changed. Triggers an update to the header row after @@ -438,7 +438,7 @@ export class CdkTable * Utility class that is responsible for applying the appropriate sticky positioning styles to * the table's rows and cells. */ - private _stickyStyler: StickyStyler; + private _stickyStyler!: StickyStyler; /** * CSS class added to any row or cell that has sticky positioning applied. May be overridden by @@ -509,7 +509,7 @@ export class CdkTable } this._trackByFn = fn; } - private _trackByFn: TrackByFunction; + private _trackByFn!: TrackByFunction; /** * The table's source of data, which can be provided in three ways (in order of complexity): @@ -541,7 +541,7 @@ export class CdkTable this._changeDetectorRef.markForCheck(); } } - private _dataSource: CdkTableDataSourceInput; + private _dataSource!: CdkTableDataSourceInput; /** Emits when the data source changes. */ readonly _dataSourceChanges = new Subject>(); /** Observable that emits the data source's complete data set. */ @@ -613,34 +613,34 @@ export class CdkTable }); // Outlets in the table's template where the header, data rows, and footer will be inserted. - _rowOutlet: DataRowOutlet; - _headerRowOutlet: HeaderRowOutlet; - _footerRowOutlet: FooterRowOutlet; - _noDataRowOutlet: NoDataRowOutlet; + _rowOutlet!: DataRowOutlet; + _headerRowOutlet!: HeaderRowOutlet; + _footerRowOutlet!: FooterRowOutlet; + _noDataRowOutlet!: NoDataRowOutlet; /** * The column definitions provided by the user that contain what the header, data, and footer * cells should render for each column. */ - @ContentChildren(CdkColumnDef, {descendants: true}) _contentColumnDefs: QueryList; + @ContentChildren(CdkColumnDef, {descendants: true}) _contentColumnDefs!: QueryList; /** Set of data row definitions that were provided to the table as content children. */ - @ContentChildren(CdkRowDef, {descendants: true}) _contentRowDefs: QueryList>; + @ContentChildren(CdkRowDef, {descendants: true}) _contentRowDefs!: QueryList>; /** Set of header row definitions that were provided to the table as content children. */ @ContentChildren(CdkHeaderRowDef, { descendants: true, }) - _contentHeaderRowDefs: QueryList; + _contentHeaderRowDefs!: QueryList; /** Set of footer row definitions that were provided to the table as content children. */ @ContentChildren(CdkFooterRowDef, { descendants: true, }) - _contentFooterRowDefs: QueryList; + _contentFooterRowDefs!: QueryList; /** Row definition that will only be rendered if there's no data in the table. */ - @ContentChild(CdkNoDataRow) _noDataRow: CdkNoDataRow; + @ContentChild(CdkNoDataRow) _noDataRow!: CdkNoDataRow; constructor(...args: unknown[]); diff --git a/src/cdk/table/text-column.ts b/src/cdk/table/text-column.ts index bfe9e0c04fc2..a87ab57bddd2 100644 --- a/src/cdk/table/text-column.ts +++ b/src/cdk/table/text-column.ts @@ -71,13 +71,13 @@ export class CdkTextColumn implements OnDestroy, OnInit { // available. In that case, we defer the synchronization until "ngOnInit" fires. this._syncColumnDefName(); } - _name: string; + _name!: string; /** * Text label that should be used for the column header. If this property is not * set, the header text will default to the column name with its first letter capitalized. */ - @Input() headerText: string; + @Input() headerText!: string; /** * Accessor function to retrieve the data rendered for each cell. If this @@ -85,13 +85,13 @@ export class CdkTextColumn implements OnDestroy, OnInit { * the column's name. For example, if the column is named `id`, then the rendered value will be * value defined by the data's `id` property. */ - @Input() dataAccessor: (data: T, name: string) => string; + @Input() dataAccessor!: (data: T, name: string) => string; /** Alignment of the cell values. */ @Input() justify: 'start' | 'end' | 'center' = 'start'; /** @docs-private */ - @ViewChild(CdkColumnDef, {static: true}) columnDef: CdkColumnDef; + @ViewChild(CdkColumnDef, {static: true}) columnDef!: CdkColumnDef; /** * The column cell is provided to the column during `ngOnInit` with a static query. @@ -100,7 +100,7 @@ export class CdkTextColumn implements OnDestroy, OnInit { * component. * @docs-private */ - @ViewChild(CdkCellDef, {static: true}) cell: CdkCellDef; + @ViewChild(CdkCellDef, {static: true}) cell!: CdkCellDef; /** * The column headerCell is provided to the column during `ngOnInit` with a static query. @@ -109,7 +109,7 @@ export class CdkTextColumn implements OnDestroy, OnInit { * component. * @docs-private */ - @ViewChild(CdkHeaderCellDef, {static: true}) headerCell: CdkHeaderCellDef; + @ViewChild(CdkHeaderCellDef, {static: true}) headerCell!: CdkHeaderCellDef; constructor(...args: unknown[]); diff --git a/src/cdk/testing/component-harness.ts b/src/cdk/testing/component-harness.ts index 646ac6ef1edc..8a6ed5ca4ebf 100644 --- a/src/cdk/testing/component-harness.ts +++ b/src/cdk/testing/component-harness.ts @@ -609,7 +609,16 @@ export class HarnessPredicate { public harnessType: ComponentHarnessConstructor, options: BaseHarnessFilters, ) { - this._addBaseOptions(options); + this._ancestor = options.ancestor || ''; + if (this._ancestor) { + this._descriptions.push(`has ancestor matching selector "${this._ancestor}"`); + } + const selector = options.selector; + if (selector !== undefined) { + this.add(`host matches selector "${selector}"`, async item => { + return (await item.host()).matchesSelector(selector); + }); + } } /** @@ -714,20 +723,6 @@ export class HarnessPredicate { return result.join(', '); } - - /** Adds base options common to all harness types. */ - private _addBaseOptions(options: BaseHarnessFilters) { - this._ancestor = options.ancestor || ''; - if (this._ancestor) { - this._descriptions.push(`has ancestor matching selector "${this._ancestor}"`); - } - const selector = options.selector; - if (selector !== undefined) { - this.add(`host matches selector "${selector}"`, async item => { - return (await item.host()).matchesSelector(selector); - }); - } - } } /** Represent a value as a string for the purpose of logging. */ diff --git a/src/cdk/text-field/autofill.zone.spec.ts b/src/cdk/text-field/autofill.zone.spec.ts index e3cfd319d6f9..cc0e305367f2 100644 --- a/src/cdk/text-field/autofill.zone.spec.ts +++ b/src/cdk/text-field/autofill.zone.spec.ts @@ -48,7 +48,7 @@ describe('AutofillMonitor Zone.js integration', () => { }) class Inputs { // Cast to `any` so we can stub out some methods in the tests. - @ViewChild('input1') input1: ElementRef; - @ViewChild('input2') input2: ElementRef; - @ViewChild('input3') input3: ElementRef; + @ViewChild('input1') input1!: ElementRef; + @ViewChild('input2') input2!: ElementRef; + @ViewChild('input3') input3!: ElementRef; } diff --git a/src/cdk/text-field/autosize.ts b/src/cdk/text-field/autosize.ts index 09ae53c4f711..81ee7726a75f 100644 --- a/src/cdk/text-field/autosize.ts +++ b/src/cdk/text-field/autosize.ts @@ -52,8 +52,8 @@ export class CdkTextareaAutosize implements AfterViewInit, DoCheck, OnDestroy { private readonly _destroyed = new Subject(); private _listenerCleanups: (() => void)[] | undefined; - private _minRows: number; - private _maxRows: number; + private _minRows!: number; + private _maxRows!: number; private _enabled: boolean = true; /** @@ -122,7 +122,7 @@ export class CdkTextareaAutosize implements AfterViewInit, DoCheck, OnDestroy { /** Used to reference correct document/window */ protected _document = inject(DOCUMENT); - private _hasFocus: boolean; + private _hasFocus = false; private _isViewInited = false; diff --git a/src/cdk/tree/control/base-tree-control.ts b/src/cdk/tree/control/base-tree-control.ts index d0cb38b5c3ad..c22ddc7ec7f7 100644 --- a/src/cdk/tree/control/base-tree-control.ts +++ b/src/cdk/tree/control/base-tree-control.ts @@ -23,7 +23,7 @@ export abstract class BaseTreeControl implements TreeControl { abstract expandAll(): void; /** Saved data node for `expandAll` action. */ - dataNodes: T[]; + dataNodes!: T[]; /** A selection model with multi-selection to track expansion status. */ expansionModel: SelectionModel = new SelectionModel(true); @@ -37,16 +37,16 @@ export abstract class BaseTreeControl implements TreeControl { trackBy?: (dataNode: T) => K; /** Get depth of a given data node, return the level number. This is for flat tree node. */ - getLevel: (dataNode: T) => number; + getLevel!: (dataNode: T) => number; /** * Whether the data node is expandable. Returns true if expandable. * This is for flat tree node. */ - isExpandable: (dataNode: T) => boolean; + isExpandable!: (dataNode: T) => boolean; /** Gets a stream that emits whenever the given data node's children change. */ - getChildren: (dataNode: T) => Observable | T[] | undefined | null; + getChildren!: (dataNode: T) => Observable | T[] | undefined | null; /** Toggles one single data node's expanded/collapsed state. */ toggle(dataNode: T): void { diff --git a/src/cdk/tree/nested-node.ts b/src/cdk/tree/nested-node.ts index 6d7a93b88264..978433b50338 100644 --- a/src/cdk/tree/nested-node.ts +++ b/src/cdk/tree/nested-node.ts @@ -45,10 +45,10 @@ export class CdkNestedTreeNode protected _differs = inject(IterableDiffers); /** Differ used to find the changes in the data provided by the data source. */ - private _dataDiffer: IterableDiffer; + private _dataDiffer!: IterableDiffer; /** The children data dataNodes of current node. They will be placed in `CdkTreeNodeOutlet`. */ - protected _children: T[]; + protected _children!: T[]; /** The children node placeholder. */ @ContentChildren(CdkTreeNodeOutlet, { @@ -56,7 +56,7 @@ export class CdkNestedTreeNode // indirect descendants if it's left as false. descendants: true, }) - nodeOutlet: QueryList; + nodeOutlet!: QueryList; constructor(...args: unknown[]); diff --git a/src/cdk/tree/node.ts b/src/cdk/tree/node.ts index 79356c0bf668..738ba8627479 100644 --- a/src/cdk/tree/node.ts +++ b/src/cdk/tree/node.ts @@ -14,7 +14,7 @@ export class CdkTreeNodeOutletContext { $implicit: T; /** Depth of the node. */ - level: number; + level!: number; /** Index location of the node. */ index?: number; @@ -46,7 +46,7 @@ export class CdkTreeNodeDef { * For every node, there must be at least one when function that passes or an undefined to * default. */ - when: (index: number, nodeData: T) => boolean; + when!: (index: number, nodeData: T) => boolean; constructor(...args: unknown[]); constructor() {} diff --git a/src/cdk/tree/padding.ts b/src/cdk/tree/padding.ts index 4dac40d9870c..ded80bb31ad1 100644 --- a/src/cdk/tree/padding.ts +++ b/src/cdk/tree/padding.ts @@ -29,7 +29,7 @@ export class CdkTreeNodePadding implements OnDestroy { private _dir = inject(Directionality, {optional: true}); /** Current padding value applied to the element. Used to avoid unnecessarily hitting the DOM. */ - private _currentPadding: string | null; + private _currentPadding: string | null = null; /** Subject that emits when the component has been destroyed. */ private readonly _destroyed = new Subject(); @@ -45,7 +45,7 @@ export class CdkTreeNodePadding implements OnDestroy { set level(value: number) { this._setLevelInput(value); } - _level: number; + _level!: number; /** * The indent for each level. Can be a number or a CSS string. diff --git a/src/cdk/tree/tree-using-legacy-key-manager.spec.ts b/src/cdk/tree/tree-using-legacy-key-manager.spec.ts index fecb0b756ce6..1cadb181365d 100644 --- a/src/cdk/tree/tree-using-legacy-key-manager.spec.ts +++ b/src/cdk/tree/tree-using-legacy-key-manager.spec.ts @@ -83,6 +83,6 @@ class SimpleCdkTreeApp { dataSource = of([new MinimalTestData('apple'), new MinimalTestData('banana')]); - @ViewChild('tree', {read: ElementRef}) tree: ElementRef; - @ViewChildren('node') treeNodes: QueryList>; + @ViewChild('tree', {read: ElementRef}) tree!: ElementRef; + @ViewChildren('node') treeNodes!: QueryList>; } diff --git a/src/cdk/tree/tree-with-tree-control.spec.ts b/src/cdk/tree/tree-with-tree-control.spec.ts index 329645f412de..ce44de525a9f 100644 --- a/src/cdk/tree/tree-with-tree-control.spec.ts +++ b/src/cdk/tree/tree-with-tree-control.spec.ts @@ -1451,8 +1451,8 @@ class SimpleCdkTreeApp { dataSource = new FakeDataSource(this.treeControl); indent: number | string = 28; - @ViewChild(CdkTree) tree: CdkTree; - @ViewChildren(CdkTreeNodePadding) paddingNodes: QueryList>; + @ViewChild(CdkTree) tree!: CdkTree; + @ViewChildren(CdkTreeNodePadding) paddingNodes!: QueryList>; } @Component({ @@ -1489,7 +1489,7 @@ class NestedCdkTreeApp { dataSource = new FakeDataSource(this.treeControl); - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1515,7 +1515,7 @@ class StaticNestedCdkTreeApp { dataSource: FakeDataSource; - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; constructor() { const dataSource = new FakeDataSource(this.treeControl); @@ -1552,7 +1552,7 @@ class WhenNodeNestedCdkTreeApp { dataSource = new FakeDataSource(this.treeControl); - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1576,7 +1576,7 @@ class CdkTreeAppWithToggle { treeControl: TreeControl = new FlatTreeControl(this.getLevel, this.isExpandable); dataSource = new FakeDataSource(this.treeControl); - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1604,7 +1604,7 @@ class NestedCdkTreeAppWithToggle { treeControl: TreeControl = new NestedTreeControl(this.getChildren); dataSource = new FakeDataSource(this.treeControl); - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1633,7 +1633,7 @@ class WhenNodeCdkTreeApp { dataSource = new FakeDataSource(this.treeControl); - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1660,7 +1660,7 @@ class ArrayDataSourceCdkTreeApp { return this.dataSource.data; } - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1687,7 +1687,7 @@ class ObservableDataSourceCdkTreeApp { return this.dataSource._dataChange; } - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1712,7 +1712,7 @@ class ArrayDataSourceNestedCdkTreeApp { return this.dataSource.data; } - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1737,7 +1737,7 @@ class ObservableDataSourceNestedCdkTreeApp { return this.dataSource._dataChange; } - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1763,7 +1763,7 @@ class DepthNestedCdkTreeApp { return this.dataSource.data; } - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1796,7 +1796,7 @@ class CdkTreeAppWithTrackBy { treeControl: TreeControl = new FlatTreeControl(this.getLevel, this.isExpandable); dataSource = new FakeDataSource(this.treeControl); - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1834,5 +1834,5 @@ class NestedCdkTreeAppWithTrackBy { return this.dataSource.data; } - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } diff --git a/src/cdk/tree/tree.spec.ts b/src/cdk/tree/tree.spec.ts index d4f8806c14e9..7513863c9f17 100644 --- a/src/cdk/tree/tree.spec.ts +++ b/src/cdk/tree/tree.spec.ts @@ -1698,8 +1698,8 @@ class SimpleCdkTreeApp { dataSource = new FakeDataSource(); indent: number | string = 28; - @ViewChild(CdkTree) tree: CdkTree; - @ViewChildren(CdkTreeNodePadding) paddingNodes: QueryList>; + @ViewChild(CdkTree) tree!: CdkTree; + @ViewChildren(CdkTreeNodePadding) paddingNodes!: QueryList>; } @Component({ @@ -1738,7 +1738,7 @@ class NestedCdkTreeApp { dataSource = new FakeDataSource(); - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1762,7 +1762,7 @@ class StaticNestedCdkTreeApp { dataSource: FakeDataSource; - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; constructor() { const dataSource = new FakeDataSource(); @@ -1798,7 +1798,7 @@ class WhenNodeNestedCdkTreeApp { dataSource = new FakeDataSource(); - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1823,7 +1823,7 @@ class CdkTreeAppWithToggle { dataSource = new FakeDataSource(); - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1854,7 +1854,7 @@ class NestedCdkTreeAppWithToggle { dataSource = new FakeDataSource(); - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1884,7 +1884,7 @@ class WhenNodeCdkTreeApp { dataSource = new FakeDataSource(); - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1911,7 +1911,7 @@ class ArrayDataSourceCdkTreeApp { return this.dataSource.data; } - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; cdr = inject(ChangeDetectorRef); @@ -1946,7 +1946,7 @@ class ObservableDataSourceCdkTreeApp { return this.dataSource._dataChange; } - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1970,7 +1970,7 @@ class ArrayDataSourceNestedCdkTreeApp { return this.dataSource.data; } - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -1994,7 +1994,7 @@ class ObservableDataSourceNestedCdkTreeApp { return this.dataSource._dataChange; } - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -2019,7 +2019,7 @@ class DepthNestedCdkTreeApp { return this.dataSource.data; } - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -2052,7 +2052,7 @@ class CdkTreeAppWithTrackBy { dataSource = new FakeDataSource(); - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } @Component({ @@ -2089,7 +2089,7 @@ class NestedCdkTreeAppWithTrackBy { return this.dataSource.data; } - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; } class MinimalTestData { @@ -2121,8 +2121,8 @@ class TypeaheadLabelFlatTreeWithThreeNodes { new MinimalTestData('cherry', 'typeahead'), ]); - @ViewChild('tree', {read: ElementRef}) tree: ElementRef; - @ViewChildren('node') treeNodes: QueryList>; + @ViewChild('tree', {read: ElementRef}) tree!: ElementRef; + @ViewChildren('node') treeNodes!: QueryList>; } @Component({ @@ -2145,8 +2145,8 @@ class FlatTreeWithThreeNodes { new MinimalTestData('cherry'), ]); - @ViewChild('tree', {read: ElementRef}) tree: ElementRef; - @ViewChildren('node') treeNodes: QueryList>; + @ViewChild('tree', {read: ElementRef}) tree!: ElementRef; + @ViewChildren('node') treeNodes!: QueryList>; } @Component({ @@ -2165,7 +2165,7 @@ class FlatTreeWithThreeNodes { class IsExpandableOrderingTest { getChildren = (node: MinimalTestData) => node.children; - @ViewChild(CdkTree) tree: CdkTree; + @ViewChild(CdkTree) tree!: CdkTree; dataSource: MinimalTestData[]; diff --git a/src/cdk/tree/tree.ts b/src/cdk/tree/tree.ts index 8f086ee758c9..95913a582078 100644 --- a/src/cdk/tree/tree.ts +++ b/src/cdk/tree/tree.ts @@ -134,13 +134,13 @@ export class CdkTree private readonly _onDestroy = new Subject(); /** Differ used to find the changes in the data provided by the data source. */ - private _dataDiffer: IterableDiffer; + private _dataDiffer!: IterableDiffer; /** Stores the node definition that does not have a when predicate. */ - private _defaultNodeDef: CdkTreeNodeDef | null; + private _defaultNodeDef: CdkTreeNodeDef | null = null; /** Data subscription */ - private _dataSubscription: Subscription | null; + private _dataSubscription: Subscription | undefined; /** Level of nodes */ private _levels: Map = new Map(); @@ -172,7 +172,7 @@ export class CdkTree this._switchDataSource(dataSource); } } - private _dataSource: DataSource | Observable | T[]; + private _dataSource!: DataSource | Observable | T[]; /** * The tree controller @@ -205,7 +205,7 @@ export class CdkTree * relative to the function to know if a node should be added/removed/moved. * Accepts a function that takes two parameters, `index` and `item`. */ - @Input() trackBy: TrackByFunction; + @Input() trackBy!: TrackByFunction; /** * Given a data node, determines the key by which we determine whether or not this node is expanded. @@ -213,7 +213,7 @@ export class CdkTree @Input() expansionKey?: (dataNode: T) => K; // Outlets within the tree's template where the dataNodes will be inserted. - @ViewChild(CdkTreeNodeOutlet, {static: true}) _nodeOutlet: CdkTreeNodeOutlet; + @ViewChild(CdkTreeNodeOutlet, {static: true}) _nodeOutlet!: CdkTreeNodeOutlet; /** The tree node template for the tree */ @ContentChildren(CdkTreeNodeDef, { @@ -221,7 +221,7 @@ export class CdkTree // indirect descendants if it's left as false. descendants: true, }) - _nodeDefs: QueryList>; + _nodeDefs!: QueryList>; // TODO(tinayuangao): Setup a listener for scrolling, emit the calculated view to viewChange. // Remove the MAX_VALUE in viewChange @@ -264,7 +264,7 @@ export class CdkTree private _keyManagerFactory = inject(TREE_KEY_MANAGER) as TreeKeyManagerFactory>; /** The key manager for this tree. Handles focus and activation based on user keyboard input. */ - _keyManager: TreeKeyManagerStrategy>; + _keyManager!: TreeKeyManagerStrategy>; private _viewInit = false; constructor(...args: unknown[]); @@ -294,10 +294,8 @@ export class CdkTree (this.dataSource as DataSource).disconnect(this); } - if (this._dataSubscription) { - this._dataSubscription.unsubscribe(); - this._dataSubscription = null; - } + this._dataSubscription?.unsubscribe(); + this._dataSubscription = undefined; // In certain tests, the tree might be destroyed before this is initialized // in `ngAfterContentInit`. @@ -351,10 +349,8 @@ export class CdkTree (this.dataSource as DataSource).disconnect(this); } - if (this._dataSubscription) { - this._dataSubscription.unsubscribe(); - this._dataSubscription = null; - } + this._dataSubscription?.unsubscribe(); + this._dataSubscription = undefined; // Remove the all dataNodes if there is now no data source if (!dataSource) { @@ -1264,13 +1260,13 @@ export class CdkTreeNode implements OnDestroy, OnInit, TreeKeyManagerI * Whether or not this node is disabled. If it's disabled, then the user won't be able to focus * or activate this node. */ - @Input({transform: booleanAttribute}) isDisabled: boolean; + @Input({transform: booleanAttribute}) isDisabled: boolean = false; /** * The text used to locate this item during typeahead. If not specified, the `textContent` will * will be used. */ - @Input('cdkTreeNodeTypeaheadLabel') typeaheadLabel: string | null; + @Input('cdkTreeNodeTypeaheadLabel') typeaheadLabel: string | null = null; getLabel(): string { return this.typeaheadLabel || this._elementRef.nativeElement.textContent?.trim() || ''; @@ -1305,7 +1301,7 @@ export class CdkTreeNode implements OnDestroy, OnInit, TreeKeyManagerI * (e.g. menu, dialog). */ private _shouldFocus = true; - private _parentNodeAriaLevel: number; + private _parentNodeAriaLevel!: number; /** The tree node's data. */ get data(): T { @@ -1317,7 +1313,7 @@ export class CdkTreeNode implements OnDestroy, OnInit, TreeKeyManagerI this._dataChanges.next(); } } - protected _data: T; + protected _data!: T; /* If leaf node, return true to not assign aria-expanded attribute */ get isLeafNode(): boolean { diff --git a/src/cdk/tsconfig.json b/src/cdk/tsconfig.json index 52b341bde973..8a9bdb848d33 100644 --- a/src/cdk/tsconfig.json +++ b/src/cdk/tsconfig.json @@ -4,6 +4,7 @@ "compilerOptions": { "rootDir": "..", "baseUrl": ".", + "strictPropertyInitialization": true, "paths": { "@angular/cdk/*": ["./*"] }