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

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

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

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

@@ -0,0 +1,27 @@
+import { Component } from '@angular/core';
+import {
+  IgxTabsComponent,
+  IgxTabItemComponent,
+  IgxTabHeaderComponent,
+  IgxIconComponent,
+  IgxTabHeaderIconDirective,
+  IgxTabHeaderLabelDirective,
+  IgxTabContentComponent,
+} from '<%=igxPackage%>';
+
+@Component({
+  selector: 'app-<%=filePrefix%>',
+  templateUrl: './<%=filePrefix%>.html',
+  styleUrl: './<%=filePrefix%>.scss',
+  imports: [
+    IgxTabsComponent,
+    IgxTabItemComponent,
+    IgxTabHeaderComponent,
+    IgxIconComponent,
+    IgxTabHeaderIconDirective,
+    IgxTabHeaderLabelDirective,
+    IgxTabContentComponent
+  ]
+})
+export class <%=ClassName%> {
+}

package/igx-ts/time-picker/default/files/src/app/__path__/__filePrefix__.spec.ts

@@ -0,0 +1,30 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { IgxTimePickerModule } from '<%=igxPackage%>';
+import { <%=ClassName%> } from './<%=filePrefix%>';
+
+describe('<%=ClassName%>', () => {
+  let component: <%=ClassName%>;
+  let fixture: ComponentFixture<<%=ClassName%>>;
+  const date: Date = new Date();
+  const hours: number = date.getHours();
+  const minutes: number = date.getMinutes();
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+	  imports: [IgxTimePickerModule, NoopAnimationsModule, <%=ClassName%>]
+    })
+      .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(<%=ClassName%>);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('time is correct', () => {
+    expect(component.date.getHours()).toBe(hours);
+    expect(component.date.getMinutes()).toBe(minutes);
+  });
+});

package/igx-ts/time-picker/default/files/src/app/__path__/__filePrefix__.ts

@@ -0,0 +1,13 @@
+import { Component, ViewEncapsulation } from '@angular/core';
+import { IgxLayoutDirective, IgxTimePickerComponent } from '<%=igxPackage%>';
+
+@Component({
+  selector: 'app-<%=filePrefix%>',
+  templateUrl: './<%=filePrefix%>.html',
+  styleUrl: './<%=filePrefix%>.scss',
+  encapsulation: ViewEncapsulation.None,
+  imports: [IgxLayoutDirective, IgxTimePickerComponent]
+})
+export class <%=ClassName%> {
+  public date: Date = new Date(Date.now());
+}

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

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

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

@@ -0,0 +1,25 @@
+import { Component } from '@angular/core';
+import { ReactiveFormsModule, FormsModule } from '@angular/forms';
+import {
+  IgxAvatarComponent,
+  IgxTooltipTargetDirective,
+  IgxTooltipDirective,
+  IgxSwitchComponent,
+} from '<%=igxPackage%>';
+
+@Component({
+  selector: 'app-<%=filePrefix%>',
+  templateUrl: './<%=filePrefix%>.html',
+  styleUrl: './<%=filePrefix%>.scss',
+  imports: [
+    IgxAvatarComponent,
+    IgxTooltipTargetDirective,
+    IgxTooltipDirective,
+    IgxSwitchComponent,
+    ReactiveFormsModule,
+    FormsModule
+  ]
+})
+
+export class <%=ClassName%> {
+}

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

@@ -0,0 +1,55 @@
+<p>igx-tree component with selection and load on demand.</p>
+<p>You can read more about configuring the igx-tree component in the
+  <a href="https://github.com/IgniteUI/igniteui-angular/blob/master/projects/igniteui-angular/src/lib/tree/README.md" target="_blank">README</a> or the
+  <a href="https://www.infragistics.com/products/ignite-ui-angular/angular/components/tree" target="_blank">official documentation</a>.
+</p>
+
+<div class="sample-wrapper">
+  <igx-tree selection="Cascading">
+    @for (root of data; track root) {
+      <igx-tree-node [expanded]="true" [data]="root">
+        <ng-template *ngTemplateOutlet="nodeTemplate; context: { $implicit: root }"></ng-template>
+        @for (folder of root.Files; track folder) {
+          <igx-tree-node #subfolder [data]="folder">
+            <ng-template *ngTemplateOutlet="nodeTemplate; context: { $implicit: folder }"></ng-template>
+            @for (file of folder.Files; track file) {
+              <igx-tree-node [data]="file">
+                <ng-template *ngTemplateOutlet="nodeTemplate; context: { $implicit: file }"></ng-template>
+              </igx-tree-node>
+            }
+          </igx-tree-node>
+        }
+      </igx-tree-node>
+    }
+    <igx-tree-node #remote [loading]="loading" [disabled]="loading" [data]="remoteRoot"
+      (expandedChange)="getNodeData(remote, $event)">
+      <div class="node">
+        <igx-icon class="tree-node-icon">{{ remoteRoot.Icon }}</igx-icon>
+        <span class="node-title">{{ remoteRoot.Name }}</span>
+        @if (showRefresh) {
+          <igx-icon class="tree-node-icon node-refresh" (click)="refreshData(remote)"
+            [showDelay]="600" [hideDelay]="100" igxTooltipTarget="tooltipRef">refresh</igx-icon>
+        }
+      </div>
+      @if (!remoteData?.length && !remote.loading) {
+        <igx-tree-node #dummyNode [data]="{}" [disabled]="true">
+        </igx-tree-node>
+      }
+      @for (entry of remoteData; track entry) {
+        <igx-tree-node [data]="entry" [selected]="!!entry.Selected"
+          (selectedChange)="handleSelection(entry, $event)">
+          <ng-template *ngTemplateOutlet="nodeTemplate; context: { $implicit: entry }"></ng-template>
+        </igx-tree-node>
+      }
+    </igx-tree-node>
+  </igx-tree>
+  <ng-template #nodeTemplate let-data>
+    <div class="node">
+      <igx-icon class="tree-node-icon">{{ data.Icon }}</igx-icon>
+      <span class="node-title">{{ data.Name }}</span>
+    </div>
+  </ng-template>
+</div>
+<div #tooltipRef="tooltip" igxTooltip>
+  Reload Remote Data
+</div>

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

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

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

@@ -0,0 +1,80 @@
+import { Component, OnDestroy } from '@angular/core';
+import { NgTemplateOutlet } 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 { Data } from './services/data';
+
+@Component({
+  selector: 'app-<%=filePrefix%>',
+  templateUrl: './<%=filePrefix%>.html',
+  styleUrl: './<%=filePrefix%>.scss',
+  providers: [Data],
+  imports: [
+    IgxTreeComponent,
+    IgxTreeNodeComponent,
+    NgTemplateOutlet,
+    IgxIconComponent,
+    IgxTooltipTargetDirective,
+    IgxTooltipDirective
+  ]
+})
+
+export class <%=ClassName%> 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: Data) {
+    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.ts

@@ -0,0 +1,51 @@
+import { Injectable } from '@angular/core';
+import { Observable, ReplaySubject } from 'rxjs';
+import { NodeData, REMOTE_DATA, SelectableNodeData } from '../local-data';
+
+@Injectable()
+export class Data {
+  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__.spec.ts

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

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

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

package/index.js

@@ -18,8 +18,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const igx_ts_1 = __importDefault(require("./igx-ts"));
-const igx_ts_legacy_1 = __importDefault(require("./igx-ts-legacy"));
 __exportStar(require("./IgniteUIForAngularTemplate"), exports);
 __exportStar(require("./AngularTypeScriptFileUpdate"), exports);
 __exportStar(require("./types"), exports);
-exports.default = [igx_ts_1.default, igx_ts_legacy_1.default];
+exports.default = [igx_ts_1.default];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@igniteui/angular-templates",
-  "version": "21.1.1491",
+  "version": "21.1.1500-rc.0",
   "description": "Templates for Ignite UI for Angular projects and components",
   "repository": {
     "type": "git",
@@ -12,7 +12,7 @@
   "author": "Infragistics",
   "license": "MIT",
   "dependencies": {
-    "@igniteui/cli-core": "~14.9.1",
+    "@igniteui/cli-core": "~15.0.0-rc.0",
     "typescript": "~5.5.4"
   }
 }

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

@@ -1,86 +0,0 @@
-<p>igx-accordion component sample.</p>
-<p>You can read more about configuring the igx-tabs component in the 
-<a href="https://github.com/IgniteUI/igniteui-angular/blob/master/projects/igniteui-angular/src/lib/accordion/README.md" target="_blank">README</a> or the 
-<a href="https://www.infragistics.com/products/ignite-ui-angular/angular/components/accordion" target="_blank">official documentation</a>.</p>
-<igx-switch [(ngModel)]="singleBranchExpand">Single Branch Expand</igx-switch>
-<article class="sample-wrapper">
-    <igx-accordion #accordion [singleBranchExpand]="singleBranchExpand">
-        <igx-expansion-panel>
-            <igx-expansion-panel-header class="expansion-header">
-                <igx-expansion-panel-title>What has changed about subscription and pricing model?
-                </igx-expansion-panel-title>
-            </igx-expansion-panel-header>
-            <igx-expansion-panel-body>
-                We have moved to a subscription-based pricing model for all our developer tools. This makes it easier
-                for you to manage your license subscriptions and allows us to provide a better level of service for you.
-
-                We updated our pricing and packages to provide you with flexible options and the best value. This
-                includes <a href="https://www.infragistics.com/products/ignite-ui">Ignite UI </a>(formerly Ignite UI for
-                JavaScript) which includes all of our JavaScript framework
-                components for web development, including: Angular, ASP.NET (Core and MVC), Blazor, JQuery, React and
-                Web Components), as well as Infragistics Professional, Infragistics Ultimate, our Ultimate UI products.
-
-                We also offer multi-year subscriptions options with a built-in discount, so you can see the value up
-                front. With these updates we are confident that we are providing the best platforms and the best price.
-            </igx-expansion-panel-body>
-        </igx-expansion-panel>
-        <igx-expansion-panel>
-            <igx-expansion-panel-header class="expansion-header">
-                <igx-expansion-panel-title>Who will the updated changes impact?</igx-expansion-panel-title>
-            </igx-expansion-panel-header>
-            <igx-expansion-panel-body>
-                The license updates will impact all new and current customers using Ignite UI, Infragistics Professional
-                and Infragistics Ultimate. Specifically, we have also made updates to our product and packaging for
-                Ignite UI for JavaScript, Ignite UI for Angular, Ignite UI for React and Ignite UI for Web components.
-                For more information, please refer to this blog:
-
-                <a
-                    href="https://www.infragistics.com/community/blogs/b/jason_beres/posts/announcement-changes-to-ignite-ui-product-packaging">Announcement:
-                    Changes to Ignite UI Product & Packaging</a>
-
-                The pricing has been updated for all products and packages. So, all new or additional licenses will be
-                sold based on our new pricing and packages. All existing license agreements will be honored and renewed
-                based upon the current agreement.
-            </igx-expansion-panel-body>
-        </igx-expansion-panel>
-        <igx-expansion-panel>
-            <igx-expansion-panel-header class="expansion-header">
-                <igx-expansion-panel-title>What is the difference between your old model and your current subscription
-                    model
-                    for Ignite UI?</igx-expansion-panel-title>
-            </igx-expansion-panel-header>
-            <igx-expansion-panel-body>
-                For Ignite UI customers, we are moving away from NPM for licensed packages. The current NPM packages
-                will be replaced with packages that include a “Trial Version” watermark. Licensed packages for Ignite UI
-                will be available from our cloud hosted ProGet server.
-
-                For more information, please refer to this article:
-
-                <a
-                    href="https://www.infragistics.com/products/ignite-ui-angular/angular/components/general/ignite-ui-licensing">Moving
-                    from Trial to Licensed Ignite UI NPM Packages</a>
-            </igx-expansion-panel-body>
-        </igx-expansion-panel>
-        <igx-expansion-panel>
-            <igx-expansion-panel-header class="expansion-header">
-                <igx-expansion-panel-title>What happens if I don’t renew my subscription?</igx-expansion-panel-title>
-            </igx-expansion-panel-header>
-            <igx-expansion-panel-body>
-                Any unlicensed or trial versions of Ignite UI for Angular, React and Web Components will now include
-                this watermark.
-            </igx-expansion-panel-body>
-        </igx-expansion-panel>
-        <igx-expansion-panel>
-            <igx-expansion-panel-header class="expansion-header">
-                <igx-expansion-panel-title>If I don’t renew my subscription will I still have access to previous
-                    versions of
-                    Infragistics products?</igx-expansion-panel-title>
-            </igx-expansion-panel-header>
-            <igx-expansion-panel-body>
-                Any version of Infragistics software which you have downloaded can continue to be used perpetually.
-                Access to download any new or previous versions through our customer portal and package feeds will
-                require maintaining an active subscription by continuing to renew it.
-            </igx-expansion-panel-body>
-        </igx-expansion-panel>
-    </igx-accordion>
-</article>

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

@@ -1,17 +0,0 @@
-$ep-sample-border: 1px solid rgba(174, 174, 174, 0.25);
-
-.sample-wrapper {
-  overflow-y: auto;
-  max-height: 450px;
-  width: 600px;
-  margin: 8px;
-}
-
-igx-expansion-panel-body,
-igx-switch {
-  padding: 16px;
-}
-
-igx-expansion-panel {
-  border: $ep-sample-border;
-}

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

@@ -1,26 +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({
-      imports: [NoopAnimationsModule, IgxAccordionModule, IgxSwitchModule, <%=ClassName%>Component]
-    })
-      .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(<%=ClassName%>Component);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

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

@@ -1,30 +0,0 @@
-import { Component } from '@angular/core';
-import { ReactiveFormsModule, FormsModule } from '@angular/forms';
-import {
-	IgxSwitchComponent,
-	IgxAccordionComponent,
-	IgxExpansionPanelComponent,
-	IgxExpansionPanelHeaderComponent,
-	IgxExpansionPanelTitleDirective,
-	IgxExpansionPanelBodyComponent,
-  } from '<%=igxPackage%>';
-
-@Component({
-  selector: 'app-<%=filePrefix%>',
-  templateUrl: './<%=filePrefix%>.component.html',
-  styleUrls: ['./<%=filePrefix%>.component.scss'],
-  standalone: true,
-  imports: [
-    IgxSwitchComponent,
-    ReactiveFormsModule,
-    FormsModule,
-    IgxAccordionComponent,
-    IgxExpansionPanelComponent,
-    IgxExpansionPanelHeaderComponent,
-    IgxExpansionPanelTitleDirective,
-    IgxExpansionPanelBodyComponent,
-  ],
-})
-export class <%=ClassName%>Component {
-  public singleBranchExpand = false;
-}

package/igx-ts/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/autocomplete/autocomplete-custom/files/src/app/__path__/__filePrefix__.component.scss

@@ -1,7 +0,0 @@
-.sample-content {
-  padding-top: 100px;
-}
-
-.input-group-form {
-  width: 300px;
-}

package/igx-ts/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({
-      imports: [FormsModule, IgxDropDownModule, IgxAutocompleteModule, NoopAnimationsModule,
-		IgxInputGroupModule, <%=ClassName%>Component, <%=ClassName%>PipeStartsWith]
-    })
-      .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(<%=ClassName%>Component);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});