@angular/cdk-experimental 19.0.0-next.2 → 19.0.0-next.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/column-resize/index.d.ts +2 -9
- package/combobox/index.d.ts +5 -11
- package/fesm2022/cdk-experimental.mjs +1 -1
- package/fesm2022/cdk-experimental.mjs.map +1 -1
- package/fesm2022/column-resize.mjs +109 -124
- package/fesm2022/column-resize.mjs.map +1 -1
- package/fesm2022/combobox.mjs +38 -47
- package/fesm2022/combobox.mjs.map +1 -1
- package/fesm2022/popover-edit.mjs +121 -125
- package/fesm2022/popover-edit.mjs.map +1 -1
- package/fesm2022/scrolling.mjs +7 -7
- package/fesm2022/selection.mjs +43 -76
- package/fesm2022/selection.mjs.map +1 -1
- package/fesm2022/table-scroll-container.mjs +17 -30
- package/fesm2022/table-scroll-container.mjs.map +1 -1
- package/package.json +2 -2
- package/popover-edit/index.d.ts +11 -19
- package/selection/index.d.ts +6 -10
- package/table-scroll-container/index.d.ts +3 -6
|
@@ -1,16 +1,14 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import {
|
|
2
|
+
import { inject, NgZone, Injectable, Injector, afterNextRender, ElementRef, EventEmitter, Directive, Input, afterRender, ViewContainerRef, TemplateRef, NgModule } from '@angular/core';
|
|
3
3
|
import { Subject, pipe, combineLatest, Observable, fromEvent, fromEventPattern, merge } from 'rxjs';
|
|
4
4
|
import { distinctUntilChanged, startWith, shareReplay, filter, map, auditTime, audit, debounceTime, skip, takeUntil, mapTo, throttleTime, share, withLatestFrom } from 'rxjs/operators';
|
|
5
|
-
import
|
|
6
|
-
import
|
|
5
|
+
import { ControlContainer } from '@angular/forms';
|
|
6
|
+
import { Directionality } from '@angular/cdk/bidi';
|
|
7
7
|
import { RIGHT_ARROW, LEFT_ARROW, DOWN_ARROW, UP_ARROW, hasModifierKey } from '@angular/cdk/keycodes';
|
|
8
|
-
import
|
|
9
|
-
import { OverlayModule } from '@angular/cdk/overlay';
|
|
8
|
+
import { Overlay, OverlayModule } from '@angular/cdk/overlay';
|
|
10
9
|
import { TemplatePortal } from '@angular/cdk/portal';
|
|
11
|
-
import
|
|
12
|
-
import {
|
|
13
|
-
import * as i6 from '@angular/cdk/scrolling';
|
|
10
|
+
import { FocusTrapFactory, FocusTrap, InteractivityChecker } from '@angular/cdk/a11y';
|
|
11
|
+
import { ScrollDispatcher, ViewportRuler } from '@angular/cdk/scrolling';
|
|
14
12
|
import { DOCUMENT } from '@angular/common';
|
|
15
13
|
|
|
16
14
|
/** Selector for finding table cells. */
|
|
@@ -65,8 +63,8 @@ class EditEventDispatcher {
|
|
|
65
63
|
get editRef() {
|
|
66
64
|
return this._editRef;
|
|
67
65
|
}
|
|
68
|
-
constructor(
|
|
69
|
-
this._ngZone =
|
|
66
|
+
constructor() {
|
|
67
|
+
this._ngZone = inject(NgZone);
|
|
70
68
|
/** A subject that indicates which table cell is currently editing (unless it is disabled). */
|
|
71
69
|
this.editing = new Subject();
|
|
72
70
|
/** A subject that indicates which table row is currently hovered. */
|
|
@@ -212,12 +210,12 @@ class EditEventDispatcher {
|
|
|
212
210
|
_mapAllRowsToSingleRow(mapper) {
|
|
213
211
|
return this.allRows.pipe(map(mapper), this._startWithNullDistinct);
|
|
214
212
|
}
|
|
215
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
216
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
213
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: EditEventDispatcher, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
214
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: EditEventDispatcher }); }
|
|
217
215
|
}
|
|
218
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
216
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: EditEventDispatcher, decorators: [{
|
|
219
217
|
type: Injectable
|
|
220
|
-
}], ctorParameters: () => [
|
|
218
|
+
}], ctorParameters: () => [] });
|
|
221
219
|
function computeHoverContentState([firstRow, lastRow, activeRow, hoverRow,]) {
|
|
222
220
|
const hoverContentState = new Map();
|
|
223
221
|
// Add focusable rows.
|
|
@@ -257,9 +255,9 @@ function areMapEntriesEqual(a, b) {
|
|
|
257
255
|
* table that launched it. Provided by CdkEditControl within the lens.
|
|
258
256
|
*/
|
|
259
257
|
class EditRef {
|
|
260
|
-
constructor(
|
|
261
|
-
this._form =
|
|
262
|
-
this._editEventDispatcher =
|
|
258
|
+
constructor() {
|
|
259
|
+
this._form = inject(ControlContainer, { self: true });
|
|
260
|
+
this._editEventDispatcher = inject(EditEventDispatcher);
|
|
263
261
|
/** Emits the final value of this edit instance before closing. */
|
|
264
262
|
this._finalValueSubject = new Subject();
|
|
265
263
|
this.finalValue = this._finalValueSubject;
|
|
@@ -312,22 +310,20 @@ class EditRef {
|
|
|
312
310
|
reset(value) {
|
|
313
311
|
this._form.reset(value || this._revertFormValue);
|
|
314
312
|
}
|
|
315
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
316
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
313
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: EditRef, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
314
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: EditRef }); }
|
|
317
315
|
}
|
|
318
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
316
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: EditRef, decorators: [{
|
|
319
317
|
type: Injectable
|
|
320
|
-
}], ctorParameters: () => [
|
|
321
|
-
type: Self
|
|
322
|
-
}] }, { type: EditEventDispatcher }] });
|
|
318
|
+
}], ctorParameters: () => [] });
|
|
323
319
|
|
|
324
320
|
/**
|
|
325
321
|
* Service responsible for moving cell focus around in response to keyboard events.
|
|
326
322
|
* May be overridden to customize the keyboard behavior of popover edit.
|
|
327
323
|
*/
|
|
328
324
|
class FocusDispatcher {
|
|
329
|
-
constructor(
|
|
330
|
-
this.directionality =
|
|
325
|
+
constructor() {
|
|
326
|
+
this.directionality = inject(Directionality);
|
|
331
327
|
this.keyObserver = { next: event => this.handleKeyboardEvent(event) };
|
|
332
328
|
}
|
|
333
329
|
/**
|
|
@@ -381,13 +377,13 @@ class FocusDispatcher {
|
|
|
381
377
|
}
|
|
382
378
|
event.preventDefault();
|
|
383
379
|
}
|
|
384
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
385
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
380
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: FocusDispatcher, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
381
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: FocusDispatcher, providedIn: 'root' }); }
|
|
386
382
|
}
|
|
387
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
383
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: FocusDispatcher, decorators: [{
|
|
388
384
|
type: Injectable,
|
|
389
385
|
args: [{ providedIn: 'root' }]
|
|
390
|
-
}], ctorParameters: () => [
|
|
386
|
+
}], ctorParameters: () => [] });
|
|
391
387
|
|
|
392
388
|
/**
|
|
393
389
|
* A convenience class for preserving unsaved form state while an edit lens is closed.
|
|
@@ -422,9 +418,9 @@ class FormValueContainer {
|
|
|
422
418
|
* out.
|
|
423
419
|
*/
|
|
424
420
|
class CdkEditControl {
|
|
425
|
-
constructor(
|
|
426
|
-
this.elementRef =
|
|
427
|
-
this.editRef =
|
|
421
|
+
constructor() {
|
|
422
|
+
this.elementRef = inject(ElementRef);
|
|
423
|
+
this.editRef = inject(EditRef);
|
|
428
424
|
this.destroyed = new Subject();
|
|
429
425
|
/**
|
|
430
426
|
* Specifies what should happen when the user clicks outside of the edit lens.
|
|
@@ -502,10 +498,10 @@ class CdkEditControl {
|
|
|
502
498
|
_triggerFormSubmit() {
|
|
503
499
|
this.elementRef.nativeElement.dispatchEvent(new Event('submit'));
|
|
504
500
|
}
|
|
505
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
506
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
501
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkEditControl, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
502
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0-next.2", type: CdkEditControl, isStandalone: true, selector: "form[cdkEditControl]", inputs: { clickOutBehavior: ["cdkEditControlClickOutBehavior", "clickOutBehavior"], preservedFormValue: ["cdkEditControlPreservedFormValue", "preservedFormValue"], ignoreSubmitUnlessValid: ["cdkEditControlIgnoreSubmitUnlessValid", "ignoreSubmitUnlessValid"] }, outputs: { preservedFormValueChange: "cdkEditControlPreservedFormValueChange" }, host: { listeners: { "ngSubmit": "handleFormSubmit()", "document:click": "handlePossibleClickOut($event)", "keydown": "_handleKeydown($event)" } }, providers: [EditRef], ngImport: i0 }); }
|
|
507
503
|
}
|
|
508
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
504
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkEditControl, decorators: [{
|
|
509
505
|
type: Directive,
|
|
510
506
|
args: [{
|
|
511
507
|
selector: 'form[cdkEditControl]',
|
|
@@ -523,21 +519,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0-next.2",
|
|
|
523
519
|
},
|
|
524
520
|
standalone: true,
|
|
525
521
|
}]
|
|
526
|
-
}]
|
|
522
|
+
}] });
|
|
527
523
|
/** Reverts the form to its initial or previously submitted state on click. */
|
|
528
524
|
class CdkEditRevert {
|
|
529
|
-
constructor(
|
|
530
|
-
this.editRef =
|
|
525
|
+
constructor() {
|
|
526
|
+
this.editRef = inject(EditRef);
|
|
531
527
|
/** Type of the button. Defaults to `button` to avoid accident form submits. */
|
|
532
528
|
this.type = 'button';
|
|
533
529
|
}
|
|
534
530
|
revertEdit() {
|
|
535
531
|
this.editRef.reset();
|
|
536
532
|
}
|
|
537
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
538
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
533
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkEditRevert, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
534
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0-next.2", type: CdkEditRevert, isStandalone: true, selector: "button[cdkEditRevert]", inputs: { type: "type" }, host: { attributes: { "type": "button" }, listeners: { "click": "revertEdit()" } }, ngImport: i0 }); }
|
|
539
535
|
}
|
|
540
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
536
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkEditRevert, decorators: [{
|
|
541
537
|
type: Directive,
|
|
542
538
|
args: [{
|
|
543
539
|
selector: 'button[cdkEditRevert]',
|
|
@@ -547,15 +543,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0-next.2",
|
|
|
547
543
|
},
|
|
548
544
|
standalone: true,
|
|
549
545
|
}]
|
|
550
|
-
}],
|
|
546
|
+
}], propDecorators: { type: [{
|
|
551
547
|
type: Input
|
|
552
548
|
}] } });
|
|
553
549
|
/** Closes the lens on click. */
|
|
554
550
|
class CdkEditClose {
|
|
555
|
-
constructor(
|
|
556
|
-
this.elementRef =
|
|
557
|
-
this.editRef =
|
|
558
|
-
const nativeElement = elementRef.nativeElement;
|
|
551
|
+
constructor() {
|
|
552
|
+
this.elementRef = inject(ElementRef);
|
|
553
|
+
this.editRef = inject(EditRef);
|
|
554
|
+
const nativeElement = this.elementRef.nativeElement;
|
|
559
555
|
// Prevent accidental form submits.
|
|
560
556
|
if (nativeElement.nodeName === 'BUTTON' && !nativeElement.getAttribute('type')) {
|
|
561
557
|
nativeElement.setAttribute('type', 'button');
|
|
@@ -569,10 +565,10 @@ class CdkEditClose {
|
|
|
569
565
|
// the same event sequence if focus was moved quickly.
|
|
570
566
|
this.editRef.close();
|
|
571
567
|
}
|
|
572
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
573
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
568
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkEditClose, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
569
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0-next.2", type: CdkEditClose, isStandalone: true, selector: "[cdkEditClose]", host: { listeners: { "click": "closeEdit()", "keydown.enter": "closeEdit()", "keydown.space": "closeEdit()" } }, ngImport: i0 }); }
|
|
574
570
|
}
|
|
575
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
571
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkEditClose, decorators: [{
|
|
576
572
|
type: Directive,
|
|
577
573
|
args: [{
|
|
578
574
|
selector: '[cdkEditClose]',
|
|
@@ -583,7 +579,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0-next.2",
|
|
|
583
579
|
},
|
|
584
580
|
standalone: true,
|
|
585
581
|
}]
|
|
586
|
-
}], ctorParameters: () => [
|
|
582
|
+
}], ctorParameters: () => [] });
|
|
587
583
|
|
|
588
584
|
/**
|
|
589
585
|
* Optimization
|
|
@@ -592,22 +588,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0-next.2",
|
|
|
592
588
|
* and 56 bytes of memory per instance.
|
|
593
589
|
*/
|
|
594
590
|
class EditServices {
|
|
595
|
-
constructor(
|
|
596
|
-
this.directionality =
|
|
597
|
-
this.editEventDispatcher =
|
|
598
|
-
this.focusDispatcher =
|
|
599
|
-
this.focusTrapFactory =
|
|
600
|
-
this.ngZone =
|
|
601
|
-
this.overlay =
|
|
602
|
-
this.scrollDispatcher =
|
|
603
|
-
this.viewportRuler =
|
|
604
|
-
}
|
|
605
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
606
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
591
|
+
constructor() {
|
|
592
|
+
this.directionality = inject(Directionality);
|
|
593
|
+
this.editEventDispatcher = inject(EditEventDispatcher);
|
|
594
|
+
this.focusDispatcher = inject(FocusDispatcher);
|
|
595
|
+
this.focusTrapFactory = inject(FocusTrapFactory);
|
|
596
|
+
this.ngZone = inject(NgZone);
|
|
597
|
+
this.overlay = inject(Overlay);
|
|
598
|
+
this.scrollDispatcher = inject(ScrollDispatcher);
|
|
599
|
+
this.viewportRuler = inject(ViewportRuler);
|
|
600
|
+
}
|
|
601
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: EditServices, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
602
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: EditServices }); }
|
|
607
603
|
}
|
|
608
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
604
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: EditServices, decorators: [{
|
|
609
605
|
type: Injectable
|
|
610
|
-
}]
|
|
606
|
+
}] });
|
|
611
607
|
|
|
612
608
|
/** Value indicating whether focus left the target area before or after the enclosed elements. */
|
|
613
609
|
var FocusEscapeNotifierDirection;
|
|
@@ -641,10 +637,10 @@ class FocusEscapeNotifier extends FocusTrap {
|
|
|
641
637
|
}
|
|
642
638
|
/** Factory that allows easy instantiation of focus escape notifiers. */
|
|
643
639
|
class FocusEscapeNotifierFactory {
|
|
644
|
-
constructor(
|
|
645
|
-
this._checker =
|
|
646
|
-
this._ngZone =
|
|
647
|
-
this._document =
|
|
640
|
+
constructor() {
|
|
641
|
+
this._checker = inject(InteractivityChecker);
|
|
642
|
+
this._ngZone = inject(NgZone);
|
|
643
|
+
this._document = inject(DOCUMENT);
|
|
648
644
|
}
|
|
649
645
|
/**
|
|
650
646
|
* Creates a focus escape notifier region around the given element.
|
|
@@ -654,16 +650,13 @@ class FocusEscapeNotifierFactory {
|
|
|
654
650
|
create(element) {
|
|
655
651
|
return new FocusEscapeNotifier(element, this._checker, this._ngZone, this._document);
|
|
656
652
|
}
|
|
657
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
658
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
653
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: FocusEscapeNotifierFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
654
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: FocusEscapeNotifierFactory, providedIn: 'root' }); }
|
|
659
655
|
}
|
|
660
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
656
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: FocusEscapeNotifierFactory, decorators: [{
|
|
661
657
|
type: Injectable,
|
|
662
658
|
args: [{ providedIn: 'root' }]
|
|
663
|
-
}]
|
|
664
|
-
type: Inject,
|
|
665
|
-
args: [DOCUMENT]
|
|
666
|
-
}] }] });
|
|
659
|
+
}] });
|
|
667
660
|
|
|
668
661
|
/** Used for rate-limiting mousemove events. */
|
|
669
662
|
const MOUSE_MOVE_THROTTLE_TIME_MS = 10;
|
|
@@ -673,11 +666,11 @@ const MOUSE_MOVE_THROTTLE_TIME_MS = 10;
|
|
|
673
666
|
* EditEventDispatcher service for use by the other edit directives.
|
|
674
667
|
*/
|
|
675
668
|
class CdkEditable {
|
|
676
|
-
constructor(
|
|
677
|
-
this.elementRef =
|
|
678
|
-
this.editEventDispatcher =
|
|
679
|
-
this.focusDispatcher =
|
|
680
|
-
this.ngZone =
|
|
669
|
+
constructor() {
|
|
670
|
+
this.elementRef = inject(ElementRef);
|
|
671
|
+
this.editEventDispatcher = inject(EditEventDispatcher);
|
|
672
|
+
this.focusDispatcher = inject(FocusDispatcher);
|
|
673
|
+
this.ngZone = inject(NgZone);
|
|
681
674
|
this.destroyed = new Subject();
|
|
682
675
|
this._rendered = new Subject();
|
|
683
676
|
afterRender(() => {
|
|
@@ -718,6 +711,8 @@ class CdkEditable {
|
|
|
718
711
|
// or below the table.
|
|
719
712
|
this._rendered
|
|
720
713
|
.pipe(
|
|
714
|
+
// Avoid some timing inconsistencies since Angular v19.
|
|
715
|
+
debounceTime(0),
|
|
721
716
|
// Optimization: ignore dom changes while focus is within the table as we already
|
|
722
717
|
// ensure that rows above and below the focused/active row are tabbable.
|
|
723
718
|
withLatestFrom(this.editEventDispatcher.editingOrFocused), filter(([_, activeRow]) => activeRow == null), map(() => element.querySelectorAll(ROW_SELECTOR)), share(), takeUntil(this.destroyed))
|
|
@@ -731,17 +726,17 @@ class CdkEditable {
|
|
|
731
726
|
.subscribe(this.focusDispatcher.keyObserver);
|
|
732
727
|
});
|
|
733
728
|
}
|
|
734
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
735
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
729
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkEditable, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
730
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0-next.2", type: CdkEditable, isStandalone: true, selector: "table[editable], cdk-table[editable], mat-table[editable]", providers: [EditEventDispatcher, EditServices], ngImport: i0 }); }
|
|
736
731
|
}
|
|
737
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
732
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkEditable, decorators: [{
|
|
738
733
|
type: Directive,
|
|
739
734
|
args: [{
|
|
740
735
|
selector: 'table[editable], cdk-table[editable], mat-table[editable]',
|
|
741
736
|
providers: [EditEventDispatcher, EditServices],
|
|
742
737
|
standalone: true,
|
|
743
738
|
}]
|
|
744
|
-
}], ctorParameters: () => [
|
|
739
|
+
}], ctorParameters: () => [] });
|
|
745
740
|
const POPOVER_EDIT_HOST_BINDINGS = {
|
|
746
741
|
'[attr.tabindex]': 'disabled ? null : 0',
|
|
747
742
|
'class': 'cdk-popover-edit-cell',
|
|
@@ -760,6 +755,16 @@ const POPOVER_EDIT_INPUTS = [
|
|
|
760
755
|
* Makes the cell focusable.
|
|
761
756
|
*/
|
|
762
757
|
class CdkPopoverEdit {
|
|
758
|
+
constructor() {
|
|
759
|
+
this.services = inject(EditServices);
|
|
760
|
+
this.elementRef = inject(ElementRef);
|
|
761
|
+
this.viewContainerRef = inject(ViewContainerRef);
|
|
762
|
+
/** The edit lens template shown over the cell on edit. */
|
|
763
|
+
this.template = null;
|
|
764
|
+
this._colspan = {};
|
|
765
|
+
this._disabled = false;
|
|
766
|
+
this.destroyed = new Subject();
|
|
767
|
+
}
|
|
763
768
|
/**
|
|
764
769
|
* Specifies that the popup should cover additional table cells before and/or after
|
|
765
770
|
* this one.
|
|
@@ -791,16 +796,6 @@ class CdkPopoverEdit {
|
|
|
791
796
|
this.services.editEventDispatcher.disabledCells.delete(this.elementRef.nativeElement);
|
|
792
797
|
}
|
|
793
798
|
}
|
|
794
|
-
constructor(services, elementRef, viewContainerRef) {
|
|
795
|
-
this.services = services;
|
|
796
|
-
this.elementRef = elementRef;
|
|
797
|
-
this.viewContainerRef = viewContainerRef;
|
|
798
|
-
/** The edit lens template shown over the cell on edit. */
|
|
799
|
-
this.template = null;
|
|
800
|
-
this._colspan = {};
|
|
801
|
-
this._disabled = false;
|
|
802
|
-
this.destroyed = new Subject();
|
|
803
|
-
}
|
|
804
799
|
ngAfterViewInit() {
|
|
805
800
|
this._startListeningToEditEvents();
|
|
806
801
|
}
|
|
@@ -926,10 +921,10 @@ class CdkPopoverEdit {
|
|
|
926
921
|
}
|
|
927
922
|
return { width: lastCell.getBoundingClientRect().right - firstCell.getBoundingClientRect().left };
|
|
928
923
|
}
|
|
929
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
930
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
924
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkPopoverEdit, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
925
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0-next.2", type: CdkPopoverEdit, isStandalone: true, selector: "[cdkPopoverEdit]:not([cdkPopoverEditTabOut])", inputs: { template: ["cdkPopoverEdit", "template"], context: ["cdkPopoverEditContext", "context"], colspan: ["cdkPopoverEditColspan", "colspan"], disabled: ["cdkPopoverEditDisabled", "disabled"], ariaLabel: ["cdkPopoverEditAriaLabel", "ariaLabel"] }, host: { properties: { "attr.tabindex": "disabled ? null : 0", "attr.aria-haspopup": "!disabled" }, classAttribute: "cdk-popover-edit-cell" }, ngImport: i0 }); }
|
|
931
926
|
}
|
|
932
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
927
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkPopoverEdit, decorators: [{
|
|
933
928
|
type: Directive,
|
|
934
929
|
args: [{
|
|
935
930
|
selector: '[cdkPopoverEdit]:not([cdkPopoverEditTabOut])',
|
|
@@ -937,16 +932,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0-next.2",
|
|
|
937
932
|
inputs: POPOVER_EDIT_INPUTS,
|
|
938
933
|
standalone: true,
|
|
939
934
|
}]
|
|
940
|
-
}]
|
|
935
|
+
}] });
|
|
941
936
|
/**
|
|
942
937
|
* Attaches an ng-template to a cell and shows it when instructed to by the
|
|
943
938
|
* EditEventDispatcher service.
|
|
944
939
|
* Makes the cell focusable.
|
|
945
940
|
*/
|
|
946
941
|
class CdkPopoverEditTabOut extends CdkPopoverEdit {
|
|
947
|
-
constructor(
|
|
948
|
-
super(
|
|
949
|
-
this.focusEscapeNotifierFactory =
|
|
942
|
+
constructor() {
|
|
943
|
+
super(...arguments);
|
|
944
|
+
this.focusEscapeNotifierFactory = inject(FocusEscapeNotifierFactory);
|
|
950
945
|
this.focusTrap = undefined;
|
|
951
946
|
}
|
|
952
947
|
initFocusTrap() {
|
|
@@ -960,10 +955,10 @@ class CdkPopoverEditTabOut extends CdkPopoverEdit {
|
|
|
960
955
|
this.closeEditOverlay();
|
|
961
956
|
});
|
|
962
957
|
}
|
|
963
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
964
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
958
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkPopoverEditTabOut, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
959
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0-next.2", type: CdkPopoverEditTabOut, isStandalone: true, selector: "[cdkPopoverEdit][cdkPopoverEditTabOut]", inputs: { template: ["cdkPopoverEdit", "template"], context: ["cdkPopoverEditContext", "context"], colspan: ["cdkPopoverEditColspan", "colspan"], disabled: ["cdkPopoverEditDisabled", "disabled"], ariaLabel: ["cdkPopoverEditAriaLabel", "ariaLabel"] }, host: { properties: { "attr.tabindex": "disabled ? null : 0", "attr.aria-haspopup": "!disabled" }, classAttribute: "cdk-popover-edit-cell" }, usesInheritance: true, ngImport: i0 }); }
|
|
965
960
|
}
|
|
966
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
961
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkPopoverEditTabOut, decorators: [{
|
|
967
962
|
type: Directive,
|
|
968
963
|
args: [{
|
|
969
964
|
selector: '[cdkPopoverEdit][cdkPopoverEditTabOut]',
|
|
@@ -971,17 +966,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0-next.2",
|
|
|
971
966
|
inputs: POPOVER_EDIT_INPUTS,
|
|
972
967
|
standalone: true,
|
|
973
968
|
}]
|
|
974
|
-
}]
|
|
969
|
+
}] });
|
|
975
970
|
/**
|
|
976
971
|
* A structural directive that shows its contents when the table row containing
|
|
977
972
|
* it is hovered or when an element in the row has focus.
|
|
978
973
|
*/
|
|
979
974
|
class CdkRowHoverContent {
|
|
980
|
-
constructor(
|
|
981
|
-
this.services =
|
|
982
|
-
this.elementRef =
|
|
983
|
-
this.templateRef =
|
|
984
|
-
this.viewContainerRef =
|
|
975
|
+
constructor() {
|
|
976
|
+
this.services = inject(EditServices);
|
|
977
|
+
this.elementRef = inject(ElementRef);
|
|
978
|
+
this.templateRef = inject(TemplateRef);
|
|
979
|
+
this.viewContainerRef = inject(ViewContainerRef);
|
|
985
980
|
this.destroyed = new Subject();
|
|
986
981
|
this.viewRef = null;
|
|
987
982
|
}
|
|
@@ -1049,24 +1044,25 @@ class CdkRowHoverContent {
|
|
|
1049
1044
|
}
|
|
1050
1045
|
});
|
|
1051
1046
|
}
|
|
1052
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1053
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1047
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkRowHoverContent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1048
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0-next.2", type: CdkRowHoverContent, isStandalone: true, selector: "[cdkRowHoverContent]", ngImport: i0 }); }
|
|
1054
1049
|
}
|
|
1055
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1050
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkRowHoverContent, decorators: [{
|
|
1056
1051
|
type: Directive,
|
|
1057
1052
|
args: [{
|
|
1058
1053
|
selector: '[cdkRowHoverContent]',
|
|
1059
1054
|
standalone: true,
|
|
1060
1055
|
}]
|
|
1061
|
-
}]
|
|
1056
|
+
}] });
|
|
1062
1057
|
/**
|
|
1063
1058
|
* Opens the closest edit popover to this element, whether it's associated with this exact
|
|
1064
1059
|
* element or an ancestor element.
|
|
1065
1060
|
*/
|
|
1066
1061
|
class CdkEditOpen {
|
|
1067
|
-
constructor(
|
|
1068
|
-
this.elementRef =
|
|
1069
|
-
this.editEventDispatcher =
|
|
1062
|
+
constructor() {
|
|
1063
|
+
this.elementRef = inject(ElementRef);
|
|
1064
|
+
this.editEventDispatcher = inject(EditEventDispatcher);
|
|
1065
|
+
const elementRef = this.elementRef;
|
|
1070
1066
|
const nativeElement = elementRef.nativeElement;
|
|
1071
1067
|
// Prevent accidental form submits.
|
|
1072
1068
|
if (nativeElement.nodeName === 'BUTTON' && !nativeElement.getAttribute('type')) {
|
|
@@ -1077,10 +1073,10 @@ class CdkEditOpen {
|
|
|
1077
1073
|
this.editEventDispatcher.editing.next(closest(this.elementRef.nativeElement, CELL_SELECTOR));
|
|
1078
1074
|
evt.stopPropagation();
|
|
1079
1075
|
}
|
|
1080
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1081
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
1076
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkEditOpen, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1077
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.0-next.2", type: CdkEditOpen, isStandalone: true, selector: "[cdkEditOpen]", host: { listeners: { "click": "openEdit($event)" } }, ngImport: i0 }); }
|
|
1082
1078
|
}
|
|
1083
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1079
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkEditOpen, decorators: [{
|
|
1084
1080
|
type: Directive,
|
|
1085
1081
|
args: [{
|
|
1086
1082
|
selector: '[cdkEditOpen]',
|
|
@@ -1089,7 +1085,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.0-next.2",
|
|
|
1089
1085
|
},
|
|
1090
1086
|
standalone: true,
|
|
1091
1087
|
}]
|
|
1092
|
-
}], ctorParameters: () => [
|
|
1088
|
+
}], ctorParameters: () => [] });
|
|
1093
1089
|
|
|
1094
1090
|
const EXPORTED_DECLARATIONS = [
|
|
1095
1091
|
CdkPopoverEdit,
|
|
@@ -1102,8 +1098,8 @@ const EXPORTED_DECLARATIONS = [
|
|
|
1102
1098
|
CdkEditOpen,
|
|
1103
1099
|
];
|
|
1104
1100
|
class CdkPopoverEditModule {
|
|
1105
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1106
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
1101
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkPopoverEditModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1102
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkPopoverEditModule, imports: [OverlayModule, CdkPopoverEdit,
|
|
1107
1103
|
CdkPopoverEditTabOut,
|
|
1108
1104
|
CdkRowHoverContent,
|
|
1109
1105
|
CdkEditControl,
|
|
@@ -1118,9 +1114,9 @@ class CdkPopoverEditModule {
|
|
|
1118
1114
|
CdkEditClose,
|
|
1119
1115
|
CdkEditable,
|
|
1120
1116
|
CdkEditOpen] }); }
|
|
1121
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
1117
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkPopoverEditModule, imports: [OverlayModule] }); }
|
|
1122
1118
|
}
|
|
1123
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1119
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.0-next.2", ngImport: i0, type: CdkPopoverEditModule, decorators: [{
|
|
1124
1120
|
type: NgModule,
|
|
1125
1121
|
args: [{
|
|
1126
1122
|
imports: [OverlayModule, ...EXPORTED_DECLARATIONS],
|