@igniteui/angular-templates 21.1.1491 → 21.1.1500-rc.0

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

@@ -1,83 +0,0 @@
-import { Component, OnDestroy } from '@angular/core';
-import { NgFor, NgTemplateOutlet, NgIf } from '@angular/common';
-import {
-  IgxTreeNodeComponent,
-  IgxTreeComponent,
-  IgxIconComponent,
-  IgxTooltipTargetDirective,
-  IgxTooltipDirective,
-} from '<%=igxPackage%>';
-import { Subject } from 'rxjs';
-import { take, takeUntil } from 'rxjs/operators';
-import { DATA, NodeData, REMOTE_ROOT, SelectableNodeData } from './local-data';
-import { DataService } from './services/data.service';
-
-@Component({
-  selector: 'app-<%=filePrefix%>',
-  templateUrl: './<%=filePrefix%>.component.html',
-  styleUrls: ['./<%=filePrefix%>.component.scss'],
-  providers: [DataService],
-  standalone: true,
-  imports: [
-    IgxTreeComponent,
-    NgFor,
-    IgxTreeNodeComponent,
-    NgTemplateOutlet,
-    IgxIconComponent,
-    NgIf,
-    IgxTooltipTargetDirective,
-    IgxTooltipDirective
-  ]
-})
-
-export class <%=ClassName%>Component implements OnDestroy {
-  public data = DATA;
-  public loading = false;
-  public showRefresh = false;
-  public remoteRoot = REMOTE_ROOT;
-  public remoteData: SelectableNodeData[] = [];
-  private destroy$ = new Subject<void>();
-
-  constructor(private dataService: DataService) {
-    this.dataService.data.pipe(takeUntil(this.destroy$)).subscribe((data) => {
-      this.loading = false;
-      this.remoteData = data;
-    });
-  }
-
-  public refreshData(node: IgxTreeNodeComponent<NodeData>): void {
-    this.dataService.clearData();
-    this.remoteData = [];
-    this.getNodeData(node, true);
-    this.dataService.getData();
-  }
-
-  public getNodeData(node: IgxTreeNodeComponent<any>, evt: boolean): void {
-    if (this.remoteData?.length) {
-      return;
-    }
-    if (evt) {
-      this.showRefresh = true;
-      this.loading = true;
-      this.dataService.getData();
-      this.dataService.data.pipe(take(1)).subscribe((data) => {
-        if (node.selected) {
-          data.forEach(e => {
-            if (e.Selected === undefined) {
-              e.Selected = true;
-            }
-          });
-        }
-      });
-    }
-  }
-
-  public handleSelection(node: NodeData, selected: boolean): void {
-    this.dataService.toggleSelected(node, selected);
-  }
-
-  public ngOnDestroy(): void {
-    this.destroy$.next();
-    this.destroy$.complete();
-  }
-}

package/igx-ts/tree/default/files/src/app/__path__/services/data.service.ts

@@ -1,51 +0,0 @@
-import { Injectable } from '@angular/core';
-import { Observable, ReplaySubject } from 'rxjs';
-import { NodeData, REMOTE_DATA, SelectableNodeData } from '../local-data';
-
-@Injectable()
-export class DataService {
-  private nodeData: SelectableNodeData[] = [];
-  private selectedNode: Set<string> = new Set<string>();
-  private deselectedNode: Set<string> = new Set<string>();
-  private data$: ReplaySubject<SelectableNodeData[]> = new ReplaySubject<SelectableNodeData[]>();
-  public get data(): Observable<SelectableNodeData[]> {
-    return this.data$;
-  }
-
-  public getData(): void {
-    setTimeout(() => {
-      this.nodeData = REMOTE_DATA;
-      const passed = this.nodeData.map(e => {
-        const selectionState: Partial<SelectableNodeData> = {};
-        if (this.selectedNode.has(e.Name)) {
-          selectionState.Selected = true;
-        }
-        if (this.deselectedNode.has(e.Name)) {
-          selectionState.Selected = false;
-        }
-        return Object.assign({}, e, selectionState);
-      });
-      this.data$.next(passed);
-    }, 2000);
-  }
-
-  public clearData(): void {
-    this.nodeData = [];
-    this.data$.next(this.nodeData);
-  }
-
-  public clearSelect(): void {
-    this.selectedNode = new Set<string>();
-    this.deselectedNode = new Set<string>();
-  }
-
-  public toggleSelected(node: NodeData, state: boolean): void {
-    if (state) {
-      this.selectedNode.add(node.Name);
-      this.deselectedNode.delete(node.Name);
-    } else {
-      this.deselectedNode.add(node.Name);
-      this.selectedNode.delete(node.Name);
-    }
-  }
-}

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

@@ -1,17 +0,0 @@
-<p>
-  <%=description%><br />
-    You can read more about configuring the igx-grid component in the
-    <a href="https://github.com/IgniteUI/igniteui-angular/blob/master/projects/igniteui-angular/src/lib/grids/tree-grid/README.md"
-      target="_blank">README</a> or the
-    <a href="https://www.infragistics.com/products/ignite-ui-angular/angular/components/treegrid/tree-grid"
-      target="_blank">official documentation</a>.
-</p>
-<%=selectedFeatures%>
-
-<igx-tree-grid #treeGrid [data]="localData" primaryKey="ID" childDataKey="Employees" width="990px" height="700px"
-<%=treeGridFeatures%>>
-  <igx-column field="Name" dataType="string" minWidth="200px" width="500px" <%=columnFeatures%> <%=columnPinning%>></igx-column>
-  <igx-column field="Location" dataType="string" <%=columnFeatures%>></igx-column>
-  <igx-column field="HireDate" header="Hire Date" dataType="date" minWidth="100px" <%=columnFeatures%>></igx-column>
-  <igx-column field="Age" dataType="number" minWidth="100px" <%=columnFeatures%>></igx-column><%=additionalMarkup%>
-</igx-tree-grid>

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

@@ -1,26 +0,0 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
-import { IgxCheckboxModule, IgxDatePickerModule, IgxTreeGridModule } from '<%=igxPackage%>';
-import { <%=ClassName%>Component } from './<%=filePrefix%>.component';
-
-describe('<%=ClassName%>Component', () => {
-  let component: <%=ClassName%>Component;
-  let fixture: ComponentFixture<<%=ClassName%>Component>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      imports: [BrowserAnimationsModule, IgxTreeGridModule, IgxDatePickerModule, IgxCheckboxModule, <%=ClassName%>Component]
-    })
-      .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(<%=ClassName%>Component);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

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

@@ -1,17 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { Employee, EMPLOYEE_DATA } from './localData';
-
-@Component({
-  selector: 'app-<%=filePrefix%>',
-  templateUrl: './<%=filePrefix%>.component.html',
-  styleUrls: ['./<%=filePrefix%>.component.scss'],
-  standalone: true
-})
-export class <%=ClassName%>Component implements OnInit {
-  public localData: Employee[] = [];
-  title = '<%=name%>';
-
-  ngOnInit() {
-    this.localData = EMPLOYEE_DATA;
-  }
-}

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

@@ -1,27 +0,0 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-import { NoopAnimationsModule } from '@angular/platform-browser/animations';
-import { <%=ClassName%>Component } from './<%=filePrefix%>.component';
-import { IgxAccordionModule, IgxSwitchModule } from '<%=igxPackage%>';
-
-describe('<%=ClassName%>Component', () => {
-  let component: <%=ClassName%>Component;
-  let fixture: ComponentFixture<<%=ClassName%>Component>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      declarations: [<%=ClassName%>Component],
-      imports: [ NoopAnimationsModule, IgxAccordionModule, IgxSwitchModule ]
-    })
-      .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(<%=ClassName%>Component);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

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

@@ -1,11 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
-  selector: 'app-<%=filePrefix%>',
-  templateUrl: './<%=filePrefix%>.component.html',
-  styleUrls: ['./<%=filePrefix%>.component.scss'],
-  standalone: false
-})
-export class <%=ClassName%>Component {
-  public singleBranchExpand = false;
-}

package/igx-ts-legacy/accordion/default/index.d.ts

@@ -1 +0,0 @@
-export {};

package/igx-ts-legacy/accordion/default/index.js

@@ -1,20 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const IgniteUIForAngularTemplate_1 = require("../../../IgniteUIForAngularTemplate");
-class IgxAccordionTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAngularTemplate {
-    constructor() {
-        super(__dirname);
-        this.components = ["Accordion"];
-        this.controlGroup = "Layouts";
-        this.listInComponentTemplates = true;
-        this.id = "accordion";
-        this.projectType = "igx-ts";
-        this.name = "Accordion";
-        this.description = "Basic IgxAccordion sample";
-        this.dependencies = [{
-                import: ["IgxAccordionModule", "IgxSwitchModule"],
-                from: "<%=igxPackage%>"
-            }];
-    }
-}
-module.exports = new IgxAccordionTemplate();

package/igx-ts-legacy/accordion/index.d.ts

@@ -1 +0,0 @@
-export {};

package/igx-ts-legacy/accordion/index.js

@@ -1,15 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const cli_core_1 = require("@igniteui/cli-core");
-class IgxAccordionComponent extends cli_core_1.BaseComponent {
-    /**
-     *
-     */
-    constructor() {
-        super(__dirname);
-        this.name = "Accordion";
-        this.group = "Layouts";
-        this.description = `allows users to navigate among multiple collapsible panels displayed in a single container`;
-    }
-}
-module.exports = new IgxAccordionComponent();

package/igx-ts-legacy/autocomplete/autocomplete-custom/files/src/app/__path__/__filePrefix__.component.html

@@ -1,20 +0,0 @@
-<p>The <b>igx-autocomplete</b> directive provides a way to enhance a text input by showing a panel of suggested options provided by the developer.</p>
-<p>You can read more about configuring the <b>igx-autocomplete</b> in the 
-<a href="https://github.com/IgniteUI/igniteui-angular/blob/master/projects/igniteui-angular/src/lib/directives/autocomplete/README.md" target="_blank">README</a> or the 
-<a href="https://www.infragistics.com/products/ignite-ui-angular/angular/components/autocomplete.html" target="_blank">official documentation</a>.</p>
-
-<section class="sample-content">
-  <article class="sample-column">
-    <form class="input-group-form">
-      <igx-input-group>
-        <label igxLabel for="town">Town</label>
-        <input igxInput name="town" type="text" [igxAutocomplete]="townsPanel" [(ngModel)]="townSelected" />
-      </igx-input-group>
-      <igx-drop-down #townsPanel maxHeight="300px">
-        <igx-drop-down-item *ngFor="let town of towns | <%=camelCaseName%>StartsWith:townSelected" [value]="town">
-          {{town}}
-        </igx-drop-down-item>
-      </igx-drop-down>
-    </form>
-  </article>
-</section>

package/igx-ts-legacy/autocomplete/autocomplete-custom/files/src/app/__path__/__filePrefix__.component.spec.ts

@@ -1,28 +0,0 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-import { FormsModule } from '@angular/forms';
-import { NoopAnimationsModule } from '@angular/platform-browser/animations';
-import { IgxAutocompleteModule, IgxDropDownModule, IgxInputGroupModule } from '<%=igxPackage%>';
-import { <%=ClassName%>Component, <%=ClassName%>PipeStartsWith } from './<%=filePrefix%>.component';
-
-describe('<%=ClassName%>Component', () => {
-  let component: <%=ClassName%>Component;
-  let fixture: ComponentFixture<<%=ClassName%>Component>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      declarations: [<%=ClassName%>Component, <%=ClassName%>PipeStartsWith],
-      imports: [FormsModule, IgxDropDownModule, IgxAutocompleteModule, NoopAnimationsModule, IgxInputGroupModule]
-    })
-      .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(<%=ClassName%>Component);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/igx-ts-legacy/autocomplete/autocomplete-custom/files/src/app/__path__/__filePrefix__.component.ts

@@ -1,24 +0,0 @@
-import { Component, Pipe, PipeTransform } from '@angular/core';
-import { Towns } from './towns-data';
-
-@Component({
-  selector: 'app-<%=filePrefix%>',
-  templateUrl: './<%=filePrefix%>.component.html',
-  styleUrls: ['./<%=filePrefix%>.component.scss'],
-  standalone: false
-})
-export class <%=ClassName%>Component {
-  public towns: string[];
-  public townSelected = '';
-
-  constructor() {
-    this.towns = Towns;
-  }
-}
-
-@Pipe({ name: '<%=camelCaseName%>StartsWith', standalone: false })
-export class <%=ClassName%>PipeStartsWith implements PipeTransform {
-  public transform(collection: string[], term = '') {
-    return collection.filter(item => item.toLowerCase().startsWith(term.trim().toLowerCase()));
-  }
-}

package/igx-ts-legacy/autocomplete/autocomplete-custom/files/src/app/__path__/towns-data.ts

@@ -1,27 +0,0 @@
-export const Towns: string[] = [
-  'Sofia', 'Plovdiv', 'Varna', 'Burgas', 'Ruse', 'Stara Zagora', 'Pleven', 'Dobrich', 'Sliven', 'Shumen',
-  'Pernik', 'Haskovo', 'Yambol', 'Pazardzhik', 'Blagoevgrad', 'Veliko Tarnovo', 'Vratsa', 'Gabrovo', 'Asenovgrad',
-  'Vidin', 'Kazanlak', 'Kyustendil', 'Kardzhali', 'Montana', 'Dimitrovgrad', 'Targovishte', 'Lovech', 'Silistra', 'Dupnitsa',
-  'Svishtov', 'Razgrad', 'Gorna Oryahovitsa', 'Smolyan', 'Petrich', 'Sandanski', 'Samokov', 'Sevlievo', 'Lom',
-  'Karlovo', 'Velingrad', 'Nova Zagora', 'Troyan', 'Aytos', 'Botevgrad', 'Gotse Delchev', 'Peshtera', 'Harmanli', 'Karnobat',
-  'Svilengrad', 'Panagyurishte', 'Chirpan', 'Popovo', 'Rakovski', 'Radomir', 'Novi Iskar', 'Kozloduy', 'Parvomay', 'Berkovitsa',
-  'Cherven Bryag', 'Pomorie', 'Ihtiman', 'Radnevo', 'Provadiya', 'Novi Pazar', 'Razlog', 'Byala Slatina', 'Nesebar', 'Balchik',
-  'Kostinbrod', 'Stamboliyski', 'Kavarna', 'Knezha', 'Pavlikeni', 'Mezdra', 'Etropole', 'Levski', 'Teteven', 'Elhovo', 'Bankya',
-  'Tryavna', 'Lukovit', 'Tutrakan', 'Sredets', 'Sopot', 'Byala', 'Veliki Preslav', 'Isperih', 'Belene', 'Omurtag', 'Bansko', 'Krichim',
-  'Galabovo', 'Devnya', 'Septemvri', 'Rakitovo', 'Lyaskovets', 'Svoge', 'Aksakovo', 'Kubrat', 'Dryanovo', 'Beloslav', 'Pirdop',
-  'Lyubimets', 'Momchilgrad', 'Slivnitsa', 'Hisarya', 'Zlatograd', 'Kostenets', 'Devin', 'General Toshevo', 'Simeonovgrad', 'Simitli',
-  'Elin Pelin', 'Dolni Chiflik', 'Tervel', 'Dulovo', 'Varshets', 'Kotel', 'Madan', 'Straldzha', 'Saedinenie', 'Bobov Dol', 'Tsarevo',
-  'Kuklen', 'Tvarditsa', 'Yakoruda', 'Elena', 'Topolovgrad', 'Bozhurishte', 'Chepelare', 'Oryahovo', 'Sozopol', 'Belogradchik',
-  'Perushtitsa', 'Zlatitsa', 'Strazhitsa', 'Krumovgrad', 'Kameno', 'Dalgopol', 'Vetovo', 'Suvorovo', 'Dolni Dabnik', 'Dolna Banya',
-  'Pravets', 'Nedelino', 'Polski Trambesh', 'Trastenik', 'Bratsigovo', 'Koynare', 'Godech', 'Slavyanovo', 'Dve Mogili', 'Kostandovo',
-  'Debelets', 'Strelcha', 'Sapareva Banya', 'Ignatievo', 'Smyadovo', 'Breznik', 'Sveti Vlas', 'Nikopol', 'Shivachevo', 'Belovo',
-  'Tsar Kaloyan', 'Ivaylovgrad', 'Valchedram', 'Marten', 'Glodzhevo', 'Sarnitsa', 'Letnitsa', 'Varbitsa', 'Iskar', 'Ardino', 'Shabla',
-  'Rudozem', 'Vetren', 'Kresna', 'Banya', 'Batak', 'Maglizh', 'Valchi Dol', 'Gulyantsi', 'Dragoman', 'Zavet', 'Kran', 'Miziya',
-  'Primorsko', 'Sungurlare', 'Dolna Mitropoliya', 'Krivodol', 'Kula', 'Kalofer', 'Slivo Pole', 'Kaspichan', 'Apriltsi', 'Belitsa',
-  'Roman', 'Dzhebel', 'Dolna Oryahovitsa', 'Buhovo', 'Gurkovo', 'Pavel Banya', 'Nikolaevo', 'Yablanitsa', 'Kableshkovo', 'Opaka',
-  'Rila', 'Ugarchin', 'Dunavtsi', 'Dobrinishte', 'Hadzhidimovo', 'Bregovo', 'Byala Cherkva', 'Zlataritsa', 'Kocherinovo', 'Dospat',
-  'Tran', 'Sadovo', 'Laki', 'Koprivshtitsa', 'Malko Tarnovo', 'Loznitsa', 'Obzor', 'Kilifarevo', 'Borovo',
-  'Batanovtsi', 'Chernomorets', 'Aheloy', 'Byala', 'Pordim', 'Suhindol', 'Merichleri', 'Glavinitsa', 'Chiprovtsi', 'Kermen', 'Brezovo',
-  'Plachkovtsi', 'Zemen', 'Balgarovo', 'Alfatar', 'Boychinovtsi', 'Gramada', 'Senovo', 'Momin Prohod', 'Kaolinovo', 'Shipka',
-  'Antonovo', 'Ahtopol', 'Boboshevo', 'Bolyarovo', 'Brusartsi', 'Klisura', 'Dimovo', 'Kiten', 'Pliska', 'Madzharovo', 'Melnik'
-];

package/igx-ts-legacy/autocomplete/autocomplete-custom/index.d.ts

@@ -1 +0,0 @@
-export {};

package/igx-ts-legacy/autocomplete/autocomplete-custom/index.js

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const IgniteUIForAngularTemplate_1 = require("../../../IgniteUIForAngularTemplate");
-class IgxAutocompleteTemplate extends IgniteUIForAngularTemplate_1.IgniteUIForAngularTemplate {
-    constructor() {
-        super(__dirname);
-        this.components = ["Autocomplete"];
-        this.controlGroup = "Data Entry & Display";
-        this.listInComponentTemplates = true;
-        this.id = "autocomplete";
-        this.projectType = "igx-ts";
-        this.name = "Simple Autocomplete";
-        this.description = "Simple IgxAutocomplete";
-        this.dependencies = [{
-                import: ["IgxAutocompleteModule", "IgxDropDownModule", "IgxInputGroupModule"],
-                from: "<%=igxPackage%>"
-            }, {
-                import: ["FormsModule"],
-                from: "@angular/forms"
-            }, {
-                declare: ["<%=ClassName%>PipeStartsWith"],
-                from: "./src/app/<%=path%>/<%=filePrefix%>.component.ts"
-            }];
-    }
-}
-module.exports = new IgxAutocompleteTemplate();

package/igx-ts-legacy/autocomplete/autocomplete-extended/files/src/app/__path__/__filePrefix__.component.html

@@ -1,37 +0,0 @@
-<div class="content-wrapper">
-  <p>The <b>igx-autocomplete</b> directive provides a way to enhance a text input by showing a panel of suggested options provided by the developer.<br />
-  Using the <b>igx-drop-down</b> as a provider, allows using its functionalities like grouping, templating, etc.</p>
-  <p>You can read more about configuring those components, using the following links:</p>
-  <ul>
-    <li>
-      <b>igx-autocomplete</b> -
-      <a href="https://github.com/IgniteUI/igniteui-angular/blob/master/projects/igniteui-angular/src/lib/directives/autocomplete/README.md" target="_blank">README</a> or the
-      <a href="https://www.infragistics.com/products/ignite-ui-angular/angular/components/autocomplete.html" target="_blank">official documentation</a>.
-    </li>
-    <li>
-      <b>igx-drop-down</b> -
-      <a href="https://github.com/IgniteUI/igniteui-angular/blob/master/projects/igniteui-angular/src/lib/drop-down/README.md" target="_blank">README</a> or the
-      <a href="https://www.infragistics.com/products/ignite-ui-angular/angular/components/drop_down.html" target="_blank">official documentation</a>.
-    </li>
-  </ul>
-  <p>The following sample demonstrates igx-drop-down with defined groups:</p>
-  <div class="enhanced-groups">
-    <igx-input-group>
-      <label igxLabel for="townEhanced">Town</label>
-      <input igxInput name="townEhanced" type="text" [igxAutocomplete]="townsEnhancedPanel"
-        [(ngModel)]="townSelected"/>
-    </igx-input-group>
-    <igx-drop-down #townsEnhancedPanel maxHeight="300px" (selectionChanging)="getPostalCode($event)">
-      <igx-drop-down-item-group
-	  *ngFor="let eRegion of regions | <%=camelCaseName%>RegionContains:townSelected"
-        [label]="eRegion.name">
-        <igx-drop-down-item *ngFor="let town of eRegion.towns | <%=camelCaseName%>StartsWith:townSelected"
-          [value]="town.name">
-          {{town.name}}
-        </igx-drop-down-item>
-      </igx-drop-down-item-group>
-    </igx-drop-down>
-
-    <igx-toast #message>Postal Code: {{postalCode}}"</igx-toast>
-  </div>
-</div>

package/igx-ts-legacy/autocomplete/autocomplete-extended/files/src/app/__path__/__filePrefix__.component.spec.ts

@@ -1,32 +0,0 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-import { FormsModule } from '@angular/forms';
-import { NoopAnimationsModule } from '@angular/platform-browser/animations';
-import { IgxAutocompleteModule, IgxDropDownModule, IgxInputGroupModule, IgxToastModule } from '<%=igxPackage%>';
-import {
-  <%=ClassName%>Component,
-  <%=ClassName%>PipeStartsWith,
-  <%=ClassName%>RegionContains }
-from './<%=filePrefix%>.component';
-
-describe('<%=ClassName%>Component', () => {
-  let component: <%=ClassName%>Component;
-  let fixture: ComponentFixture<<%=ClassName%>Component>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      declarations: [<%=ClassName%>Component, <%=ClassName%>PipeStartsWith, <%=ClassName%>RegionContains],
-      imports: [FormsModule, IgxDropDownModule, IgxAutocompleteModule, NoopAnimationsModule, IgxInputGroupModule, IgxToastModule]
-    })
-      .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(<%=ClassName%>Component);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/igx-ts-legacy/autocomplete/autocomplete-extended/files/src/app/__path__/__filePrefix__.component.ts

@@ -1,59 +0,0 @@
-import { Component, Pipe, PipeTransform, ViewChild } from '@angular/core';
-import { IgxToastComponent, ISelectionEventArgs, PositionSettings, HorizontalAlignment, VerticalAlignment } from '<%=igxPackage%>';
-import { Region, Town, townsExtended } from './towns-data-extended';
-
-@Component({
-  selector: 'app-<%=filePrefix%>',
-  templateUrl: './<%=filePrefix%>.component.html',
-  styleUrls: ['./<%=filePrefix%>.component.scss'],
-  standalone: false
-})
-export class <%=ClassName%>Component {
-  public regions!: Region[];
-  public townSelected!: string;
-  public postalCode?: number;
-  private messagePositionSettings: PositionSettings = {
-    horizontalDirection: HorizontalAlignment.Center,
-    verticalDirection: VerticalAlignment.Middle
-  };
-
-  @ViewChild(IgxToastComponent, { static: true })
-  public toast!: IgxToastComponent;
-
-  constructor() {
-    this.regions = townsExtended;
-  }
-
-  public getPostalCode(e: ISelectionEventArgs): void {
-
-    // Flatten the structure of the regions array
-    const allTowns = this.regions.map(region => region.towns).reduce((prev, curr) => prev.concat(curr), []);
-
-    const townEntry = allTowns.find(t => t.name === e.newSelection.value);
-
-    this.postalCode = townEntry?.postalCode;
-    this.toast.open(undefined, this.messagePositionSettings);
-  }
-}
-
-@Pipe({ name: '<%=camelCaseName%>StartsWith', standalone: false })
-export class  <%=ClassName%>PipeStartsWith implements PipeTransform {
-  public transform(collection: Town[], term = '') {
-    return collection.filter(item => item.name.toLowerCase().startsWith(term.trim().toLowerCase()));
-  }
-}
-
-@Pipe({ name: '<%=camelCaseName%>RegionContains', standalone: false })
-export class <%=ClassName%>RegionContains implements PipeTransform {
-  transform(regions: Region[], term = '') {
-    return this.filterRegions(regions, term);
-  }
-
-  private filterRegions(regions: Region[], term: string) {
-    return regions.filter(region => this.filterTowns(region.towns, term.toLowerCase()).length > 0);
-  }
-
-  private filterTowns(towns: Town[], term: string) {
-    return towns.filter(town => town.name.toLowerCase().startsWith(term));
-  }
-}