@angular/aria 21.0.2 → 21.0.4
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/fesm2022/_accordion-chunk.mjs +108 -0
- package/fesm2022/_accordion-chunk.mjs.map +1 -0
- package/fesm2022/_combobox-chunk.mjs +425 -0
- package/fesm2022/_combobox-chunk.mjs.map +1 -0
- package/fesm2022/_combobox-listbox-chunk.mjs +240 -0
- package/fesm2022/_combobox-listbox-chunk.mjs.map +1 -0
- package/fesm2022/_combobox-tree-chunk.mjs +331 -0
- package/fesm2022/_combobox-tree-chunk.mjs.map +1 -0
- package/fesm2022/_deferred-content-chunk.mjs +124 -0
- package/fesm2022/_deferred-content-chunk.mjs.map +1 -0
- package/fesm2022/_expansion-chunk.mjs +41 -0
- package/fesm2022/_expansion-chunk.mjs.map +1 -0
- package/fesm2022/_list-chunk.mjs +287 -0
- package/fesm2022/_list-chunk.mjs.map +1 -0
- package/fesm2022/_list-navigation-chunk.mjs +116 -0
- package/fesm2022/_list-navigation-chunk.mjs.map +1 -0
- package/fesm2022/_menu-chunk.mjs +515 -0
- package/fesm2022/_menu-chunk.mjs.map +1 -0
- package/fesm2022/_pointer-event-manager-chunk.mjs +54 -0
- package/fesm2022/_pointer-event-manager-chunk.mjs.map +1 -0
- package/fesm2022/_signal-like-chunk.mjs +118 -0
- package/fesm2022/_signal-like-chunk.mjs.map +1 -0
- package/fesm2022/_tabs-chunk.mjs +159 -0
- package/fesm2022/_tabs-chunk.mjs.map +1 -0
- package/fesm2022/_toolbar-widget-group-chunk.mjs +148 -0
- package/fesm2022/_toolbar-widget-group-chunk.mjs.map +1 -0
- package/fesm2022/_widget-chunk.mjs +5 -246
- package/fesm2022/_widget-chunk.mjs.map +1 -1
- package/fesm2022/accordion.mjs +73 -55
- package/fesm2022/accordion.mjs.map +1 -1
- package/fesm2022/aria.mjs +1 -1
- package/fesm2022/aria.mjs.map +1 -1
- package/fesm2022/combobox.mjs +166 -153
- package/fesm2022/combobox.mjs.map +1 -1
- package/fesm2022/grid.mjs +287 -261
- package/fesm2022/grid.mjs.map +1 -1
- package/fesm2022/listbox.mjs +211 -197
- package/fesm2022/listbox.mjs.map +1 -1
- package/fesm2022/menu.mjs +308 -286
- package/fesm2022/menu.mjs.map +1 -1
- package/fesm2022/private.mjs +15 -2329
- package/fesm2022/private.mjs.map +1 -1
- package/fesm2022/tabs.mjs +221 -199
- package/fesm2022/tabs.mjs.map +1 -1
- package/fesm2022/toolbar.mjs +64 -48
- package/fesm2022/toolbar.mjs.map +1 -1
- package/fesm2022/tree.mjs +54 -44
- package/fesm2022/tree.mjs.map +1 -1
- package/package.json +2 -2
- package/types/_accordion-chunk.d.ts +100 -0
- package/types/_combobox-chunk.d.ts +194 -0
- package/types/_deferred-content-chunk.d.ts +42 -0
- package/types/_expansion-chunk.d.ts +40 -0
- package/types/_grid-chunk.d.ts +43 -250
- package/types/_keyboard-event-manager-chunk.d.ts +68 -0
- package/types/_list-chunk.d.ts +211 -0
- package/types/_list-navigation-chunk.d.ts +119 -0
- package/types/_listbox-chunk.d.ts +107 -0
- package/types/_menu-chunk.d.ts +267 -0
- package/types/_pointer-event-manager-chunk.d.ts +34 -0
- package/types/_tabs-chunk.d.ts +153 -0
- package/types/_toolbar-chunk.d.ts +124 -0
- package/types/_tree-chunk.d.ts +185 -0
- package/types/accordion.d.ts +65 -54
- package/types/aria.d.ts +1 -1
- package/types/combobox.d.ts +86 -56
- package/types/grid.d.ts +47 -32
- package/types/listbox.d.ts +22 -7
- package/types/menu.d.ts +135 -117
- package/types/private.d.ts +28 -1376
- package/types/tabs.d.ts +109 -88
- package/types/toolbar.d.ts +77 -66
- package/types/tree.d.ts +118 -104
- package/_adev_assets/aria-accordion.json +0 -743
- package/_adev_assets/aria-combobox.json +0 -603
- package/_adev_assets/aria-grid.json +0 -893
- package/_adev_assets/aria-listbox.json +0 -540
- package/_adev_assets/aria-menu.json +0 -1049
- package/_adev_assets/aria-tabs.json +0 -880
- package/_adev_assets/aria-toolbar.json +0 -545
- package/_adev_assets/aria-tree.json +0 -853
package/fesm2022/grid.mjs
CHANGED
|
@@ -1,40 +1,47 @@
|
|
|
1
|
-
import { _IdGenerator } from '@angular/cdk/a11y';
|
|
2
1
|
import * as i0 from '@angular/core';
|
|
3
|
-
import { inject, ElementRef, contentChildren, computed, input, booleanAttribute, afterRenderEffect, Directive,
|
|
2
|
+
import { InjectionToken, inject, ElementRef, contentChildren, computed, input, booleanAttribute, afterRenderEffect, Directive, output, model } from '@angular/core';
|
|
4
3
|
import { Directionality } from '@angular/cdk/bidi';
|
|
5
|
-
import { GridPattern,
|
|
4
|
+
import { GridPattern, GridCellWidgetPattern, GridCellPattern, GridRowPattern } from './_widget-chunk.mjs';
|
|
5
|
+
import { _IdGenerator } from '@angular/cdk/a11y';
|
|
6
|
+
import './_signal-like-chunk.mjs';
|
|
7
|
+
import '@angular/core/primitives/signals';
|
|
8
|
+
import './_pointer-event-manager-chunk.mjs';
|
|
9
|
+
import './_list-navigation-chunk.mjs';
|
|
10
|
+
|
|
11
|
+
const GRID_CELL = new InjectionToken('GRID_CELL');
|
|
12
|
+
const GRID_ROW = new InjectionToken('GRID_ROW');
|
|
6
13
|
|
|
7
14
|
class Grid {
|
|
8
15
|
_elementRef = inject(ElementRef);
|
|
9
16
|
element = this._elementRef.nativeElement;
|
|
10
|
-
_rows = contentChildren(
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
17
|
+
_rows = contentChildren(GRID_ROW, {
|
|
18
|
+
...(ngDevMode ? {
|
|
19
|
+
debugName: "_rows"
|
|
20
|
+
} : {}),
|
|
14
21
|
descendants: true
|
|
15
|
-
}
|
|
22
|
+
});
|
|
16
23
|
_rowPatterns = computed(() => this._rows().map(r => r._pattern), ...(ngDevMode ? [{
|
|
17
24
|
debugName: "_rowPatterns"
|
|
18
25
|
}] : []));
|
|
19
26
|
textDirection = inject(Directionality).valueSignal;
|
|
20
|
-
enableSelection = input(false,
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
transform: booleanAttribute
|
|
25
|
-
}]));
|
|
26
|
-
disabled = input(false, ...(ngDevMode ? [{
|
|
27
|
-
debugName: "disabled",
|
|
27
|
+
enableSelection = input(false, {
|
|
28
|
+
...(ngDevMode ? {
|
|
29
|
+
debugName: "enableSelection"
|
|
30
|
+
} : {}),
|
|
28
31
|
transform: booleanAttribute
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
32
|
+
});
|
|
33
|
+
disabled = input(false, {
|
|
34
|
+
...(ngDevMode ? {
|
|
35
|
+
debugName: "disabled"
|
|
36
|
+
} : {}),
|
|
34
37
|
transform: booleanAttribute
|
|
35
|
-
}
|
|
38
|
+
});
|
|
39
|
+
softDisabled = input(true, {
|
|
40
|
+
...(ngDevMode ? {
|
|
41
|
+
debugName: "softDisabled"
|
|
42
|
+
} : {}),
|
|
36
43
|
transform: booleanAttribute
|
|
37
|
-
}
|
|
44
|
+
});
|
|
38
45
|
focusMode = input('roving', ...(ngDevMode ? [{
|
|
39
46
|
debugName: "focusMode"
|
|
40
47
|
}] : []));
|
|
@@ -44,21 +51,21 @@ class Grid {
|
|
|
44
51
|
colWrap = input('loop', ...(ngDevMode ? [{
|
|
45
52
|
debugName: "colWrap"
|
|
46
53
|
}] : []));
|
|
47
|
-
multi = input(false,
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
54
|
+
multi = input(false, {
|
|
55
|
+
...(ngDevMode ? {
|
|
56
|
+
debugName: "multi"
|
|
57
|
+
} : {}),
|
|
51
58
|
transform: booleanAttribute
|
|
52
|
-
}
|
|
59
|
+
});
|
|
53
60
|
selectionMode = input('follow', ...(ngDevMode ? [{
|
|
54
61
|
debugName: "selectionMode"
|
|
55
62
|
}] : []));
|
|
56
|
-
enableRangeSelection = input(false,
|
|
57
|
-
|
|
63
|
+
enableRangeSelection = input(false, {
|
|
64
|
+
...(ngDevMode ? {
|
|
65
|
+
debugName: "enableRangeSelection"
|
|
66
|
+
} : {}),
|
|
58
67
|
transform: booleanAttribute
|
|
59
|
-
}
|
|
60
|
-
transform: booleanAttribute
|
|
61
|
-
}]));
|
|
68
|
+
});
|
|
62
69
|
_pattern = new GridPattern({
|
|
63
70
|
...this,
|
|
64
71
|
rows: this._rowPatterns,
|
|
@@ -88,7 +95,7 @@ class Grid {
|
|
|
88
95
|
}
|
|
89
96
|
static ɵfac = i0.ɵɵngDeclareFactory({
|
|
90
97
|
minVersion: "12.0.0",
|
|
91
|
-
version: "21.0.
|
|
98
|
+
version: "21.0.3",
|
|
92
99
|
ngImport: i0,
|
|
93
100
|
type: Grid,
|
|
94
101
|
deps: [],
|
|
@@ -96,7 +103,7 @@ class Grid {
|
|
|
96
103
|
});
|
|
97
104
|
static ɵdir = i0.ɵɵngDeclareDirective({
|
|
98
105
|
minVersion: "17.2.0",
|
|
99
|
-
version: "21.0.
|
|
106
|
+
version: "21.0.3",
|
|
100
107
|
type: Grid,
|
|
101
108
|
isStandalone: true,
|
|
102
109
|
selector: "[ngGrid]",
|
|
@@ -185,7 +192,7 @@ class Grid {
|
|
|
185
192
|
},
|
|
186
193
|
queries: [{
|
|
187
194
|
propertyName: "_rows",
|
|
188
|
-
predicate:
|
|
195
|
+
predicate: GRID_ROW,
|
|
189
196
|
descendants: true,
|
|
190
197
|
isSignal: true
|
|
191
198
|
}],
|
|
@@ -195,7 +202,7 @@ class Grid {
|
|
|
195
202
|
}
|
|
196
203
|
i0.ɵɵngDeclareClassMetadata({
|
|
197
204
|
minVersion: "12.0.0",
|
|
198
|
-
version: "21.0.
|
|
205
|
+
version: "21.0.3",
|
|
199
206
|
ngImport: i0,
|
|
200
207
|
type: Grid,
|
|
201
208
|
decorators: [{
|
|
@@ -221,7 +228,7 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
221
228
|
propDecorators: {
|
|
222
229
|
_rows: [{
|
|
223
230
|
type: i0.ContentChildren,
|
|
224
|
-
args: [i0.forwardRef(() =>
|
|
231
|
+
args: [i0.forwardRef(() => GRID_ROW), {
|
|
225
232
|
...{
|
|
226
233
|
descendants: true
|
|
227
234
|
},
|
|
@@ -302,123 +309,223 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
302
309
|
}]
|
|
303
310
|
}
|
|
304
311
|
});
|
|
305
|
-
|
|
312
|
+
|
|
313
|
+
class GridCellWidget {
|
|
306
314
|
_elementRef = inject(ElementRef);
|
|
307
315
|
element = this._elementRef.nativeElement;
|
|
308
|
-
|
|
309
|
-
debugName: "
|
|
310
|
-
descendants: true
|
|
311
|
-
}] : [{
|
|
312
|
-
descendants: true
|
|
313
|
-
}]));
|
|
314
|
-
_cellPatterns = computed(() => this._cells().map(c => c._pattern), ...(ngDevMode ? [{
|
|
315
|
-
debugName: "_cellPatterns"
|
|
316
|
+
active = computed(() => this._pattern.active(), ...(ngDevMode ? [{
|
|
317
|
+
debugName: "active"
|
|
316
318
|
}] : []));
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
debugName: "
|
|
319
|
+
_cell = inject(GRID_CELL);
|
|
320
|
+
id = input(inject(_IdGenerator).getId('ng-grid-cell-widget-', true), ...(ngDevMode ? [{
|
|
321
|
+
debugName: "id"
|
|
320
322
|
}] : []));
|
|
321
|
-
|
|
322
|
-
debugName: "
|
|
323
|
+
widgetType = input('simple', ...(ngDevMode ? [{
|
|
324
|
+
debugName: "widgetType"
|
|
323
325
|
}] : []));
|
|
324
|
-
|
|
326
|
+
disabled = input(false, {
|
|
327
|
+
...(ngDevMode ? {
|
|
328
|
+
debugName: "disabled"
|
|
329
|
+
} : {}),
|
|
330
|
+
transform: booleanAttribute
|
|
331
|
+
});
|
|
332
|
+
focusTarget = input(...(ngDevMode ? [undefined, {
|
|
333
|
+
debugName: "focusTarget"
|
|
334
|
+
}] : []));
|
|
335
|
+
onActivate = output();
|
|
336
|
+
onDeactivate = output();
|
|
337
|
+
tabindex = input(...(ngDevMode ? [undefined, {
|
|
338
|
+
debugName: "tabindex"
|
|
339
|
+
}] : []));
|
|
340
|
+
_tabIndex = computed(() => this.tabindex() ?? (this.focusTarget() ? -1 : this._pattern.tabIndex()), ...(ngDevMode ? [{
|
|
341
|
+
debugName: "_tabIndex"
|
|
342
|
+
}] : []));
|
|
343
|
+
_pattern = new GridCellWidgetPattern({
|
|
325
344
|
...this,
|
|
326
|
-
|
|
327
|
-
|
|
345
|
+
element: () => this.element,
|
|
346
|
+
cell: () => this._cell._pattern,
|
|
347
|
+
focusTarget: computed(() => {
|
|
348
|
+
if (this.focusTarget() instanceof ElementRef) {
|
|
349
|
+
return this.focusTarget().nativeElement;
|
|
350
|
+
}
|
|
351
|
+
return this.focusTarget();
|
|
352
|
+
})
|
|
328
353
|
});
|
|
354
|
+
get isActivated() {
|
|
355
|
+
return computed(() => this._pattern.isActivated());
|
|
356
|
+
}
|
|
357
|
+
constructor() {
|
|
358
|
+
afterRenderEffect(() => {
|
|
359
|
+
const activateEvent = this._pattern.lastActivateEvent();
|
|
360
|
+
if (activateEvent) {
|
|
361
|
+
this.onActivate.emit(activateEvent);
|
|
362
|
+
}
|
|
363
|
+
});
|
|
364
|
+
afterRenderEffect(() => {
|
|
365
|
+
const deactivateEvent = this._pattern.lastDeactivateEvent();
|
|
366
|
+
if (deactivateEvent) {
|
|
367
|
+
this.onDeactivate.emit(deactivateEvent);
|
|
368
|
+
}
|
|
369
|
+
});
|
|
370
|
+
}
|
|
371
|
+
activate() {
|
|
372
|
+
this._pattern.activate();
|
|
373
|
+
}
|
|
374
|
+
deactivate() {
|
|
375
|
+
this._pattern.deactivate();
|
|
376
|
+
}
|
|
329
377
|
static ɵfac = i0.ɵɵngDeclareFactory({
|
|
330
378
|
minVersion: "12.0.0",
|
|
331
|
-
version: "21.0.
|
|
379
|
+
version: "21.0.3",
|
|
332
380
|
ngImport: i0,
|
|
333
|
-
type:
|
|
381
|
+
type: GridCellWidget,
|
|
334
382
|
deps: [],
|
|
335
383
|
target: i0.ɵɵFactoryTarget.Directive
|
|
336
384
|
});
|
|
337
385
|
static ɵdir = i0.ɵɵngDeclareDirective({
|
|
338
|
-
minVersion: "17.
|
|
339
|
-
version: "21.0.
|
|
340
|
-
type:
|
|
386
|
+
minVersion: "17.1.0",
|
|
387
|
+
version: "21.0.3",
|
|
388
|
+
type: GridCellWidget,
|
|
341
389
|
isStandalone: true,
|
|
342
|
-
selector: "[
|
|
390
|
+
selector: "[ngGridCellWidget]",
|
|
343
391
|
inputs: {
|
|
344
|
-
|
|
345
|
-
classPropertyName: "
|
|
346
|
-
publicName: "
|
|
392
|
+
id: {
|
|
393
|
+
classPropertyName: "id",
|
|
394
|
+
publicName: "id",
|
|
395
|
+
isSignal: true,
|
|
396
|
+
isRequired: false,
|
|
397
|
+
transformFunction: null
|
|
398
|
+
},
|
|
399
|
+
widgetType: {
|
|
400
|
+
classPropertyName: "widgetType",
|
|
401
|
+
publicName: "widgetType",
|
|
402
|
+
isSignal: true,
|
|
403
|
+
isRequired: false,
|
|
404
|
+
transformFunction: null
|
|
405
|
+
},
|
|
406
|
+
disabled: {
|
|
407
|
+
classPropertyName: "disabled",
|
|
408
|
+
publicName: "disabled",
|
|
409
|
+
isSignal: true,
|
|
410
|
+
isRequired: false,
|
|
411
|
+
transformFunction: null
|
|
412
|
+
},
|
|
413
|
+
focusTarget: {
|
|
414
|
+
classPropertyName: "focusTarget",
|
|
415
|
+
publicName: "focusTarget",
|
|
416
|
+
isSignal: true,
|
|
417
|
+
isRequired: false,
|
|
418
|
+
transformFunction: null
|
|
419
|
+
},
|
|
420
|
+
tabindex: {
|
|
421
|
+
classPropertyName: "tabindex",
|
|
422
|
+
publicName: "tabindex",
|
|
347
423
|
isSignal: true,
|
|
348
424
|
isRequired: false,
|
|
349
425
|
transformFunction: null
|
|
350
426
|
}
|
|
351
427
|
},
|
|
428
|
+
outputs: {
|
|
429
|
+
onActivate: "onActivate",
|
|
430
|
+
onDeactivate: "onDeactivate"
|
|
431
|
+
},
|
|
352
432
|
host: {
|
|
353
|
-
attributes: {
|
|
354
|
-
"role": "row"
|
|
355
|
-
},
|
|
356
433
|
properties: {
|
|
357
|
-
"attr.
|
|
434
|
+
"attr.data-active": "active()",
|
|
435
|
+
"attr.data-active-control": "isActivated() ? \"widget\" : \"cell\"",
|
|
436
|
+
"tabindex": "_tabIndex()"
|
|
358
437
|
}
|
|
359
438
|
},
|
|
360
|
-
|
|
361
|
-
propertyName: "_cells",
|
|
362
|
-
predicate: GridCell,
|
|
363
|
-
descendants: true,
|
|
364
|
-
isSignal: true
|
|
365
|
-
}],
|
|
366
|
-
exportAs: ["ngGridRow"],
|
|
439
|
+
exportAs: ["ngGridCellWidget"],
|
|
367
440
|
ngImport: i0
|
|
368
441
|
});
|
|
369
442
|
}
|
|
370
443
|
i0.ɵɵngDeclareClassMetadata({
|
|
371
444
|
minVersion: "12.0.0",
|
|
372
|
-
version: "21.0.
|
|
445
|
+
version: "21.0.3",
|
|
373
446
|
ngImport: i0,
|
|
374
|
-
type:
|
|
447
|
+
type: GridCellWidget,
|
|
375
448
|
decorators: [{
|
|
376
449
|
type: Directive,
|
|
377
450
|
args: [{
|
|
378
|
-
selector: '[
|
|
379
|
-
exportAs: '
|
|
451
|
+
selector: '[ngGridCellWidget]',
|
|
452
|
+
exportAs: 'ngGridCellWidget',
|
|
380
453
|
host: {
|
|
381
|
-
'
|
|
382
|
-
'[attr.
|
|
454
|
+
'[attr.data-active]': 'active()',
|
|
455
|
+
'[attr.data-active-control]': 'isActivated() ? "widget" : "cell"',
|
|
456
|
+
'[tabindex]': '_tabIndex()'
|
|
383
457
|
}
|
|
384
458
|
}]
|
|
385
459
|
}],
|
|
460
|
+
ctorParameters: () => [],
|
|
386
461
|
propDecorators: {
|
|
387
|
-
|
|
388
|
-
type: i0.
|
|
389
|
-
args: [
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
isSignal: true
|
|
462
|
+
id: [{
|
|
463
|
+
type: i0.Input,
|
|
464
|
+
args: [{
|
|
465
|
+
isSignal: true,
|
|
466
|
+
alias: "id",
|
|
467
|
+
required: false
|
|
394
468
|
}]
|
|
395
469
|
}],
|
|
396
|
-
|
|
470
|
+
widgetType: [{
|
|
397
471
|
type: i0.Input,
|
|
398
472
|
args: [{
|
|
399
473
|
isSignal: true,
|
|
400
|
-
alias: "
|
|
474
|
+
alias: "widgetType",
|
|
475
|
+
required: false
|
|
476
|
+
}]
|
|
477
|
+
}],
|
|
478
|
+
disabled: [{
|
|
479
|
+
type: i0.Input,
|
|
480
|
+
args: [{
|
|
481
|
+
isSignal: true,
|
|
482
|
+
alias: "disabled",
|
|
483
|
+
required: false
|
|
484
|
+
}]
|
|
485
|
+
}],
|
|
486
|
+
focusTarget: [{
|
|
487
|
+
type: i0.Input,
|
|
488
|
+
args: [{
|
|
489
|
+
isSignal: true,
|
|
490
|
+
alias: "focusTarget",
|
|
491
|
+
required: false
|
|
492
|
+
}]
|
|
493
|
+
}],
|
|
494
|
+
onActivate: [{
|
|
495
|
+
type: i0.Output,
|
|
496
|
+
args: ["onActivate"]
|
|
497
|
+
}],
|
|
498
|
+
onDeactivate: [{
|
|
499
|
+
type: i0.Output,
|
|
500
|
+
args: ["onDeactivate"]
|
|
501
|
+
}],
|
|
502
|
+
tabindex: [{
|
|
503
|
+
type: i0.Input,
|
|
504
|
+
args: [{
|
|
505
|
+
isSignal: true,
|
|
506
|
+
alias: "tabindex",
|
|
401
507
|
required: false
|
|
402
508
|
}]
|
|
403
509
|
}]
|
|
404
510
|
}
|
|
405
511
|
});
|
|
512
|
+
|
|
406
513
|
class GridCell {
|
|
407
514
|
_elementRef = inject(ElementRef);
|
|
408
515
|
element = this._elementRef.nativeElement;
|
|
409
516
|
active = computed(() => this._pattern.active(), ...(ngDevMode ? [{
|
|
410
517
|
debugName: "active"
|
|
411
518
|
}] : []));
|
|
412
|
-
_widgets = contentChildren(GridCellWidget,
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
519
|
+
_widgets = contentChildren(GridCellWidget, {
|
|
520
|
+
...(ngDevMode ? {
|
|
521
|
+
debugName: "_widgets"
|
|
522
|
+
} : {}),
|
|
416
523
|
descendants: true
|
|
417
|
-
}
|
|
524
|
+
});
|
|
418
525
|
_widgetPatterns = computed(() => this._widgets().map(w => w._pattern), ...(ngDevMode ? [{
|
|
419
526
|
debugName: "_widgetPatterns"
|
|
420
527
|
}] : []));
|
|
421
|
-
_row = inject(
|
|
528
|
+
_row = inject(GRID_ROW);
|
|
422
529
|
textDirection = inject(Directionality).valueSignal;
|
|
423
530
|
id = input(inject(_IdGenerator).getId('ng-grid-cell-', true), ...(ngDevMode ? [{
|
|
424
531
|
debugName: "id"
|
|
@@ -438,12 +545,12 @@ class GridCell {
|
|
|
438
545
|
colIndex = input(...(ngDevMode ? [undefined, {
|
|
439
546
|
debugName: "colIndex"
|
|
440
547
|
}] : []));
|
|
441
|
-
disabled = input(false,
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
548
|
+
disabled = input(false, {
|
|
549
|
+
...(ngDevMode ? {
|
|
550
|
+
debugName: "disabled"
|
|
551
|
+
} : {}),
|
|
445
552
|
transform: booleanAttribute
|
|
446
|
-
}
|
|
553
|
+
});
|
|
447
554
|
selected = model(false, ...(ngDevMode ? [{
|
|
448
555
|
debugName: "selected"
|
|
449
556
|
}] : []));
|
|
@@ -453,12 +560,12 @@ class GridCell {
|
|
|
453
560
|
orientation = input('horizontal', ...(ngDevMode ? [{
|
|
454
561
|
debugName: "orientation"
|
|
455
562
|
}] : []));
|
|
456
|
-
wrap = input(true,
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
563
|
+
wrap = input(true, {
|
|
564
|
+
...(ngDevMode ? {
|
|
565
|
+
debugName: "wrap"
|
|
566
|
+
} : {}),
|
|
460
567
|
transform: booleanAttribute
|
|
461
|
-
}
|
|
568
|
+
});
|
|
462
569
|
tabindex = input(...(ngDevMode ? [undefined, {
|
|
463
570
|
debugName: "tabindex"
|
|
464
571
|
}] : []));
|
|
@@ -487,7 +594,7 @@ class GridCell {
|
|
|
487
594
|
}
|
|
488
595
|
static ɵfac = i0.ɵɵngDeclareFactory({
|
|
489
596
|
minVersion: "12.0.0",
|
|
490
|
-
version: "21.0.
|
|
597
|
+
version: "21.0.3",
|
|
491
598
|
ngImport: i0,
|
|
492
599
|
type: GridCell,
|
|
493
600
|
deps: [],
|
|
@@ -495,7 +602,7 @@ class GridCell {
|
|
|
495
602
|
});
|
|
496
603
|
static ɵdir = i0.ɵɵngDeclareDirective({
|
|
497
604
|
minVersion: "17.2.0",
|
|
498
|
-
version: "21.0.
|
|
605
|
+
version: "21.0.3",
|
|
499
606
|
type: GridCell,
|
|
500
607
|
isStandalone: true,
|
|
501
608
|
selector: "[ngGridCell]",
|
|
@@ -605,6 +712,10 @@ class GridCell {
|
|
|
605
712
|
"tabindex": "_tabIndex()"
|
|
606
713
|
}
|
|
607
714
|
},
|
|
715
|
+
providers: [{
|
|
716
|
+
provide: GRID_CELL,
|
|
717
|
+
useExisting: GridCell
|
|
718
|
+
}],
|
|
608
719
|
queries: [{
|
|
609
720
|
propertyName: "_widgets",
|
|
610
721
|
predicate: GridCellWidget,
|
|
@@ -617,7 +728,7 @@ class GridCell {
|
|
|
617
728
|
}
|
|
618
729
|
i0.ɵɵngDeclareClassMetadata({
|
|
619
730
|
minVersion: "12.0.0",
|
|
620
|
-
version: "21.0.
|
|
731
|
+
version: "21.0.3",
|
|
621
732
|
ngImport: i0,
|
|
622
733
|
type: GridCell,
|
|
623
734
|
decorators: [{
|
|
@@ -639,7 +750,11 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
639
750
|
'[attr.aria-colindex]': '_pattern.ariaColIndex()',
|
|
640
751
|
'[attr.aria-selected]': '_pattern.ariaSelected()',
|
|
641
752
|
'[tabindex]': '_tabIndex()'
|
|
642
|
-
}
|
|
753
|
+
},
|
|
754
|
+
providers: [{
|
|
755
|
+
provide: GRID_CELL,
|
|
756
|
+
useExisting: GridCell
|
|
757
|
+
}]
|
|
643
758
|
}]
|
|
644
759
|
}],
|
|
645
760
|
ctorParameters: () => [],
|
|
@@ -754,200 +869,111 @@ i0.ɵɵngDeclareClassMetadata({
|
|
|
754
869
|
}]
|
|
755
870
|
}
|
|
756
871
|
});
|
|
757
|
-
|
|
872
|
+
|
|
873
|
+
class GridRow {
|
|
758
874
|
_elementRef = inject(ElementRef);
|
|
759
875
|
element = this._elementRef.nativeElement;
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
|
|
765
|
-
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
debugName: "widgetType"
|
|
769
|
-
}] : []));
|
|
770
|
-
disabled = input(false, ...(ngDevMode ? [{
|
|
771
|
-
debugName: "disabled",
|
|
772
|
-
transform: booleanAttribute
|
|
773
|
-
}] : [{
|
|
774
|
-
transform: booleanAttribute
|
|
775
|
-
}]));
|
|
776
|
-
focusTarget = input(...(ngDevMode ? [undefined, {
|
|
777
|
-
debugName: "focusTarget"
|
|
876
|
+
_cells = contentChildren(GRID_CELL, {
|
|
877
|
+
...(ngDevMode ? {
|
|
878
|
+
debugName: "_cells"
|
|
879
|
+
} : {}),
|
|
880
|
+
descendants: true
|
|
881
|
+
});
|
|
882
|
+
_cellPatterns = computed(() => this._cells().map(c => c._pattern), ...(ngDevMode ? [{
|
|
883
|
+
debugName: "_cellPatterns"
|
|
778
884
|
}] : []));
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
debugName: "tabindex"
|
|
885
|
+
_grid = inject(Grid);
|
|
886
|
+
_gridPattern = computed(() => this._grid._pattern, ...(ngDevMode ? [{
|
|
887
|
+
debugName: "_gridPattern"
|
|
783
888
|
}] : []));
|
|
784
|
-
|
|
785
|
-
debugName: "
|
|
889
|
+
rowIndex = input(...(ngDevMode ? [undefined, {
|
|
890
|
+
debugName: "rowIndex"
|
|
786
891
|
}] : []));
|
|
787
|
-
_pattern = new
|
|
892
|
+
_pattern = new GridRowPattern({
|
|
788
893
|
...this,
|
|
789
|
-
|
|
790
|
-
|
|
791
|
-
focusTarget: computed(() => {
|
|
792
|
-
if (this.focusTarget() instanceof ElementRef) {
|
|
793
|
-
return this.focusTarget().nativeElement;
|
|
794
|
-
}
|
|
795
|
-
return this.focusTarget();
|
|
796
|
-
})
|
|
894
|
+
cells: this._cellPatterns,
|
|
895
|
+
grid: this._gridPattern
|
|
797
896
|
});
|
|
798
|
-
get isActivated() {
|
|
799
|
-
return this._pattern.isActivated.asReadonly();
|
|
800
|
-
}
|
|
801
|
-
constructor() {
|
|
802
|
-
afterRenderEffect(() => {
|
|
803
|
-
const activateEvent = this._pattern.lastActivateEvent();
|
|
804
|
-
if (activateEvent) {
|
|
805
|
-
this.onActivate.emit(activateEvent);
|
|
806
|
-
}
|
|
807
|
-
});
|
|
808
|
-
afterRenderEffect(() => {
|
|
809
|
-
const deactivateEvent = this._pattern.lastDeactivateEvent();
|
|
810
|
-
if (deactivateEvent) {
|
|
811
|
-
this.onDeactivate.emit(deactivateEvent);
|
|
812
|
-
}
|
|
813
|
-
});
|
|
814
|
-
}
|
|
815
|
-
activate() {
|
|
816
|
-
this._pattern.activate();
|
|
817
|
-
}
|
|
818
|
-
deactivate() {
|
|
819
|
-
this._pattern.deactivate();
|
|
820
|
-
}
|
|
821
897
|
static ɵfac = i0.ɵɵngDeclareFactory({
|
|
822
898
|
minVersion: "12.0.0",
|
|
823
|
-
version: "21.0.
|
|
899
|
+
version: "21.0.3",
|
|
824
900
|
ngImport: i0,
|
|
825
|
-
type:
|
|
901
|
+
type: GridRow,
|
|
826
902
|
deps: [],
|
|
827
903
|
target: i0.ɵɵFactoryTarget.Directive
|
|
828
904
|
});
|
|
829
905
|
static ɵdir = i0.ɵɵngDeclareDirective({
|
|
830
|
-
minVersion: "17.
|
|
831
|
-
version: "21.0.
|
|
832
|
-
type:
|
|
906
|
+
minVersion: "17.2.0",
|
|
907
|
+
version: "21.0.3",
|
|
908
|
+
type: GridRow,
|
|
833
909
|
isStandalone: true,
|
|
834
|
-
selector: "[
|
|
910
|
+
selector: "[ngGridRow]",
|
|
835
911
|
inputs: {
|
|
836
|
-
|
|
837
|
-
classPropertyName: "
|
|
838
|
-
publicName: "
|
|
839
|
-
isSignal: true,
|
|
840
|
-
isRequired: false,
|
|
841
|
-
transformFunction: null
|
|
842
|
-
},
|
|
843
|
-
widgetType: {
|
|
844
|
-
classPropertyName: "widgetType",
|
|
845
|
-
publicName: "widgetType",
|
|
846
|
-
isSignal: true,
|
|
847
|
-
isRequired: false,
|
|
848
|
-
transformFunction: null
|
|
849
|
-
},
|
|
850
|
-
disabled: {
|
|
851
|
-
classPropertyName: "disabled",
|
|
852
|
-
publicName: "disabled",
|
|
853
|
-
isSignal: true,
|
|
854
|
-
isRequired: false,
|
|
855
|
-
transformFunction: null
|
|
856
|
-
},
|
|
857
|
-
focusTarget: {
|
|
858
|
-
classPropertyName: "focusTarget",
|
|
859
|
-
publicName: "focusTarget",
|
|
860
|
-
isSignal: true,
|
|
861
|
-
isRequired: false,
|
|
862
|
-
transformFunction: null
|
|
863
|
-
},
|
|
864
|
-
tabindex: {
|
|
865
|
-
classPropertyName: "tabindex",
|
|
866
|
-
publicName: "tabindex",
|
|
912
|
+
rowIndex: {
|
|
913
|
+
classPropertyName: "rowIndex",
|
|
914
|
+
publicName: "rowIndex",
|
|
867
915
|
isSignal: true,
|
|
868
916
|
isRequired: false,
|
|
869
917
|
transformFunction: null
|
|
870
918
|
}
|
|
871
919
|
},
|
|
872
|
-
outputs: {
|
|
873
|
-
onActivate: "onActivate",
|
|
874
|
-
onDeactivate: "onDeactivate"
|
|
875
|
-
},
|
|
876
920
|
host: {
|
|
921
|
+
attributes: {
|
|
922
|
+
"role": "row"
|
|
923
|
+
},
|
|
877
924
|
properties: {
|
|
878
|
-
"attr.
|
|
879
|
-
"attr.data-active-control": "isActivated() ? \"widget\" : \"cell\"",
|
|
880
|
-
"tabindex": "_tabIndex()"
|
|
925
|
+
"attr.aria-rowindex": "_pattern.rowIndex()"
|
|
881
926
|
}
|
|
882
927
|
},
|
|
883
|
-
|
|
928
|
+
providers: [{
|
|
929
|
+
provide: GRID_ROW,
|
|
930
|
+
useExisting: GridRow
|
|
931
|
+
}],
|
|
932
|
+
queries: [{
|
|
933
|
+
propertyName: "_cells",
|
|
934
|
+
predicate: GRID_CELL,
|
|
935
|
+
descendants: true,
|
|
936
|
+
isSignal: true
|
|
937
|
+
}],
|
|
938
|
+
exportAs: ["ngGridRow"],
|
|
884
939
|
ngImport: i0
|
|
885
940
|
});
|
|
886
941
|
}
|
|
887
942
|
i0.ɵɵngDeclareClassMetadata({
|
|
888
943
|
minVersion: "12.0.0",
|
|
889
|
-
version: "21.0.
|
|
944
|
+
version: "21.0.3",
|
|
890
945
|
ngImport: i0,
|
|
891
|
-
type:
|
|
946
|
+
type: GridRow,
|
|
892
947
|
decorators: [{
|
|
893
948
|
type: Directive,
|
|
894
949
|
args: [{
|
|
895
|
-
selector: '[
|
|
896
|
-
exportAs: '
|
|
950
|
+
selector: '[ngGridRow]',
|
|
951
|
+
exportAs: 'ngGridRow',
|
|
897
952
|
host: {
|
|
898
|
-
'
|
|
899
|
-
'[attr.
|
|
900
|
-
|
|
901
|
-
|
|
953
|
+
'role': 'row',
|
|
954
|
+
'[attr.aria-rowindex]': '_pattern.rowIndex()'
|
|
955
|
+
},
|
|
956
|
+
providers: [{
|
|
957
|
+
provide: GRID_ROW,
|
|
958
|
+
useExisting: GridRow
|
|
959
|
+
}]
|
|
902
960
|
}]
|
|
903
961
|
}],
|
|
904
|
-
ctorParameters: () => [],
|
|
905
962
|
propDecorators: {
|
|
906
|
-
|
|
907
|
-
type: i0.
|
|
908
|
-
args: [{
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
}],
|
|
914
|
-
widgetType: [{
|
|
915
|
-
type: i0.Input,
|
|
916
|
-
args: [{
|
|
917
|
-
isSignal: true,
|
|
918
|
-
alias: "widgetType",
|
|
919
|
-
required: false
|
|
920
|
-
}]
|
|
921
|
-
}],
|
|
922
|
-
disabled: [{
|
|
923
|
-
type: i0.Input,
|
|
924
|
-
args: [{
|
|
925
|
-
isSignal: true,
|
|
926
|
-
alias: "disabled",
|
|
927
|
-
required: false
|
|
928
|
-
}]
|
|
929
|
-
}],
|
|
930
|
-
focusTarget: [{
|
|
931
|
-
type: i0.Input,
|
|
932
|
-
args: [{
|
|
933
|
-
isSignal: true,
|
|
934
|
-
alias: "focusTarget",
|
|
935
|
-
required: false
|
|
963
|
+
_cells: [{
|
|
964
|
+
type: i0.ContentChildren,
|
|
965
|
+
args: [i0.forwardRef(() => GRID_CELL), {
|
|
966
|
+
...{
|
|
967
|
+
descendants: true
|
|
968
|
+
},
|
|
969
|
+
isSignal: true
|
|
936
970
|
}]
|
|
937
971
|
}],
|
|
938
|
-
|
|
939
|
-
type: i0.Output,
|
|
940
|
-
args: ["onActivate"]
|
|
941
|
-
}],
|
|
942
|
-
onDeactivate: [{
|
|
943
|
-
type: i0.Output,
|
|
944
|
-
args: ["onDeactivate"]
|
|
945
|
-
}],
|
|
946
|
-
tabindex: [{
|
|
972
|
+
rowIndex: [{
|
|
947
973
|
type: i0.Input,
|
|
948
974
|
args: [{
|
|
949
975
|
isSignal: true,
|
|
950
|
-
alias: "
|
|
976
|
+
alias: "rowIndex",
|
|
951
977
|
required: false
|
|
952
978
|
}]
|
|
953
979
|
}]
|