Skip to content

Commit df4369e

Browse files
GoodDayForSurfajivanyandevVasilyStrelyaev
authored
Update to Demos to Angular 21
Co-authored-by: Arman Jivanyan <[email protected]> Co-authored-by: Vasily Strelyaev <[email protected]>
1 parent f3e4cf7 commit df4369e

File tree

586 files changed

+10567
-8592
lines changed

Some content is hidden

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

586 files changed

+10567
-8592
lines changed

‎.github/workflows/demos_visual_tests.yml‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -190,7 +190,7 @@ jobs:
190190
build-demos:
191191
runs-on: devextreme-shr2
192192
name: Build Demos Bundles
193-
timeout-minutes: 20
193+
timeout-minutes: 30
194194
needs: [check-should-run, determine-framework-tests-scope, build-devextreme]
195195
if: |
196196
always() &&
@@ -271,7 +271,7 @@ jobs:
271271
needs.determine-framework-tests-scope.outputs.framework-tests-scope != 'none' &&
272272
needs.build-devextreme.result == 'success'
273273
runs-on: devextreme-shr2
274-
timeout-minutes: 20
274+
timeout-minutes: 30
275275

276276
steps:
277277
- name: Get sources

‎apps/demos/Demos/Accordion/Overview/Angular/app/app.component.ts‎

Lines changed: 12 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
1-
import { NgModule, Component, enableProdMode } from '@angular/core';
2-
import { BrowserModule } from '@angular/platform-browser';
3-
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
4-
1+
import { Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
2+
import { bootstrapApplication } from '@angular/platform-browser';
53
import {
64
DxAccordionModule, DxCheckBoxModule, DxSliderModule, DxTagBoxModule,
75
} from 'devextreme-angular';
@@ -24,6 +22,12 @@ if (window && window.config?.packageConfigPaths) {
2422
styleUrls: [`.${modulePrefix}/app.component.css`],
2523
providers: [Service],
2624
preserveWhitespaces: true,
25+
imports: [
26+
DxAccordionModule,
27+
DxCheckBoxModule,
28+
DxSliderModule,
29+
DxTagBoxModule,
30+
],
2731
})
2832
export class AppComponent {
2933
companies: Company[];
@@ -33,17 +37,8 @@ export class AppComponent {
3337
}
3438
}
3539

36-
@NgModule({
37-
imports: [
38-
BrowserModule,
39-
DxAccordionModule,
40-
DxCheckBoxModule,
41-
DxSliderModule,
42-
DxTagBoxModule,
40+
bootstrapApplication(AppComponent, {
41+
providers: [
42+
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
4343
],
44-
declarations: [AppComponent],
45-
bootstrap: [AppComponent],
46-
})
47-
export class AppModule { }
48-
49-
platformBrowserDynamic().bootstrapModule(AppModule);
44+
});

‎apps/demos/Demos/ActionSheet/Basics/Angular/app/app.component.ts‎

Lines changed: 11 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
1-
import { NgModule, Component, enableProdMode } from '@angular/core';
2-
import { BrowserModule } from '@angular/platform-browser';
3-
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
4-
1+
import { bootstrapApplication } from '@angular/platform-browser';
2+
import { Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
53
import { DxActionSheetModule, DxButtonModule, DxSwitchModule } from 'devextreme-angular';
64
import notify from 'devextreme/ui/notify';
75

@@ -19,6 +17,11 @@ if (window && window.config?.packageConfigPaths) {
1917
selector: 'demo-app',
2018
templateUrl: `.${modulePrefix}/app.component.html`,
2119
styleUrls: [`.${modulePrefix}/app.component.css`],
20+
imports: [
21+
DxActionSheetModule,
22+
DxButtonModule,
23+
DxSwitchModule,
24+
],
2225
})
2326
export class AppComponent {
2427
commands: { text: string }[] = [
@@ -33,16 +36,8 @@ export class AppComponent {
3336
}
3437
}
3538

36-
@NgModule({
37-
imports: [
38-
BrowserModule,
39-
DxActionSheetModule,
40-
DxButtonModule,
41-
DxSwitchModule,
39+
bootstrapApplication(AppComponent, {
40+
providers: [
41+
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
4242
],
43-
declarations: [AppComponent],
44-
bootstrap: [AppComponent],
45-
})
46-
export class AppModule { }
47-
48-
platformBrowserDynamic().bootstrapModule(AppModule);
43+
});

‎apps/demos/Demos/ActionSheet/PopoverMode/Angular/app/app.component.html‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
<dx-list (onItemClick)="itemClick($event)">
2-
<dxi-list-item *ngFor="let contact of contacts">
2+
@for (contact of contacts; track contact.id) {
3+
<dxi-list-item>
34
<div>{{ contact.name }}</div>
45
<div>{{ contact.phone }}</div>
56
<div>{{ contact.email }}</div>
67
</dxi-list-item>
8+
}
79
</dx-list>
810
<dx-action-sheet
911
[items]="commands"

‎apps/demos/Demos/ActionSheet/PopoverMode/Angular/app/app.component.ts‎

Lines changed: 10 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
1-
import { NgModule, Component, enableProdMode } from '@angular/core';
2-
import { BrowserModule } from '@angular/platform-browser';
3-
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
4-
1+
import { bootstrapApplication } from '@angular/platform-browser';
2+
import { Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
53
import { DxActionSheetModule, DxListModule } from 'devextreme-angular';
64
import notify from 'devextreme/ui/notify';
75
import { Contact, Service } from './app.service';
@@ -21,6 +19,10 @@ if (window && window.config?.packageConfigPaths) {
2119
templateUrl: `.${modulePrefix}/app.component.html`,
2220
styleUrls: [`.${modulePrefix}/app.component.css`],
2321
providers: [Service],
22+
imports: [
23+
DxActionSheetModule,
24+
DxListModule,
25+
],
2426
})
2527
export class AppComponent {
2628
contacts: Contact[];
@@ -50,15 +52,8 @@ export class AppComponent {
5052
}
5153
}
5254

53-
@NgModule({
54-
imports: [
55-
BrowserModule,
56-
DxActionSheetModule,
57-
DxListModule,
55+
bootstrapApplication(AppComponent, {
56+
providers: [
57+
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
5858
],
59-
declarations: [AppComponent],
60-
bootstrap: [AppComponent],
61-
})
62-
export class AppModule { }
63-
64-
platformBrowserDynamic().bootstrapModule(AppModule);
59+
});

‎apps/demos/Demos/Autocomplete/Overview/Angular/app/app.component.ts‎

Lines changed: 11 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
1-
import { Component, NgModule, enableProdMode } from '@angular/core';
2-
import { BrowserModule } from '@angular/platform-browser';
3-
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
4-
import { HttpClient, HttpClientModule, HttpParams } from '@angular/common/http';
1+
import { bootstrapApplication } from '@angular/platform-browser';
2+
import { Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
3+
import { HttpClient, HttpParams, provideHttpClient, withFetch } from '@angular/common/http';
54
import { lastValueFrom } from 'rxjs';
65
import { DxAutocompleteModule } from 'devextreme-angular';
76
import { CustomStore } from 'devextreme-angular/common/data';
@@ -27,6 +26,9 @@ if (window && window.config?.packageConfigPaths) {
2726
providers: [Service],
2827
templateUrl: `.${modulePrefix}/app.component.html`,
2928
styleUrls: [`.${modulePrefix}/app.component.css`],
29+
imports: [
30+
DxAutocompleteModule,
31+
],
3032
})
3133

3234
export class AppComponent {
@@ -94,16 +96,9 @@ export class AppComponent {
9496
}
9597
}
9698

97-
@NgModule({
98-
imports: [
99-
BrowserModule,
100-
DxAutocompleteModule,
101-
HttpClientModule,
99+
bootstrapApplication(AppComponent, {
100+
providers: [
101+
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
102+
provideHttpClient(withFetch()),
102103
],
103-
declarations: [AppComponent],
104-
bootstrap: [AppComponent],
105-
})
106-
107-
export class AppModule { }
108-
109-
platformBrowserDynamic().bootstrapModule(AppModule);
104+
});

‎apps/demos/Demos/Box/Overview/Angular/app/app.component.ts‎

Lines changed: 9 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,5 @@
1-
import {
2-
NgModule, Component, enableProdMode,
3-
} from '@angular/core';
4-
import { BrowserModule } from '@angular/platform-browser';
5-
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
1+
import { bootstrapApplication } from '@angular/platform-browser';
2+
import { Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
63
import { DxBoxModule } from 'devextreme-angular';
74

85
if (!/localhost/.test(document.location.host)) {
@@ -19,18 +16,15 @@ if (window && window.config?.packageConfigPaths) {
1916
selector: 'demo-app',
2017
templateUrl: `.${modulePrefix}/app.component.html`,
2118
styleUrls: [`.${modulePrefix}/app.component.css`],
22-
})
23-
export class AppComponent {
24-
}
25-
26-
@NgModule({
2719
imports: [
28-
BrowserModule,
2920
DxBoxModule,
3021
],
31-
declarations: [AppComponent],
32-
bootstrap: [AppComponent],
3322
})
34-
export class AppModule { }
23+
export class AppComponent {
24+
}
3525

36-
platformBrowserDynamic().bootstrapModule(AppModule);
26+
bootstrapApplication(AppComponent, {
27+
providers: [
28+
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
29+
],
30+
});

‎apps/demos/Demos/Button/Icons/Angular/app/app.component.ts‎

Lines changed: 9 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
1-
import { Component, NgModule, enableProdMode } from '@angular/core';
2-
import { BrowserModule } from '@angular/platform-browser';
3-
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
1+
import { bootstrapApplication } from '@angular/platform-browser';
2+
import { Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
43
import { DxButtonModule } from 'devextreme-angular';
54
import notify from 'devextreme/ui/notify';
65

@@ -19,6 +18,9 @@ if (window && window.config?.packageConfigPaths) {
1918
templateUrl: `.${modulePrefix}/app.component.html`,
2019
styleUrls: [`.${modulePrefix}/app.component.css`],
2120
preserveWhitespaces: true,
21+
imports: [
22+
DxButtonModule,
23+
],
2224
})
2325

2426
export class AppComponent {
@@ -43,15 +45,8 @@ export class AppComponent {
4345
}
4446
}
4547

46-
@NgModule({
47-
imports: [
48-
BrowserModule,
49-
DxButtonModule,
48+
bootstrapApplication(AppComponent, {
49+
providers: [
50+
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
5051
],
51-
declarations: [AppComponent],
52-
bootstrap: [AppComponent],
53-
})
54-
55-
export class AppModule { }
56-
57-
platformBrowserDynamic().bootstrapModule(AppModule);
52+
});

‎apps/demos/Demos/Button/PredefinedTypes/Angular/app/app.component.ts‎

Lines changed: 9 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
1-
import { Component, NgModule, enableProdMode } from '@angular/core';
2-
import { BrowserModule } from '@angular/platform-browser';
3-
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
1+
import { bootstrapApplication } from '@angular/platform-browser';
2+
import { Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
43
import { DxButtonModule } from 'devextreme-angular';
54
import notify from 'devextreme/ui/notify';
65

@@ -18,6 +17,9 @@ if (window && window.config?.packageConfigPaths) {
1817
selector: 'demo-app',
1918
templateUrl: `.${modulePrefix}/app.component.html`,
2019
styleUrls: [`.${modulePrefix}/app.component.css`],
20+
imports: [
21+
DxButtonModule,
22+
],
2123
})
2224

2325
export class AppComponent {
@@ -31,15 +33,8 @@ export class AppComponent {
3133
constructor() { }
3234
}
3335

34-
@NgModule({
35-
imports: [
36-
BrowserModule,
37-
DxButtonModule,
36+
bootstrapApplication(AppComponent, {
37+
providers: [
38+
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
3839
],
39-
declarations: [AppComponent],
40-
bootstrap: [AppComponent],
41-
})
42-
43-
export class AppModule { }
44-
45-
platformBrowserDynamic().bootstrapModule(AppModule);
40+
});

‎apps/demos/Demos/ButtonGroup/Overview/Angular/app/app.component.ts‎

Lines changed: 9 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
1-
import { Component, NgModule, enableProdMode } from '@angular/core';
2-
import { BrowserModule } from '@angular/platform-browser';
3-
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
1+
import { bootstrapApplication } from '@angular/platform-browser';
2+
import { Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
43
import { DxButtonGroupModule } from 'devextreme-angular';
54
import notify from 'devextreme/ui/notify';
65

@@ -22,6 +21,9 @@ if (window && window.config?.packageConfigPaths) {
2221
templateUrl: `.${modulePrefix}/app.component.html`,
2322
styleUrls: [`.${modulePrefix}/app.component.css`],
2423
preserveWhitespaces: true,
24+
imports: [
25+
DxButtonGroupModule,
26+
],
2527
})
2628

2729
export class AppComponent {
@@ -39,15 +41,8 @@ export class AppComponent {
3941
}
4042
}
4143

42-
@NgModule({
43-
imports: [
44-
BrowserModule,
45-
DxButtonGroupModule,
44+
bootstrapApplication(AppComponent, {
45+
providers: [
46+
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
4647
],
47-
declarations: [AppComponent],
48-
bootstrap: [AppComponent],
49-
})
50-
51-
export class AppModule { }
52-
53-
platformBrowserDynamic().bootstrapModule(AppModule);
48+
});

0 commit comments

Comments
 (0)