@igniteui/angular-templates 17.0.1302 → 17.0.1310-beta.2

package/igx-ts/hierarchical-grid/default/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const constants_1 = require("../../../constants");
 const IgniteUIForAngularTemplate_1 = require("../../../IgniteUIForAngularTemplate");
 class IgxHierarchicalGridTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAngularTemplate {
     constructor() {
@@ -11,9 +12,7 @@ class IgxHierarchicalGridTemplate extends IgniteUIForAngularTemplate_1.IgniteUIF
         this.projectType = "igx-ts";
         this.name = "Hierarchical Grid";
         this.description = "basic IgxHierarchicalGrid";
-        this.dependencies = [
-            { import: ["IgxGridModule", "IgxHierarchicalGridModule"], from: "<%=igxPackage%>" }
-        ];
+        this.packages = [constants_1.IGNITEUI_ANGULAR_PACKAGE];
     }
 }
 module.exports = new IgxHierarchicalGridTemplate();

package/igx-ts/hierarchical-grid/hierarchical-grid-batch-editing/files/src/app/__path__/__filePrefix__.component.spec.ts

@@ -12,16 +12,16 @@ describe('<%=ClassName%>Component', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [<%=ClassName%>Component],
-      imports: [
-        FormsModule,
-        NoopAnimationsModule,
-        IgxGridModule,
-        IgxHierarchicalGridModule,
-        IgxDatePickerModule,
-        IgxCheckboxModule,
-        IgxDialogModule
-      ]
+	  imports: [
+	    FormsModule,
+	    NoopAnimationsModule,
+	    IgxGridModule,
+	    IgxHierarchicalGridModule,
+	    IgxDatePickerModule,
+	    IgxCheckboxModule,
+	    IgxDialogModule,
+	    <%=ClassName%>Component
+	  ]
     })
     .compileComponents();
   }));

package/igx-ts/hierarchical-grid/hierarchical-grid-batch-editing/files/src/app/__path__/__filePrefix__.component.ts

@@ -1,14 +1,47 @@
 import { Component, ViewChild } from '@angular/core';
-import { IgxDialogComponent, IgxGridComponent, IgxHierarchicalGridComponent,
-  IgxRowIslandComponent, Transaction } from '<%=igxPackage%>';
+import {
+  IgxDialogComponent,
+  IgxGridComponent,
+  IgxHierarchicalGridComponent,
+  IgxRowIslandComponent,
+  Transaction,
+  IgxButtonDirective,
+  IgxColumnComponent,
+  IgxCellTemplateDirective,
+  IgxGridToolbarDirective,
+  IgxGridToolbarComponent,
+  IgxInputGroupComponent,
+  IgxLabelDirective,
+  IgxInputDirective,
+  IgxCheckboxComponent,
+} from '<%=igxPackage%>';
 import { GridType } from '<%=igxPackage%>/lib/grids/common/grid.interface';
+import { ReactiveFormsModule, FormsModule } from '@angular/forms';
 import { SINGERS } from './data';
 import { Singer } from './singer';
 
 @Component({
   selector: 'app-<%=filePrefix%>',
   templateUrl: './<%=filePrefix%>.component.html',
-  styleUrls: ['./<%=filePrefix%>.component.scss']
+  styleUrls: ['./<%=filePrefix%>.component.scss'],
+  standalone: true,
+  imports: [
+    IgxButtonDirective,
+    IgxHierarchicalGridComponent,
+    IgxColumnComponent,
+    IgxCellTemplateDirective,
+    IgxRowIslandComponent,
+    IgxGridToolbarDirective,
+    IgxGridToolbarComponent,
+    IgxDialogComponent,
+    IgxInputGroupComponent,
+    IgxLabelDirective,
+    ReactiveFormsModule,
+    IgxInputDirective,
+    FormsModule,
+    IgxCheckboxComponent,
+    IgxGridComponent
+  ]
 })
 export class <%=ClassName%>Component {
   public get undoEnabledParent(): boolean {

package/igx-ts/hierarchical-grid/hierarchical-grid-batch-editing/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const constants_1 = require("../../../constants");
 const IgniteUIForAngularTemplate_1 = require("../../../IgniteUIForAngularTemplate");
 class IgxHierarchicalGridTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAngularTemplate {
     constructor() {
@@ -11,12 +12,7 @@ class IgxHierarchicalGridTemplate extends IgniteUIForAngularTemplate_1.IgniteUIF
         this.projectType = "igx-ts";
         this.name = "Hierarchical Grid With Batch Editing";
         this.description = "IgxHierarchicalGrid with batch editing";
-        this.dependencies = [
-            {
-                import: ["IgxGridModule", "IgxHierarchicalGridModule", "IgxDialogModule"],
-                from: "<%=igxPackage%>"
-            }
-        ];
+        this.packages = [constants_1.IGNITEUI_ANGULAR_PACKAGE];
     }
 }
 module.exports = new IgxHierarchicalGridTemplate();

package/igx-ts/hierarchical-grid/hierarchical-grid-custom/files/src/app/__path__/__filePrefix__.component.spec.ts

@@ -9,8 +9,7 @@ describe('<%=ClassName%>Component', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [ <%=ClassName%>Component ],
-      imports: [ NoopAnimationsModule, IgxHierarchicalGridModule ]
+      imports: [ NoopAnimationsModule, IgxHierarchicalGridModule, <%=ClassName%>Component ]
     })
     .compileComponents();
   }));

package/igx-ts/hierarchical-grid/hierarchical-grid-custom/files/src/app/__path__/__filePrefix__.component.ts

@@ -5,7 +5,8 @@ import { ARTISTS, Artist } from './data';
 @Component({
   selector: 'app-<%=filePrefix%>',
   templateUrl: './<%=filePrefix%>.component.html',
-  styleUrls: ['./<%=filePrefix%>.component.scss']
+  styleUrls: ['./<%=filePrefix%>.component.scss'],
+  standalone: true
 })
 export class <%=ClassName%>Component {
   public localData: Artist[] = ARTISTS;

package/igx-ts/hierarchical-grid/hierarchical-grid-custom/index.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const IgniteUIForAngularTemplate_1 = require("../../../IgniteUIForAngularTemplate");
+const constants_1 = require("../../../constants");
 class IgxHierarchicalGridTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAngularTemplate {
     constructor() {
         super(__dirname);
@@ -15,8 +16,18 @@ class IgxHierarchicalGridTemplate extends IgniteUIForAngularTemplate_1.IgniteUIF
         this.name = "Custom Hierarchical Grid";
         this.description = "a customizable IgxHierarchicalGrid";
         this.dependencies = [
-            { import: ["IgxGridModule", "IgxHierarchicalGridModule"], from: "<%=igxPackage%>" }
+            {
+                import: [
+                    "IgxHierarchicalGridComponent",
+                    "IgxRowIslandComponent",
+                    "IgxColumnComponent",
+                    "IgxIconComponent"
+                ],
+                from: "<%=igxPackage%>",
+                standalone: true
+            }
         ];
+        this.packages = [constants_1.IGNITEUI_ANGULAR_PACKAGE];
         this.hasExtraConfiguration = true;
     }
     setExtraConfiguration(extraConfigKeys) {
@@ -108,6 +119,11 @@ class IgxHierarchicalGridTemplate extends IgniteUIForAngularTemplate_1.IgniteUIF
                         break;
                     case "Paging":
                         this.additionalElements.push(`  <igx-paginator [perPage]="5"></igx-paginator>`);
+                        this.dependencies.push({
+                            standalone: true,
+                            import: 'IgxPaginatorComponent',
+                            from: "<%=igxPackage%>"
+                        });
                         break;
                     case "Column Pinning":
                         this.usePinning = true;
@@ -124,6 +140,36 @@ class IgxHierarchicalGridTemplate extends IgniteUIForAngularTemplate_1.IgniteUIF
                     selectedFeatures = `<p>Active Features: ${selectedFeatures}</p>`;
                 }
                 if (toolbarActions.length) {
+                    this.dependencies = [
+                        ...this.dependencies,
+                        ...[
+                            {
+                                standalone: true,
+                                import: "IgxGridToolbarComponent",
+                                from: "<%=igxPackage%>"
+                            },
+                            {
+                                standalone: true,
+                                import: "IgxGridToolbarTitleComponent",
+                                from: "<%=igxPackage%>"
+                            },
+                            {
+                                standalone: true,
+                                import: "IgxGridToolbarActionsComponent",
+                                from: "<%=igxPackage%>"
+                            },
+                            {
+                                standalone: true,
+                                import: "IgxGridToolbarPinningComponent",
+                                from: "<%=igxPackage%>"
+                            },
+                            {
+                                standalone: true,
+                                import: "IgxGridToolbarHidingComponent",
+                                from: "<%=igxPackage%>"
+                            },
+                        ],
+                    ];
                     const parts = [
                         "  <igx-grid-toolbar>",
                         "    <igx-grid-toolbar-title>Singers</igx-grid-toolbar-title>",

package/igx-ts/hierarchical-grid/hierarchical-grid-summaries/files/src/app/__path__/__filePrefix__.component.spec.ts

@@ -9,8 +9,7 @@ describe('<%=ClassName%>Component', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [ <%=ClassName%>Component ],
-      imports: [ NoopAnimationsModule, IgxHierarchicalGridModule ]
+	  imports: [NoopAnimationsModule, IgxHierarchicalGridModule, <%=ClassName%>Component]
     })
     .compileComponents();
   }));

package/igx-ts/hierarchical-grid/hierarchical-grid-summaries/files/src/app/__path__/__filePrefix__.component.ts

@@ -1,11 +1,14 @@
 import { Component } from '@angular/core';
 import { ARTISTS, Artist } from './data';
 import { CustomSummary } from './custom-summary';
+import { IgxHierarchicalGridComponent, IgxColumnComponent, IgxRowIslandComponent } from '<%=igxPackage%>';
 
 @Component({
   selector: 'app-<%=filePrefix%>',
   templateUrl: './<%=filePrefix%>.component.html',
-  styleUrls: ['./<%=filePrefix%>.component.scss']
+  styleUrls: ['./<%=filePrefix%>.component.scss'],
+  standalone: true,
+  imports: [IgxHierarchicalGridComponent, IgxColumnComponent, IgxRowIslandComponent]
 })
 export class <%=ClassName%>Component {
   public localData: Artist[] = ARTISTS;

package/igx-ts/hierarchical-grid/hierarchical-grid-summaries/files/src/app/__path__/custom-summary.ts

@@ -5,7 +5,7 @@ export class CustomSummary extends IgxNumberSummaryOperand {
     super();
   }
 
-  public operate(data?: number[]): IgxSummaryResult[] {
+  public override operate(data?: number[]): IgxSummaryResult[] {
     const result: IgxSummaryResult[] = [];
     if (!data) {
       return result;

package/igx-ts/hierarchical-grid/hierarchical-grid-summaries/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const constants_1 = require("../../../constants");
 const IgniteUIForAngularTemplate_1 = require("../../../IgniteUIForAngularTemplate");
 class IgxHierarchicalGridTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAngularTemplate {
     constructor() {
@@ -11,9 +12,7 @@ class IgxHierarchicalGridTemplate extends IgniteUIForAngularTemplate_1.IgniteUIF
         this.projectType = "igx-ts";
         this.name = "Hierarchical Grid With Summaries";
         this.description = "IgxHierarchicalGrid with summaries";
-        this.dependencies = [
-            { import: ["IgxGridModule", "IgxHierarchicalGridModule"], from: "<%=igxPackage%>" }
-        ];
+        this.packages = [constants_1.IGNITEUI_ANGULAR_PACKAGE];
     }
 }
 module.exports = new IgxHierarchicalGridTemplate();

package/igx-ts/index.js

@@ -2,9 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const cli_core_1 = require("@igniteui/cli-core");
 class IgxProjectLibrary extends cli_core_1.BaseProjectLibrary {
-    /**
-     *
-     */
     constructor() {
         super(__dirname);
         this.name = "Ignite UI for Angular";

package/igx-ts/input-group/default/files/src/app/__path__/__filePrefix__.component.spec.ts

@@ -19,20 +19,20 @@ describe('<%=ClassName%>Component', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [<%=ClassName%>Component],
-      imports: [
-        FormsModule,
-		ReactiveFormsModule,
-        NoopAnimationsModule,
-        IgxInputGroupModule,
-        IgxButtonModule,
-        IgxRippleModule,
-        IgxIconModule,
-        IgxComboModule,
-        IgxDatePickerModule,
-        IgxTimePickerModule,
-        IgxSelectModule
-      ]
+	  imports: [
+	    FormsModule,
+	    ReactiveFormsModule,
+	    NoopAnimationsModule,
+	    IgxInputGroupModule,
+	    IgxButtonModule,
+	    IgxRippleModule,
+	    IgxIconModule,
+	    IgxComboModule,
+	    IgxDatePickerModule,
+	    IgxTimePickerModule,
+	    IgxSelectModule,
+	    <%=ClassName%>Component
+	  ]
     })
       .compileComponents();
   }));

package/igx-ts/input-group/default/files/src/app/__path__/__filePrefix__.component.ts

@@ -1,5 +1,25 @@
 import { Component, OnInit } from '@angular/core';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { FormBuilder, FormGroup, Validators, ReactiveFormsModule } from '@angular/forms';
+import {
+  IgxSelectComponent,
+  IgxSelectGroupComponent,
+  IgxSelectItemComponent,
+  IgxLabelDirective,
+  IgxSelectToggleIconDirective,
+  IgxIconComponent,
+  IgxInputGroupComponent,
+  IgxInputDirective,
+  IgxSuffixDirective,
+  IgxPrefixDirective,
+  IgxHintDirective,
+  IgxComboComponent,
+  IgxDatePickerComponent,
+  IgxPickerToggleComponent,
+  IgxTimePickerComponent,
+  IgxButtonDirective,
+  IgxRippleDirective,
+} from '<%=igxPackage%>';
+import { NgFor } from '@angular/common';
 
 interface Genre {
   type: string;
@@ -9,7 +29,29 @@ interface Genre {
 @Component({
   selector: 'app-<%=filePrefix%>',
   templateUrl: './<%=filePrefix%>.component.html',
-  styleUrls: ['./<%=filePrefix%>.component.scss']
+  styleUrls: ['./<%=filePrefix%>.component.scss'],
+  standalone: true,
+  imports: [
+    ReactiveFormsModule,
+    IgxSelectComponent,
+    NgFor,
+    IgxSelectGroupComponent,
+    IgxSelectItemComponent,
+    IgxLabelDirective,
+    IgxSelectToggleIconDirective,
+    IgxIconComponent,
+    IgxInputGroupComponent,
+    IgxInputDirective,
+    IgxSuffixDirective,
+    IgxPrefixDirective,
+    IgxHintDirective,
+    IgxComboComponent,
+    IgxDatePickerComponent,
+    IgxPickerToggleComponent,
+    IgxTimePickerComponent,
+    IgxButtonDirective,
+    IgxRippleDirective
+  ]
 })
 export class <%=ClassName%>Component implements OnInit {
   public genres!: Genre[];

package/igx-ts/input-group/default/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const constants_1 = require("../../../constants");
 const IgniteUIForAngularTemplate_1 = require("../../../IgniteUIForAngularTemplate");
 class IgxInputGroupTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAngularTemplate {
     constructor() {
@@ -11,21 +12,7 @@ class IgxInputGroupTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAngu
         this.projectType = "igx-ts";
         this.name = "Input Group";
         this.description = "IgxInputGroup form view template";
-        this.dependencies = [{
-                import: [
-                    "IgxButtonModule",
-                    "IgxComboModule",
-                    "IgxDatePickerModule",
-                    "IgxIconModule",
-                    "IgxInputGroupModule",
-                    "IgxRippleModule",
-                    "IgxTimePickerModule",
-                    "IgxSelectModule"
-                ],
-                from: "<%=igxPackage%>"
-            },
-            { import: "FormsModule, ReactiveFormsModule", from: "@angular/forms" }
-        ];
+        this.packages = [constants_1.IGNITEUI_ANGULAR_PACKAGE];
     }
 }
 module.exports = new IgxInputGroupTemplate();

package/igx-ts/linear-gauge/default/files/src/app/__path__/__filePrefix__.component.spec.ts

@@ -9,8 +9,7 @@ describe('<%=ClassName%>Component', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [<%=ClassName%>Component],
-      imports: [IgxLinearGaugeModule, NoopAnimationsModule]
+	  imports: [IgxLinearGaugeModule, NoopAnimationsModule, <%=ClassName%>Componen]
     })
       .compileComponents();
   }));

package/igx-ts/linear-gauge/default/files/src/app/__path__/__filePrefix__.component.ts

@@ -1,15 +1,19 @@
 import { AfterViewInit, Component, ViewChild, ViewEncapsulation } from '@angular/core';
+import { IgxLayoutDirective, IgxButtonDirective } from '<%=igxPackage%>';
 import {
   IgxLinearGaugeComponent,
   IgxLinearGraphRangeComponent,
-  LinearGraphNeedleShape
+  LinearGraphNeedleShape,
+  IgxLinearGaugeCoreModule,
 } from 'igniteui-angular-gauges';
 
 @Component({
   selector: 'app-<%=filePrefix%>',
   templateUrl: './<%=filePrefix%>.component.html',
   styleUrls: ['./<%=filePrefix%>.component.scss'],
-  encapsulation: ViewEncapsulation.None
+  encapsulation: ViewEncapsulation.None,
+  standalone: true,
+  imports: [IgxLayoutDirective, IgxButtonDirective, IgxLinearGaugeCoreModule]
 })
 export class <%=ClassName%>Component implements AfterViewInit {
   public needleShape = LinearGraphNeedleShape

package/igx-ts/linear-gauge/default/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const constants_1 = require("../../../constants");
 const IgniteUIForAngularTemplate_1 = require("../../../IgniteUIForAngularTemplate");
 class IgxLinearGaugeTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAngularTemplate {
     constructor() {
@@ -11,13 +12,7 @@ class IgxLinearGaugeTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAng
         this.projectType = "igx-ts";
         this.name = "Linear Gauge";
         this.description = "IgxLinearGauge with different animations.";
-        this.dependencies = [
-            {
-                import: ["IgxLinearGaugeModule"],
-                from: "igniteui-angular-gauges"
-            }
-        ];
-        this.packages = ["igniteui-angular-core@~17.0.0", "igniteui-angular-gauges@~17.0.0"];
+        this.packages = ["igniteui-angular-core@~17.0.0", "igniteui-angular-gauges@~17.0.0", constants_1.IGNITEUI_ANGULAR_PACKAGE];
     }
 }
 module.exports = new IgxLinearGaugeTemplate();

package/igx-ts/list/default/files/src/app/__path__/__filePrefix__.component.spec.ts

@@ -9,8 +9,7 @@ describe('<%=ClassName%>Component', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [<%=ClassName%>Component],
-      imports: [FormsModule, IgxAvatarModule, IgxFilterModule, IgxIconModule, IgxInputGroupModule, IgxListModule]
+	 imports: [FormsModule, IgxAvatarModule, IgxFilterModule, IgxIconModule, IgxInputGroupModule, IgxListModule, <%=ClassName%>Component]
     })
       .compileComponents();
   }));

package/igx-ts/list/default/files/src/app/__path__/__filePrefix__.component.ts

@@ -1,5 +1,18 @@
 import { Component } from '@angular/core';
-import { IgxFilterOptions, IgxListItemComponent } from '<%=igxPackage%>';
+import {
+  IgxFilterOptions,
+  IgxListItemComponent,
+  IgxInputGroupComponent,
+  IgxPrefixDirective,
+  IgxIconComponent,
+  IgxInputDirective,
+  IgxSuffixDirective,
+  IgxListComponent,
+  IgxAvatarComponent,
+  IgxFilterPipe,
+} from '<%=igxPackage%>';
+import { NgIf, NgFor, NgClass } from '@angular/common';
+import { ReactiveFormsModule, FormsModule } from '@angular/forms';
 
 interface Contact {
   isFavorite: boolean;
@@ -11,7 +24,24 @@ interface Contact {
 @Component({
   selector: 'app-<%=filePrefix%>',
   templateUrl: './<%=filePrefix%>.component.html',
-  styleUrls: ['./<%=filePrefix%>.component.scss']
+  styleUrls: ['./<%=filePrefix%>.component.scss'],
+  standalone: true,
+  imports: [
+    IgxFilterPipe,
+    IgxListItemComponent,
+    IgxInputGroupComponent,
+    IgxPrefixDirective,
+    IgxIconComponent,
+    IgxInputDirective,
+    IgxSuffixDirective,
+    IgxListComponent,
+    IgxAvatarComponent,
+    NgIf,
+    NgFor,
+    NgClass,
+    ReactiveFormsModule,
+    FormsModule
+  ]
 })
 export class <%=ClassName%>Component {
   public title = '<%=name%>';

package/igx-ts/list/default/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const constants_1 = require("../../../constants");
 const IgniteUIForAngularTemplate_1 = require("../../../IgniteUIForAngularTemplate");
 class IgxListTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAngularTemplate {
     constructor() {
@@ -11,16 +12,7 @@ class IgxListTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAngularTem
         this.projectType = "igx-ts";
         this.name = "List";
         this.description = "basic IgxList";
-        this.dependencies = [{
-                import: ["IgxListModule", "IgxAvatarModule", "IgxIconModule", "IgxInputGroupModule", "IgxFilterModule"],
-                from: "<%=igxPackage%>"
-            }, {
-                import: ["CommonModule"],
-                from: "@angular/common"
-            }, {
-                import: ["FormsModule"],
-                from: "@angular/forms"
-            }];
+        this.packages = [constants_1.IGNITEUI_ANGULAR_PACKAGE];
     }
 }
 module.exports = new IgxListTemplate();

package/igx-ts/map/default/files/src/app/__path__/__filePrefix__.component.spec.ts

@@ -9,8 +9,7 @@ describe('<%=ClassName%>Component', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [<%=ClassName%>Component],
-      imports: [IgxGeographicMapModule, NoopAnimationsModule]
+	  imports: [IgxGeographicMapModule, NoopAnimationsModule, GeographicMapComponent]
     })
       .compileComponents();
   }));

package/igx-ts/map/default/files/src/app/__path__/__filePrefix__.component.ts

@@ -1,10 +1,12 @@
 import { AfterViewInit, Component, ViewChild } from '@angular/core';
-import { IgxGeographicMapComponent } from 'igniteui-angular-maps';
+import { IgxGeographicMapComponent, IgxGeographicMapCoreModule } from 'igniteui-angular-maps';
 
 @Component({
   selector: 'app-<%=filePrefix%>',
   templateUrl: './<%=filePrefix%>.component.html',
-  styleUrls: ['./<%=filePrefix%>.component.scss']
+  styleUrls: ['./<%=filePrefix%>.component.scss'],
+  standalone: true,
+  imports: [IgxGeographicMapCoreModule]
 })
 export class <%=ClassName%>Component implements AfterViewInit {
 

package/igx-ts/map/default/index.js

@@ -11,16 +11,6 @@ class IgxGeographicMapTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForA
         this.projectType = "igx-ts";
         this.name = "Geographic Map";
         this.description = "Basic IgxGeographicMap.";
-        this.dependencies = [
-            {
-                import: ["IgxGeographicMapModule"],
-                from: "igniteui-angular-maps"
-            },
-            {
-                import: ["IgxDataChartInteractivityModule"],
-                from: "igniteui-angular-charts"
-            }
-        ];
         this.packages = ["igniteui-angular-core@~17.0.0", "igniteui-angular-charts@~17.0.0", "igniteui-angular-maps@~17.0.0"];
     }
 }

package/igx-ts/pivot-grid/default/files/src/app/__path__/__filePrefix__.component.spec.ts

@@ -9,9 +9,7 @@ describe('<%=ClassName%>Component', () => {
 
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [<%=ClassName%>Component],
-      imports: [IgxPivotGridModule,
-        NoopAnimationsModule]
+	  imports: [IgxPivotGridModule, NoopAnimationsModule, <%=ClassName%>Component]
     })
       .compileComponents();
   }));

package/igx-ts/pivot-grid/default/files/src/app/__path__/__filePrefix__.component.ts

@@ -1,11 +1,13 @@
 import { Component } from '@angular/core';
 import { DATA } from './data';
-import { IPivotConfiguration, IgxPivotNumericAggregate } from '<%=igxPackage%>';
+import { IPivotConfiguration, IgxPivotNumericAggregate, IgxPivotGridComponent } from '<%=igxPackage%>';
 
 @Component({
   selector: 'app-<%=filePrefix%>',
   templateUrl: './<%=filePrefix%>.component.html',
-  styleUrls: ['./<%=filePrefix%>.component.scss']
+  styleUrls: ['./<%=filePrefix%>.component.scss'],
+  standalone: true,
+  imports: [IgxPivotGridComponent]
 })
 export class <%=ClassName%>Component {
   public data = DATA;

package/igx-ts/pivot-grid/default/index.js

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+const constants_1 = require("../../../constants");
 const IgniteUIForAngularTemplate_1 = require("../../../IgniteUIForAngularTemplate");
 class IgxPivotGridTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAngularTemplate {
     constructor() {
@@ -10,9 +11,7 @@ class IgxPivotGridTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAngul
         this.id = "pivot-grid";
         this.projectType = "igx-ts";
         this.name = "Pivot Grid";
-        this.dependencies = [
-            { import: "IgxPivotGridModule", from: "<%=igxPackage%>" }
-        ];
+        this.packages = [constants_1.IGNITEUI_ANGULAR_PACKAGE];
     }
 }
 module.exports = new IgxPivotGridTemplate();