Skip to content

Commit 11cf015

Browse files
VasilyStrelyaevVasilyStrelyaev
authored
fix: optimize React template discover renders (DevExpress#28626)
1 parent c10456a commit 11cf015

File tree

94 files changed

+1763
-208
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

94 files changed

+1763
-208
lines changed

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,7 @@
4444
"axe-core": "4.10.2",
4545
"cheerio": "1.0.0-rc.10",
4646
"codelyzer": "6.0.2",
47-
"devextreme-internal-tools": "16.3.1",
47+
"devextreme-internal-tools": "16.4.1",
4848
"http-server": "14.1.1",
4949
"husky": "8.0.3",
5050
"jest": "29.7.0",

‎packages/devextreme-angular/src/ui/context-menu/nested/item-dxi.ts‎

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,10 @@ import {
1010
Inject,
1111
AfterViewInit,
1212
SkipSelf,
13-
Input
13+
Input,
14+
ContentChildren,
15+
forwardRef,
16+
QueryList
1417
} from '@angular/core';
1518

1619
import { DOCUMENT } from '@angular/common';
@@ -122,6 +125,14 @@ export class DxiContextMenuItemComponent extends CollectionNestedOption implemen
122125
}
123126

124127

128+
@ContentChildren(forwardRef(() => DxiContextMenuItemComponent))
129+
get itemsChildren(): QueryList<DxiContextMenuItemComponent> {
130+
return this._getOption('items');
131+
}
132+
set itemsChildren(value) {
133+
this.setChildren('items', value);
134+
}
135+
125136
constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost,
126137
@Host() optionHost: NestedOptionHost,
127138
private renderer: Renderer2,

‎packages/devextreme-angular/src/ui/data-grid/nested/filter-builder-popup.ts‎

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,10 @@ import {
1010
SkipSelf,
1111
Input,
1212
Output,
13-
EventEmitter
13+
EventEmitter,
14+
ContentChildren,
15+
forwardRef,
16+
QueryList
1417
} from '@angular/core';
1518

1619

@@ -30,6 +33,7 @@ import {
3033
NestedOptionHost,
3134
} from 'devextreme-angular/core';
3235
import { NestedOption } from 'devextreme-angular/core';
36+
import { DxiDataGridToolbarItemComponent } from './toolbar-item-dxi';
3337

3438

3539
@Component({
@@ -464,6 +468,14 @@ export class DxoDataGridFilterBuilderPopupComponent extends NestedOption impleme
464468
}
465469

466470

471+
@ContentChildren(forwardRef(() => DxiDataGridToolbarItemComponent))
472+
get toolbarItemsChildren(): QueryList<DxiDataGridToolbarItemComponent> {
473+
return this._getOption('toolbarItems');
474+
}
475+
set toolbarItemsChildren(value) {
476+
this.setChildren('toolbarItems', value);
477+
}
478+
467479
constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost,
468480
@Host() optionHost: NestedOptionHost) {
469481
super();

‎packages/devextreme-angular/src/ui/diagram/nested/command-dxi.ts‎

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,10 @@ import {
66
NgModule,
77
Host,
88
SkipSelf,
9-
Input
9+
Input,
10+
ContentChildren,
11+
forwardRef,
12+
QueryList
1013
} from '@angular/core';
1114

1215

@@ -19,6 +22,7 @@ import {
1922
NestedOptionHost,
2023
} from 'devextreme-angular/core';
2124
import { CollectionNestedOption } from 'devextreme-angular/core';
25+
import { DxiDiagramItemComponent } from './item-dxi';
2226

2327

2428
@Component({
@@ -74,6 +78,14 @@ export class DxiDiagramCommandComponent extends CollectionNestedOption {
7478
}
7579

7680

81+
@ContentChildren(forwardRef(() => DxiDiagramItemComponent))
82+
get itemsChildren(): QueryList<DxiDiagramItemComponent> {
83+
return this._getOption('items');
84+
}
85+
set itemsChildren(value) {
86+
this.setChildren('items', value);
87+
}
88+
7789
constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost,
7890
@Host() optionHost: NestedOptionHost) {
7991
super();

‎packages/devextreme-angular/src/ui/file-manager/nested/context-menu-item-dxi.ts‎

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,10 @@ import {
66
NgModule,
77
Host,
88
SkipSelf,
9-
Input
9+
Input,
10+
ContentChildren,
11+
forwardRef,
12+
QueryList
1013
} from '@angular/core';
1114

1215

@@ -18,6 +21,7 @@ import {
1821
NestedOptionHost,
1922
} from 'devextreme-angular/core';
2023
import { CollectionNestedOption } from 'devextreme-angular/core';
24+
import { DxiFileManagerItemComponent } from './item-dxi';
2125

2226

2327
@Component({
@@ -113,6 +117,14 @@ export class DxiFileManagerContextMenuItemComponent extends CollectionNestedOpti
113117
}
114118

115119

120+
@ContentChildren(forwardRef(() => DxiFileManagerItemComponent))
121+
get itemsChildren(): QueryList<DxiFileManagerItemComponent> {
122+
return this._getOption('items');
123+
}
124+
set itemsChildren(value) {
125+
this.setChildren('items', value);
126+
}
127+
116128
constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost,
117129
@Host() optionHost: NestedOptionHost) {
118130
super();

‎packages/devextreme-angular/src/ui/file-manager/nested/item-dxi.ts‎

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,10 @@ import {
66
NgModule,
77
Host,
88
SkipSelf,
9-
Input
9+
Input,
10+
ContentChildren,
11+
forwardRef,
12+
QueryList
1013
} from '@angular/core';
1114

1215

@@ -163,6 +166,14 @@ export class DxiFileManagerItemComponent extends CollectionNestedOption {
163166
}
164167

165168

169+
@ContentChildren(forwardRef(() => DxiFileManagerItemComponent))
170+
get itemsChildren(): QueryList<DxiFileManagerItemComponent> {
171+
return this._getOption('items');
172+
}
173+
set itemsChildren(value) {
174+
this.setChildren('items', value);
175+
}
176+
166177
constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost,
167178
@Host() optionHost: NestedOptionHost) {
168179
super();

‎packages/devextreme-angular/src/ui/gantt/index.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,7 @@ import { DxoGanttColumnHeaderFilterModule } from 'devextreme-angular/ui/gantt/ne
6666
import { DxoGanttColumnHeaderFilterSearchModule } from 'devextreme-angular/ui/gantt/nested';
6767
import { DxoGanttContextMenuModule } from 'devextreme-angular/ui/gantt/nested';
6868
import { DxiGanttContextMenuItemModule } from 'devextreme-angular/ui/gantt/nested';
69+
import { DxiGanttContextMenuItemItemModule } from 'devextreme-angular/ui/gantt/nested';
6970
import { DxoGanttDependenciesModule } from 'devextreme-angular/ui/gantt/nested';
7071
import { DxoGanttEditingModule } from 'devextreme-angular/ui/gantt/nested';
7172
import { DxoGanttFilterRowModule } from 'devextreme-angular/ui/gantt/nested';
@@ -1372,6 +1373,7 @@ export class DxGanttComponent extends DxComponent implements OnDestroy, OnChange
13721373
DxoGanttColumnHeaderFilterSearchModule,
13731374
DxoGanttContextMenuModule,
13741375
DxiGanttContextMenuItemModule,
1376+
DxiGanttContextMenuItemItemModule,
13751377
DxoGanttDependenciesModule,
13761378
DxoGanttEditingModule,
13771379
DxoGanttFilterRowModule,
@@ -1424,6 +1426,7 @@ export class DxGanttComponent extends DxComponent implements OnDestroy, OnChange
14241426
DxoGanttColumnHeaderFilterSearchModule,
14251427
DxoGanttContextMenuModule,
14261428
DxiGanttContextMenuItemModule,
1429+
DxiGanttContextMenuItemItemModule,
14271430
DxoGanttDependenciesModule,
14281431
DxoGanttEditingModule,
14291432
DxoGanttFilterRowModule,

‎packages/devextreme-angular/src/ui/gantt/nested/context-menu-item-dxi.ts‎

Lines changed: 22 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,10 @@ import {
1010
Inject,
1111
AfterViewInit,
1212
SkipSelf,
13-
Input
13+
Input,
14+
ContentChildren,
15+
forwardRef,
16+
QueryList
1417
} from '@angular/core';
1518

1619
import { DOCUMENT } from '@angular/common';
@@ -27,6 +30,8 @@ import {
2730
DxTemplateHost
2831
} from 'devextreme-angular/core';
2932
import { CollectionNestedOption } from 'devextreme-angular/core';
33+
import { DxiGanttContextMenuItemItemComponent } from './context-menu-item-item-dxi';
34+
import { DxiGanttItemComponent } from './item-dxi';
3035

3136

3237
@Component({
@@ -131,6 +136,22 @@ export class DxiGanttContextMenuItemComponent extends CollectionNestedOption imp
131136
}
132137

133138

139+
@ContentChildren(forwardRef(() => DxiGanttContextMenuItemItemComponent))
140+
get contextMenuItemItemsChildren(): QueryList<DxiGanttContextMenuItemItemComponent> {
141+
return this._getOption('items');
142+
}
143+
set contextMenuItemItemsChildren(value) {
144+
this.setChildren('items', value);
145+
}
146+
147+
@ContentChildren(forwardRef(() => DxiGanttItemComponent))
148+
get itemsChildren(): QueryList<DxiGanttItemComponent> {
149+
return this._getOption('items');
150+
}
151+
set itemsChildren(value) {
152+
this.setChildren('items', value);
153+
}
154+
134155
constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost,
135156
@Host() optionHost: NestedOptionHost,
136157
private renderer: Renderer2,

‎packages/devextreme-angular/src/ui/gantt/nested/context-menu-item-item-dxi.ts‎

Lines changed: 160 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,160 @@
1+
/* tslint:disable:max-line-length */
2+
3+
4+
import {
5+
Component,
6+
NgModule,
7+
Host,
8+
ElementRef,
9+
Renderer2,
10+
Inject,
11+
AfterViewInit,
12+
SkipSelf,
13+
Input
14+
} from '@angular/core';
15+
16+
import { DOCUMENT } from '@angular/common';
17+
18+
19+
import { dxContextMenuItem } from 'devextreme/ui/context_menu';
20+
21+
import {
22+
NestedOptionHost,
23+
extractTemplate,
24+
DxTemplateDirective,
25+
IDxTemplateHost,
26+
DxTemplateHost
27+
} from 'devextreme-angular/core';
28+
import { CollectionNestedOption } from 'devextreme-angular/core';
29+
30+
31+
@Component({
32+
selector: 'dxi-gantt-context-menu-item-item',
33+
template: '<ng-content></ng-content>',
34+
styles: [':host { display: block; }'],
35+
providers: [NestedOptionHost, DxTemplateHost]
36+
})
37+
export class DxiGanttContextMenuItemItemComponent extends CollectionNestedOption implements AfterViewInit,
38+
IDxTemplateHost {
39+
@Input()
40+
get beginGroup(): boolean {
41+
return this._getOption('beginGroup');
42+
}
43+
set beginGroup(value: boolean) {
44+
this._setOption('beginGroup', value);
45+
}
46+
47+
@Input()
48+
get closeMenuOnClick(): boolean {
49+
return this._getOption('closeMenuOnClick');
50+
}
51+
set closeMenuOnClick(value: boolean) {
52+
this._setOption('closeMenuOnClick', value);
53+
}
54+
55+
@Input()
56+
get disabled(): boolean {
57+
return this._getOption('disabled');
58+
}
59+
set disabled(value: boolean) {
60+
this._setOption('disabled', value);
61+
}
62+
63+
@Input()
64+
get icon(): string {
65+
return this._getOption('icon');
66+
}
67+
set icon(value: string) {
68+
this._setOption('icon', value);
69+
}
70+
71+
@Input()
72+
get items(): Array<dxContextMenuItem> {
73+
return this._getOption('items');
74+
}
75+
set items(value: Array<dxContextMenuItem>) {
76+
this._setOption('items', value);
77+
}
78+
79+
@Input()
80+
get selectable(): boolean {
81+
return this._getOption('selectable');
82+
}
83+
set selectable(value: boolean) {
84+
this._setOption('selectable', value);
85+
}
86+
87+
@Input()
88+
get selected(): boolean {
89+
return this._getOption('selected');
90+
}
91+
set selected(value: boolean) {
92+
this._setOption('selected', value);
93+
}
94+
95+
@Input()
96+
get template(): any {
97+
return this._getOption('template');
98+
}
99+
set template(value: any) {
100+
this._setOption('template', value);
101+
}
102+
103+
@Input()
104+
get text(): string {
105+
return this._getOption('text');
106+
}
107+
set text(value: string) {
108+
this._setOption('text', value);
109+
}
110+
111+
@Input()
112+
get visible(): boolean {
113+
return this._getOption('visible');
114+
}
115+
set visible(value: boolean) {
116+
this._setOption('visible', value);
117+
}
118+
119+
120+
protected get _optionPath() {
121+
return 'items';
122+
}
123+
124+
125+
constructor(@SkipSelf() @Host() parentOptionHost: NestedOptionHost,
126+
@Host() optionHost: NestedOptionHost,
127+
private renderer: Renderer2,
128+
@Inject(DOCUMENT) private document: any,
129+
@Host() templateHost: DxTemplateHost,
130+
private element: ElementRef) {
131+
super();
132+
parentOptionHost.setNestedOption(this);
133+
optionHost.setHost(this, this._fullOptionPath.bind(this));
134+
templateHost.setHost(this);
135+
}
136+
137+
setTemplate(template: DxTemplateDirective) {
138+
this.template = template;
139+
}
140+
ngAfterViewInit() {
141+
extractTemplate(this, this.element, this.renderer, this.document);
142+
}
143+
144+
145+
146+
ngOnDestroy() {
147+
this._deleteRemovedOptions(this._fullOptionPath());
148+
}
149+
150+
}
151+
152+
@NgModule({
153+
declarations: [
154+
DxiGanttContextMenuItemItemComponent
155+
],
156+
exports: [
157+
DxiGanttContextMenuItemItemComponent
158+
],
159+
})
160+
export class DxiGanttContextMenuItemItemModule { }

0 commit comments

Comments
 (0)