igniteui-cli 13.2.1 → 13.2.2-beta.1

package/lib/templates/AngularTemplate.js

@@ -40,21 +40,42 @@ class AngularTemplate {
         // tslint:disable-next-line:variable-name
         const TsUpdate = 
         // tslint:disable-next-line:no-submodule-imports
-        require("@igniteui/cli-core/typescript").TypeScriptFileUpdate;
+        require("@igniteui/angular-templates").AngularTypeScriptFileUpdate;
+        const componentPath = path.join(projectPath, `src/app/components/${this.folderName(name)}/${this.fileName(name)}.component.ts`);
+        const className = `${cli_core_1.Util.className(cli_core_1.Util.nameFromPath(name))}Component`;
         if (!(options && options.skipRoute)) {
             //1) import the component class name,
             //2) and populate the Routes array with the path and component
             //for example: { path: "combo", component: ComboComponent }
-            const routingModule = new TsUpdate(path.join(projectPath, "src/app/app-routing.module.ts"));
-            routingModule.addRoute(path.join(projectPath, `src/app/components/${this.folderName(name)}/${this.fileName(name)}.component.ts`), this.folderName(name), //path
-            cli_core_1.Util.nameFromPath(name) //text
-            );
+            const routingModulePath = path.join(projectPath, "src/app/app-routing.module.ts");
+            const routingModule = new TsUpdate(routingModulePath, false, { singleQuotes: false });
+            routingModule.addRoute({
+                path: this.folderName(name),
+                identifierName: className,
+                modulePath: cli_core_1.Util.relativePath(routingModulePath, componentPath, true, true),
+                data: { text: cli_core_1.Util.nameFromPath(name) }
+            });
+            const content = routingModule.finalize();
+            if (content) {
+                // add to a finalize override in the NG File Update instead?
+                cli_core_1.TypeScriptUtils.saveFile(routingModulePath, content);
+            }
         }
         //3) add an import of the component class from its file location.
         //4) populate the declarations portion of the @NgModule with the component class name.
-        const mainModule = new TsUpdate(path.join(projectPath, `src/app/${modulePath}`));
-        mainModule.addDeclaration(path.join(projectPath, `src/app/components/${this.folderName(name)}/${this.fileName(name)}.component.ts`), modulePath !== "app.module.ts");
-        mainModule.finalize();
+        const mainModulePath = path.join(projectPath, `src/app/${modulePath}`);
+        const relativePath = cli_core_1.Util.relativePath(mainModulePath, componentPath, true, true);
+        const mainModule = new TsUpdate(mainModulePath, false, { singleQuotes: false });
+        mainModule.addNgModuleMeta({
+            declare: [className],
+            from: relativePath,
+            export: modulePath !== "app.module.ts" ? [className] : []
+        });
+        const content = mainModule.finalize();
+        if (content) {
+            // add to a finalize override in the NG File Update instead?
+            cli_core_1.TypeScriptUtils.saveFile(mainModulePath, content);
+        }
         this.ensureSourceFiles(projectPath);
     }
     getExtraConfiguration() {

package/lib/templates/IgniteUIForReactTemplate.d.ts

@@ -28,6 +28,7 @@ export declare class IgniteUIForReactTemplate implements Template {
     getExtraConfiguration(): ControlExtraConfiguration[];
     setExtraConfiguration(extraConfigKeys: {}): void;
     protected folderName(pathName: string): string;
+    protected fileName(pathName: string): string;
     protected registerJSONRoute(projectPath: string, name: string, routingModulePath: string): void;
     protected getViewLink(name: string): string;
     protected getToolbarLink(name: string): string;

package/lib/templates/IgniteUIForReactTemplate.js

@@ -5,6 +5,7 @@ const cli_core_1 = require("@igniteui/cli-core");
 const fs = require("fs-extra");
 const path = require("path");
 const ReactTypeScriptFileUpdate_1 = require("../../templates/react/ReactTypeScriptFileUpdate");
+const typescript_1 = require("typescript");
 class IgniteUIForReactTemplate {
     /**
      * Base ReactTemplate constructor
@@ -53,20 +54,40 @@ class IgniteUIForReactTemplate {
         const routeModulePath = options.parentRoutingModulePath;
         if (!(options && options.skipRoute)
             && cli_core_1.App.container.get(cli_core_1.FS_TOKEN).fileExists(routeModulePath)) {
-            let nameFromPath = cli_core_1.Util.nameFromPath(name);
-            let lowerDashed = cli_core_1.Util.lowerDashed(nameFromPath);
-            let filePath = path.posix.join(projectPath, options.modulePath, `${lowerDashed}.tsx`);
-            const routingModule = new ReactTypeScriptFileUpdate_1.ReactTypeScriptFileUpdate(path.join(projectPath, routeModulePath));
+            const routingModule = new ReactTypeScriptFileUpdate_1.ReactTypeScriptFileUpdate(path.join(projectPath, routeModulePath), { convertTabsToSpaces: false, indentSize: 2, singleQuotes: true }, { jsx: typescript_1.JsxEmit.Preserve });
+            const modulePath = `./${cli_core_1.Util.lowerDashed(name)}/${cli_core_1.Util.lowerDashed(name)}-routes`;
+            const child = {
+                identifierName: cli_core_1.ROUTES_VARIABLE_NAME,
+                aliasName: options.routerChildren,
+                modulePath
+            };
             if (defaultPath) {
-                routingModule.addRoute(lowerDashed, options.className, nameFromPath, filePath, options.routerChildren, undefined, defaultPath);
+                routingModule.addRoute({
+                    index: true,
+                    redirectTo: options.path,
+                });
             }
-            routingModule.addRoute(lowerDashed, options.className, nameFromPath, filePath, options.routerChildren, undefined);
+            const children = routeModulePath.includes(cli_core_1.REACT_APP_ROUTING_NAME)
+                ? child
+                : undefined;
             if (options.hasChildren) {
-                nameFromPath = cli_core_1.Util.nameFromPath(`${options.modulePath}-routes.tsx`);
-                lowerDashed = cli_core_1.Util.lowerDashed(nameFromPath);
-                filePath = path.posix.join(projectPath, options.modulePath, nameFromPath);
-                routingModule.addRoute(lowerDashed, options.className, nameFromPath, filePath, options.routerChildren, options.importAlias);
+                routingModule.addRoute({
+                    path: this.fileName(name),
+                    element: cli_core_1.Util.className(name),
+                    text: cli_core_1.Util.nameFromPath(name),
+                    children
+                });
             }
+            else {
+                routingModule.addRoute({
+                    path: this.fileName(name),
+                    element: cli_core_1.Util.className(name),
+                    text: cli_core_1.Util.nameFromPath(name)
+                }, false, // multiline
+                false // prepend
+                );
+            }
+            routingModule.finalize();
         }
     }
     getExtraConfiguration() {
@@ -90,11 +111,15 @@ class IgniteUIForReactTemplate {
                 cli_core_1.Util.error(`Path ${"src/views/" + folderName} is not valid!`, "red");
                 process.exit(1);
             }
-            //clean up potential leading spaces in folder names (`path/    name`):
+            //clean up potential leading spaces in folder names (`path/ name`):
             folderName = folderName.replace(/\/\s+/g, "/");
         }
         return cli_core_1.Util.lowerDashed(folderName);
     }
+    fileName(pathName) {
+        const name = cli_core_1.Util.nameFromPath(pathName);
+        return cli_core_1.Util.lowerDashed(name);
+    }
     registerJSONRoute(projectPath, name, routingModulePath) {
         const configFile = fs.readFileSync(path.join(projectPath, routingModulePath), "utf8");
         const viewsArr = JSON.parse(configFile);

package/lib/templates/IgniteUIForWebComponentsTemplate.js

@@ -3,7 +3,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.IgniteUIForWebComponentsTemplate = void 0;
 const cli_core_1 = require("@igniteui/cli-core");
 const path = require("path");
-const TypeScriptFileUpdate_1 = require("../../templates/webcomponents/TypeScriptFileUpdate");
+const WebComponentsTypeScriptFileUpdate_1 = require("../../templates/webcomponents/WebComponentsTypeScriptFileUpdate");
 class IgniteUIForWebComponentsTemplate {
     get templatePaths() {
         return [path.join(this.rootPath, "files")];
@@ -31,16 +31,46 @@ class IgniteUIForWebComponentsTemplate {
             return;
         }
         const routeModulePath = options.parentRoutingModulePath;
-        const routingModule = new TypeScriptFileUpdate_1.TypeScriptFileUpdate(path.join(projectPath, routeModulePath));
+        const routingModule = new WebComponentsTypeScriptFileUpdate_1.WebComponentsTypeScriptFileUpdate(path.join(projectPath, routeModulePath), { convertTabsToSpaces: false, indentSize: 2, singleQuotes: true });
         if (!(options && options.skipRoute) && cli_core_1.App.container.get(cli_core_1.FS_TOKEN)
             .fileExists(routeModulePath)) {
+            const modulePath = `./${cli_core_1.Util.lowerDashed(fullName)}/${cli_core_1.Util.lowerDashed(fullName)}-routing`;
+            const child = {
+                identifierName: cli_core_1.ROUTES_VARIABLE_NAME,
+                aliasName: options.routerChildren,
+                modulePath
+            };
+            const children = options.hasChildren ? child : undefined;
             if (defaultPath) {
-                routingModule.addRoute("", options.selector, cli_core_1.Util.nameFromPath(fullName), options.routerChildren, undefined);
+                routingModule.addRoute({
+                    path: "",
+                    redirectTo: options.selector,
+                    name: cli_core_1.Util.nameFromPath(fullName),
+                    children
+                }, false, // multiline
+                true // prepend
+                );
             }
-            routingModule.addRoute(this.fileName(fullName), options.selector, cli_core_1.Util.nameFromPath(fullName), options.routerChildren, undefined);
             if (options.hasChildren) {
-                routingModule.addRoute(this.fileName(`${options.modulePath}-routing.ts`), options.selector, cli_core_1.Util.nameFromPath(`${options.modulePath}-routing.ts`), options.routerChildren, options.importAlias);
+                routingModule.addRoute({
+                    path: this.fileName(fullName),
+                    identifierName: options.selector,
+                    name: cli_core_1.Util.nameFromPath(fullName),
+                    children
+                }, false, // multiline
+                true // prepend
+                );
             }
+            else {
+                routingModule.addRoute({
+                    path: this.fileName(fullName),
+                    identifierName: options.selector,
+                    name: cli_core_1.Util.nameFromPath(fullName)
+                }, false, // multiline
+                true // prepend
+                );
+            }
+            routingModule.finalize();
         }
     }
     getExtraConfiguration() {

package/migrations/update-5_0_0/index.js

@@ -13,6 +13,7 @@ exports.setVirtual = exports.NgTreeFileSystem = void 0;
 // tslint:disable:no-implicit-dependencies
 const core_1 = require("@angular-devkit/core");
 const cli_core_1 = require("@igniteui/cli-core");
+const angular_templates_1 = require("@igniteui/angular-templates");
 //#region Temp duplicate of schematics pack fs
 class NgTreeFileSystem {
     constructor(tree) {
@@ -51,9 +52,9 @@ function default_1() {
         context.logger.info(`Applying migration for Ignite UI CLI 5.0.0`);
         if (tree.exists(moduleFile)) {
             setVirtual(tree);
-            const mainModule = new cli_core_1.TypeScriptFileUpdate(moduleFile);
+            const mainModule = new angular_templates_1.AngularTypeScriptFileUpdate(moduleFile, false, { indentSize: 2 });
             mainModule.addNgModuleMeta({ import: "HammerModule", from: "@angular/platform-browser" });
-            mainModule.finalize();
+            cli_core_1.TypeScriptUtils.saveFile(moduleFile, mainModule.finalize());
         }
     });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "igniteui-cli",
-  "version": "13.2.1",
+  "version": "13.2.2-beta.1",
   "description": "CLI tool for creating Ignite UI projects",
   "keywords": [
     "CLI",
@@ -72,8 +72,8 @@
     "all": true
   },
   "dependencies": {
-    "@igniteui/angular-templates": "~17.2.1321",
-    "@igniteui/cli-core": "~13.2.1",
+    "@igniteui/angular-templates": "~17.2.1322-beta.1",
+    "@igniteui/cli-core": "~13.2.2-beta.1",
     "chalk": "^2.3.2",
     "fs-extra": "^3.0.1",
     "glob": "^7.1.2",

package/templates/react/ReactTypeScriptFileUpdate.d.ts

@@ -1,50 +1,11 @@
-import * as ts from "typescript";
-/**
- * Apply various updates to typescript files using AST
- */
-export declare class ReactTypeScriptFileUpdate {
-    private targetPath;
-    protected formatOptions: {
-        spaces: boolean;
-        indentSize: number;
-        singleQuotes: boolean;
-    };
-    private fileSystem;
-    private targetSource;
-    private importsMeta;
-    private requestedImports;
-    private createdStringLiterals;
-    /** Create updates for a file. Use `add<X>` methods to add transformations and `finalize` to apply and save them. */
-    constructor(targetPath: string);
-    /** Applies accumulated transforms, saves and formats the file */
-    finalize(): void;
-    addRoute(path: string, component: string, name: string, filePath: string, routerChildren: string, importAlias: string, defaultRoute?: boolean): void;
-    /** Initializes existing imports info, [re]sets import and `NgModule` edits */
-    protected initState(): void;
-    protected loadImportsMeta(): {
-        lastIndex: number;
-        modulePaths: any[];
-    };
-    protected addRouteModuleEntry(path: string, component: string, name: string, filePath: string, routerChildren: string, importAlias: string, defaultRoute?: boolean): void;
-    protected requestImport(modulePath: string, routerAlias: string, componentName: string, namedImport?: boolean): void;
-    /** Add `import` statements not previously found in the file  */
-    protected addNewFileImports(): void;
-    protected createIdentifierImport(importPath: string, as: string, component: string, namedImport: boolean): ts.ImportDeclaration;
-    /** Transformation to apply edits to existing named import declarations */
-    protected importsTransformer: ts.TransformerFactory<ts.Node>;
-    /** Format a TS source file, very TBD */
-    protected formatFile(filePath: string): void;
-    /**  Try and parse formatting from project `.editorconfig` / `tslint.json` */
-    protected readFormatConfigs(): void;
-    /**
-     * Apply formatting changes (position based) in reverse
-     * from https://github.com/Microsoft/TypeScript/issues/1651#issuecomment-69877863
-     */
-    private applyChanges;
-    /** Return source file formatting options */
-    private getFormattingOptions;
-    /** Get language service host, sloppily */
-    private getLanguageHost;
-    private createVisitor;
-    private createRouteEntry;
+import * as ts from 'typescript';
+import { FormatSettings, PropertyAssignment, TypeScriptFileUpdate } from '@igniteui/cli-core';
+import { ReactRouteLike } from './types';
+export declare class ReactTypeScriptFileUpdate extends TypeScriptFileUpdate {
+    constructor(filePath: string, formatSettings?: FormatSettings, compilerOptions?: ts.CompilerOptions);
+    addRoute(route: ReactRouteLike, multiline?: boolean, prepend?: boolean, anchorElement?: PropertyAssignment): ts.SourceFile;
+    protected addRouteEntry(route: ReactRouteLike, visitCondition: (node: ts.Node) => boolean, multiline: boolean, prepend: boolean, anchorElement: PropertyAssignment): ts.SourceFile;
+    protected addRedirectRouteEntry(route: ReactRouteLike, visitCondition: (node: ts.Node) => boolean, multiline?: boolean, prepend?: boolean, anchorElement?: PropertyAssignment): ts.SourceFile;
+    protected addChildRouteEntry(route: ReactRouteLike, asIdentifier?: boolean, multiline?: boolean, prepend?: boolean): ts.SourceFile;
+    private requestImportForRouteLoader;
 }