devextreme-schematics 1.10.1 → 1.11.0-beta.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "devextreme-schematics",
-  "version": "1.10.1",
+  "version": "1.11.0-beta.0",
   "description": "DevExtreme schematics",
   "scripts": {
     "build": "tsc -p tsconfig.json",
@@ -22,18 +22,18 @@
   ],
   "schematics": "./src/collection.json",
   "dependencies": {
-    "@angular-devkit/core": "^17.3.15",
-    "@angular-devkit/schematics": "^17.3.15",
-    "@schematics/angular": "^17.3.15"
+    "@angular-devkit/core": "^17.3.12",
+    "@angular-devkit/schematics": "^17.3.12",
+    "@schematics/angular": "^17.3.12"
   },
   "devDependencies": {
     "@types/jasmine": "~3.10.18",
     "@types/node": "ts5.2",
-    "@types/semver": "^7.7.0",
+    "@types/semver": "^7.5.8",
     "jasmine": "^2.99.0",
     "rxjs": "^6.6.7",
     "tslint": "^5.20.1",
     "typescript": "~5.2.1"
   },
-  "gitHead": "c8a1d6b0ae5e608f67ed1fbbd1fba3427f3cbfcf"
+  "gitHead": "12a211ead8510e78eb1f33b6a34664823d73a4a7"
 }

package/src/add-app-template/schema.json

@@ -39,7 +39,7 @@
     "dxversion": {
       "type": "string",
       "description": "The DevExtreme version",
-      "default": "24.2.6"
+      "default": "25.1.2-beta"
     },
     "globalNgCliVersion": {
       "type":"string",

package/src/add-layout/files/src/app/__name__.ts

@@ -0,0 +1,37 @@
+import { Component, HostBinding } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { RouterModule, RouterOutlet } from '@angular/router';
+import { AuthService, ScreenService, AppInfoService } from './shared/services';
+import { DxHttpModule } from 'devextreme-angular/http';
+import { FooterComponent } from './shared/components';
+import { UnauthenticatedContentComponent } from './unauthenticated-content';
+
+
+@Component({
+  selector: '<%= prefix %>-root',
+  templateUrl: './<%= name %>.html',
+  styleUrls: ['./<%= name %>.scss'],
+  standalone: true,
+  imports: [
+    RouterModule,
+    RouterOutlet,
+    CommonModule,
+    DxHttpModule,
+    SideNavToolbarComponent,
+    FooterComponent,
+    UnauthenticatedContentComponent,
+  ],
+  providers: []
+})
+export class <%= strings.classify(name) %> {
+  @HostBinding('class') get getClass() {
+    const sizeClassName = Object.keys(this.screen.sizes).filter(cl => this.screen.sizes[cl]).join(' ');
+    return `${sizeClassName} app` ;
+  }
+
+  constructor(private authService: AuthService, private screen: ScreenService, public appInfo: AppInfoService) { }
+
+  isAuthenticated() {
+    return this.authService.loggedIn;
+  }
+}

package/src/add-layout/files/src/app/app.config.ts

@@ -0,0 +1,20 @@
+import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
+import { provideRouter, withHashLocation } from '@angular/router';
+import { routes } from './app.routes';
+import {
+    AppInfoService,
+    AuthGuardService,
+    AuthService,
+    ScreenService,
+} from './shared/services';
+
+export const appConfig: ApplicationConfig = {
+  providers: [
+    provideZoneChangeDetection({ eventCoalescing: true }),
+    provideRouter(routes, withHashLocation()),
+    AuthGuardService,
+    AuthService,
+    ScreenService,
+    AppInfoService,
+  ]
+};

package/src/add-layout/files/src/app/{app-routing.module.ts → app.routes.ts}

@@ -1,9 +1,8 @@
-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
+import { Routes } from '@angular/router';
 import { LoginFormComponent, ResetPasswordFormComponent, CreateAccountFormComponent, ChangePasswordFormComponent } from './shared/components';
 import { AuthGuardService } from './shared/services';
 
-const routes: Routes = [
+export const routes: Routes = [
   {
     path: 'login-form',
     component: LoginFormComponent,
@@ -25,10 +24,3 @@ const routes: Routes = [
     canActivate: [ AuthGuardService ]
   }
 ];
-
-@NgModule({
-  imports: [RouterModule.forRoot(routes, { useHash: true })],
-  providers: [AuthGuardService],
-  exports: [RouterModule]
-})
-export class AppRoutingModule { }

package/src/add-layout/files/src/app/layouts/side-nav-inner-toolbar/side-nav-inner-toolbar.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, NgModule, Input, ViewChild } from '@angular/core';
+import { Component, OnInit, Input, ViewChild } from '@angular/core';
 import { Router, NavigationEnd } from '@angular/router';
 import { CommonModule } from '@angular/common';
 
@@ -7,7 +7,7 @@ import { DxDrawerModule, DxDrawerTypes } from 'devextreme-angular/ui/drawer';
 import { DxScrollViewModule, DxScrollViewComponent } from 'devextreme-angular/ui/scroll-view';
 import { DxToolbarModule, DxToolbarTypes } from 'devextreme-angular/ui/toolbar';
 
-import { SideNavigationMenuModule, HeaderModule } from '../../shared/components';
+import { SideNavigationMenuComponent, HeaderComponent } from '../../shared/components';
 import { ScreenService } from '../../shared/services';
 import { ThemeService } from '../../shared/services/theme.service';
 
@@ -15,7 +15,15 @@ import { ThemeService } from '../../shared/services/theme.service';
   selector: 'app-side-nav-inner-toolbar',
   templateUrl: './side-nav-inner-toolbar.component.html',
   styleUrls: ['./side-nav-inner-toolbar.component.scss'],
-  standalone: false
+  standalone: true,
+  imports: [
+    SideNavigationMenuComponent,
+    DxDrawerModule,
+    HeaderComponent,
+    DxToolbarModule,
+    DxScrollViewModule,
+    CommonModule,
+  ]
 })
 export class SideNavInnerToolbarComponent implements OnInit {
   @ViewChild(DxScrollViewComponent, { static: true }) scrollView!: DxScrollViewComponent;
@@ -105,10 +113,3 @@ export class SideNavInnerToolbarComponent implements OnInit {
     }
   }
 }
-
-@NgModule({
-  imports: [ SideNavigationMenuModule, DxDrawerModule, HeaderModule, DxToolbarModule, DxScrollViewModule, CommonModule ],
-  exports: [ SideNavInnerToolbarComponent ],
-  declarations: [ SideNavInnerToolbarComponent ]
-})
-export class SideNavInnerToolbarModule { }

package/src/add-layout/files/src/app/layouts/side-nav-outer-toolbar/side-nav-outer-toolbar.component.ts

@@ -1,19 +1,21 @@
-import { Component, OnInit, NgModule, Input, ViewChild } from '@angular/core';
+import { Component, OnInit, Input, ViewChild } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { Router, NavigationEnd } from '@angular/router';
 
+
 import { DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
 import { DxDrawerModule, DxDrawerTypes } from 'devextreme-angular/ui/drawer';
 import { DxScrollViewModule, DxScrollViewComponent } from 'devextreme-angular/ui/scroll-view';
 
-import { SideNavigationMenuModule, HeaderModule } from '../../shared/components';
+import { SideNavigationMenuComponent, HeaderComponent } from '../../shared/components';
 import { ScreenService, ThemeService } from '../../shared/services';
 
 @Component({
   selector: 'app-side-nav-outer-toolbar',
   templateUrl: './side-nav-outer-toolbar.component.html',
   styleUrls: ['./side-nav-outer-toolbar.component.scss'],
-  standalone: false
+  standalone: true,
+  imports: [ CommonModule, SideNavigationMenuComponent, DxDrawerModule, HeaderComponent, DxScrollViewModule ],
 })
 export class SideNavOuterToolbarComponent implements OnInit {
   @ViewChild(DxScrollViewComponent, { static: true }) scrollView!: DxScrollViewComponent;
@@ -98,10 +100,3 @@ export class SideNavOuterToolbarComponent implements OnInit {
     }
   }
 }
-
-@NgModule({
-  imports: [ SideNavigationMenuModule, DxDrawerModule, HeaderModule, DxScrollViewModule, CommonModule ],
-  exports: [ SideNavOuterToolbarComponent ],
-  declarations: [ SideNavOuterToolbarComponent ]
-})
-export class SideNavOuterToolbarModule { }

package/src/add-layout/files/src/app/layouts/single-card/single-card.component.ts

@@ -1,4 +1,4 @@
-import { Component, NgModule, Input} from '@angular/core';
+import { Component, Input} from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { DxScrollViewModule }  from 'devextreme-angular/ui/scroll-view';
 
@@ -6,7 +6,8 @@ import { DxScrollViewModule }  from 'devextreme-angular/ui/scroll-view';
   selector: 'app-single-card',
   templateUrl: './single-card.component.html',
   styleUrls: ['./single-card.component.scss'],
-  standalone: false
+  standalone: true,
+  imports: [ CommonModule, DxScrollViewModule ],
 })
 export class SingleCardComponent {
   @Input()
@@ -17,12 +18,3 @@ export class SingleCardComponent {
 
   constructor() { }
 }
-
-@NgModule({
-  imports: [ CommonModule, DxScrollViewModule ],
-  exports: [ SingleCardComponent ],
-  declarations: [ SingleCardComponent ]
-})
-export class SingleCardModule {
-  
-}

package/src/add-layout/files/src/app/not-authorized-container.ts

@@ -1,7 +1,7 @@
 import { CommonModule } from '@angular/common';
-import { Component, NgModule } from '@angular/core';
+import { Component } from '@angular/core';
 import { RouterModule } from '@angular/router';
-import { SingleCardModule } from './layouts';
+import { SingleCardComponent } from './layouts';
 import { Router } from '@angular/router';
 
 @Component({
@@ -17,7 +17,12 @@ import { Router } from '@angular/router';
       height: 100%;
     }
   `],
-  standalone: false
+  standalone: true,
+  imports: [
+    CommonModule,
+    RouterModule,
+    SingleCardComponent,
+  ]
 })
 export class NotAuthorizedContainerComponent {
 
@@ -42,13 +47,3 @@ export class NotAuthorizedContainerComponent {
     }
   }
 }
-@NgModule({
-  imports: [
-    CommonModule,
-    RouterModule,
-    SingleCardModule,
-  ],
-  declarations: [NotAuthorizedContainerComponent],
-  exports: [NotAuthorizedContainerComponent]
-})
-export class NotAuthorizedContainerModule { }

package/src/add-layout/files/src/app/shared/components/change-password-form/change-password-form.component.ts

@@ -1,5 +1,5 @@
 import { CommonModule } from '@angular/common';
-import { Component, NgModule, OnInit } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Router, RouterModule } from '@angular/router';
 import { ValidationCallbackData } from 'devextreme-angular/common';
 import { DxFormModule } from 'devextreme-angular/ui/form';
@@ -11,7 +11,13 @@ import { AuthService } from '../../services';
 @Component({
   selector: 'app-change-passsword-form',
   templateUrl: './change-password-form.component.html',
-  standalone: false
+  standalone: true,
+  imports: [
+    CommonModule,
+    RouterModule,
+    DxFormModule,
+    DxLoadIndicatorModule,
+  ]
 })
 export class ChangePasswordFormComponent implements OnInit {
   loading = false;
@@ -45,14 +51,3 @@ export class ChangePasswordFormComponent implements OnInit {
     return e.value === this.formData.password;
   }
 }
-@NgModule({
-  imports: [
-    CommonModule,
-    RouterModule,
-    DxFormModule,
-    DxLoadIndicatorModule
-  ],
-  declarations: [ ChangePasswordFormComponent ],
-  exports: [ ChangePasswordFormComponent ]
-})
-export class ChangePasswordFormModule { }

package/src/add-layout/files/src/app/shared/components/create-account-form/create-account-form.component.ts

@@ -1,5 +1,5 @@
 import { CommonModule } from '@angular/common';
-import { Component, NgModule } from '@angular/core';
+import { Component } from '@angular/core';
 import { Router, RouterModule } from '@angular/router';
 import { ValidationCallbackData } from 'devextreme-angular/common';
 import { DxFormModule } from 'devextreme-angular/ui/form';
@@ -12,7 +12,13 @@ import { AuthService } from '../../services';
   selector: 'app-create-account-form',
   templateUrl: './create-account-form.component.html',
   styleUrls: ['./create-account-form.component.scss'],
-  standalone: false
+  standalone: true,
+  imports: [
+    CommonModule,
+    RouterModule,
+    DxFormModule,
+    DxLoadIndicatorModule,
+  ]
 })
 export class CreateAccountFormComponent {
   loading = false;
@@ -39,14 +45,3 @@ export class CreateAccountFormComponent {
     return e.value === this.formData.password;
   }
 }
-@NgModule({
-  imports: [
-    CommonModule,
-    RouterModule,
-    DxFormModule,
-    DxLoadIndicatorModule
-  ],
-  declarations: [ CreateAccountFormComponent ],
-  exports: [ CreateAccountFormComponent ]
-})
-export class CreateAccountFormModule { }

package/src/add-layout/files/src/app/shared/components/footer/footer.component.ts

@@ -1,4 +1,4 @@
-import { Component, NgModule } from '@angular/core';
+import { Component } from '@angular/core';
 
 @Component({
   selector: 'app-footer',
@@ -6,15 +6,9 @@ import { Component, NgModule } from '@angular/core';
     <footer><ng-content></ng-content></footer>
   `,
   styleUrls: ['./footer.component.scss'],
-  standalone: false
+  standalone: true
 })
 
 export class FooterComponent {
 
 }
-
-@NgModule({
-  declarations: [ FooterComponent ],
-  exports: [ FooterComponent ]
-})
-export class FooterModule { }

package/src/add-layout/files/src/app/shared/components/header/header.component.scss

@@ -28,7 +28,7 @@
 }
 
 :host-context(.dx-theme-generic) {
-  .dx-toolbar {
+  .header-toolbar {
     padding: 10px 0;
   }
 

package/src/add-layout/files/src/app/shared/components/header/header.component.ts

@@ -1,18 +1,25 @@
-import { Component, NgModule, Input, Output, EventEmitter, OnInit } from '@angular/core';
+import { Component, Input, Output, EventEmitter, OnInit } from '@angular/core';
+import { Router } from '@angular/router';
 import { CommonModule } from '@angular/common';
-
-import { AuthService, IUser } from '../../services';
-import { UserPanelModule } from '../user-panel/user-panel.component';
 import { DxButtonModule } from 'devextreme-angular/ui/button';
 import { DxToolbarModule } from 'devextreme-angular/ui/toolbar';
 
-import { Router } from '@angular/router';
-import {ThemeSwitcherModule} from "../theme-switcher/theme-switcher.component";
+import { AuthService, IUser } from '../../services';
+import { UserPanelComponent } from '../user-panel/user-panel.component';
+import { ThemeSwitcherComponent } from '../theme-switcher/theme-switcher.component';
+
 @Component({
   selector: 'app-header',
   templateUrl: 'header.component.html',
   styleUrls: ['./header.component.scss'],
-  standalone: false
+  standalone: true,
+  imports: [
+    CommonModule,
+    DxButtonModule,
+    UserPanelComponent,
+    DxToolbarModule,
+    ThemeSwitcherComponent,
+  ]
 })
 
 export class HeaderComponent implements OnInit {
@@ -52,16 +59,3 @@ export class HeaderComponent implements OnInit {
     this.menuToggle.emit();
   }
 }
-
-@NgModule({
-  imports: [
-    CommonModule,
-    DxButtonModule,
-    UserPanelModule,
-    DxToolbarModule,
-    ThemeSwitcherModule,
-  ],
-  declarations: [ HeaderComponent ],
-  exports: [ HeaderComponent ]
-})
-export class HeaderModule { }

package/src/add-layout/files/src/app/shared/components/login-form/login-form.component.ts

@@ -1,5 +1,5 @@
 import { CommonModule } from '@angular/common';
-import { Component, NgModule } from '@angular/core';
+import { Component } from '@angular/core';
 import { Router, RouterModule } from '@angular/router';
 import { DxFormModule } from 'devextreme-angular/ui/form';
 import { DxButtonModule } from 'devextreme-angular/ui/button';
@@ -12,7 +12,14 @@ import { AuthService } from '../../services';
   selector: 'app-login-form',
   templateUrl: './login-form.component.html',
   styleUrls: ['./login-form.component.scss'],
-  standalone: false
+  standalone: true,
+  imports: [
+    CommonModule,
+    RouterModule,
+    DxFormModule,
+    DxButtonModule,
+    DxLoadIndicatorModule,
+  ]
 })
 export class LoginFormComponent {
   loading = false;
@@ -36,15 +43,3 @@ export class LoginFormComponent {
     this.router.navigate(['/create-account']);
   }
 }
-@NgModule({
-  imports: [
-    CommonModule,
-    RouterModule,
-    DxFormModule,
-    DxButtonModule,
-    DxLoadIndicatorModule
-  ],
-  declarations: [ LoginFormComponent ],
-  exports: [ LoginFormComponent ]
-})
-export class LoginFormModule { }

package/src/add-layout/files/src/app/shared/components/reset-password-form/reset-password-form.component.ts

@@ -1,5 +1,5 @@
 import { CommonModule } from '@angular/common';
-import { Component, NgModule } from '@angular/core';
+import { Component } from '@angular/core';
 import { Router, RouterModule } from '@angular/router';
 import { DxFormModule } from 'devextreme-angular/ui/form';
 import { DxLoadIndicatorModule } from 'devextreme-angular/ui/load-indicator';
@@ -12,7 +12,13 @@ const notificationText = 'We\'ve sent a link to reset your password. Check your
   selector: 'app-reset-password-form',
   templateUrl: './reset-password-form.component.html',
   styleUrls: ['./reset-password-form.component.scss'],
-  standalone: false
+  standalone: true,
+  imports: [
+    CommonModule,
+    RouterModule,
+    DxFormModule,
+    DxLoadIndicatorModule,
+  ]
 })
 export class ResetPasswordFormComponent {
   loading = false;
@@ -36,14 +42,3 @@ export class ResetPasswordFormComponent {
     }
   }
 }
-@NgModule({
-  imports: [
-    CommonModule,
-    RouterModule,
-    DxFormModule,
-    DxLoadIndicatorModule
-  ],
-  declarations: [ResetPasswordFormComponent],
-  exports: [ResetPasswordFormComponent]
-})
-export class ResetPasswordFormModule { }

package/src/add-layout/files/src/app/shared/components/side-navigation-menu/side-navigation-menu.component.ts

@@ -1,14 +1,15 @@
-import { Component, NgModule, Output, Input, EventEmitter, ViewChild, ElementRef, AfterViewInit, OnDestroy } from '@angular/core';
+import { Component, Output, Input, EventEmitter, ViewChild, ElementRef, AfterViewInit, OnDestroy } from '@angular/core';
 import { DxTreeViewModule, DxTreeViewComponent, DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
 import { navigation } from '../../../app-navigation';
 
-import * as events from 'devextreme/events';
+import * as events from 'devextreme-angular/common/core/events';
 
 @Component({
   selector: 'app-side-navigation-menu',
   templateUrl: './side-navigation-menu.component.html',
   styleUrls: ['./side-navigation-menu.component.scss'],
-  standalone: false
+  standalone: true,
+  imports: [ DxTreeViewModule ]
 })
 export class SideNavigationMenuComponent implements AfterViewInit, OnDestroy {
   @ViewChild(DxTreeViewComponent, { static: true })
@@ -80,10 +81,3 @@ export class SideNavigationMenuComponent implements AfterViewInit, OnDestroy {
     events.off(this.elementRef.nativeElement, 'dxclick');
   }
 }
-
-@NgModule({
-  imports: [ DxTreeViewModule ],
-  declarations: [ SideNavigationMenuComponent ],
-  exports: [ SideNavigationMenuComponent ]
-})
-export class SideNavigationMenuModule { }

package/src/add-layout/files/src/app/shared/components/theme-switcher/theme-switcher.component.ts

@@ -1,6 +1,4 @@
-import {
-  Component, NgModule,
-} from '@angular/core';
+import { Component } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { DxButtonModule } from 'devextreme-angular';
 import { ThemeService } from '../../services/theme.service';
@@ -15,7 +13,8 @@ import { ThemeService } from '../../services/theme.service';
       (onClick)="onButtonClick()"
     ></dx-button>`,
   styleUrls: [],
-  standalone: false
+  standalone: true,
+  imports: [CommonModule, DxButtonModule],
 })
 export class ThemeSwitcherComponent {
   constructor(public themeService: ThemeService) {}
@@ -24,10 +23,3 @@ export class ThemeSwitcherComponent {
     this.themeService.switchTheme();
   }
 }
-
-@NgModule({
-  imports: [CommonModule, DxButtonModule],
-  declarations: [ThemeSwitcherComponent],
-  exports: [ThemeSwitcherComponent],
-})
-export class ThemeSwitcherModule { }

package/src/add-layout/files/src/app/shared/components/user-panel/user-panel.component.ts

@@ -1,4 +1,4 @@
-import { Component, NgModule, Input } from '@angular/core';
+import { Component, Input } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
 import { DxListModule } from 'devextreme-angular/ui/list';
@@ -9,9 +9,14 @@ import { DxContextMenuModule } from 'devextreme-angular/ui/context-menu';
   selector: 'app-user-panel',
   templateUrl: 'user-panel.component.html',
   styleUrls: ['./user-panel.component.scss'],
-  standalone: false
+  standalone: true,
+  imports: [
+    DxListModule,
+    DxContextMenuModule,
+    DxDropDownButtonModule,
+    CommonModule
+  ]
 })
-
 export class UserPanelComponent {
   @Input()
   menuItems: any;
@@ -19,15 +24,3 @@ export class UserPanelComponent {
   @Input()
   menuMode = 'context';
 }
-
-@NgModule({
-  imports: [
-    DxListModule,
-    DxContextMenuModule,
-    DxDropDownButtonModule,
-    CommonModule
-  ],
-  declarations: [ UserPanelComponent ],
-  exports: [ UserPanelComponent ]
-})
-export class UserPanelModule { }

package/src/add-layout/files/src/app/unauthenticated-content.ts

@@ -1,7 +1,7 @@
 import { CommonModule } from '@angular/common';
-import { Component, NgModule } from '@angular/core';
+import { Component } from '@angular/core';
 import { RouterModule } from '@angular/router';
-import { SingleCardModule } from './layouts';
+import { SingleCardComponent } from './layouts';
 import { Router } from '@angular/router';
 
 @Component({
@@ -17,7 +17,12 @@ import { Router } from '@angular/router';
       height: 100%;
     }
   `],
-  standalone: false
+  standalone: true,
+  imports: [
+    CommonModule,
+    RouterModule,
+    SingleCardComponent,
+  ]
 })
 export class UnauthenticatedContentComponent {
 
@@ -42,13 +47,3 @@ export class UnauthenticatedContentComponent {
     }
   }
 }
-@NgModule({
-  imports: [
-    CommonModule,
-    RouterModule,
-    SingleCardModule,
-  ],
-  declarations: [UnauthenticatedContentComponent],
-  exports: [UnauthenticatedContentComponent]
-})
-export class UnauthenticatedContentModule { }

package/src/add-layout/files/src/dx-styles.scss

@@ -64,10 +64,10 @@ html, body {
 
   .responsive-paddings {
     padding: 20px;
+  }
 
-    .screen-large & {
-      padding: 40px;
-    }
+  .screen-large .responsive-paddings {
+    padding: 40px;
   }
 
   .dx-card.wide-card {