@resolve-components/theme 1.2.1 → 1.2.4

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@resolve-components/theme",
-  "version": "1.2.1",
+  "version": "1.2.4",
   "schematics": "./collection.json",
-  "description": "🔥 Fully customizable Angular UI components made with ❤️ using Angular CDK 🔥",
+  "description": "🔥 Fully customizable Angular UI components made with ❤️ using Angular CDK 🔥",
   "peerDependencies": {
     "@angular/common": ">=17.0.0",
     "@angular/core": ">=17.0.0",

package/schematics/ng-add/index.js

@@ -7,6 +7,16 @@ const tasks_1 = require("@angular-devkit/schematics/tasks");
 // Helpers
 // ---------------------------------------------------------------------------
 const isNxWorkspace = (tree) => tree.exists('nx.json');
+/** Returns true if a project's build target uses an Angular builder. */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+function isAngularProject(content) {
+    const buildExecutor = content?.['architect']?.['build']?.['executor'] ??
+        content?.['targets']?.['build']?.['executor'] ??
+        '';
+    return (buildExecutor.startsWith('@angular-devkit/build-angular') ||
+        buildExecutor.startsWith('@angular/build') ||
+        buildExecutor.startsWith('@nx/angular'));
+}
 /**
  * Try to resolve project config from a root angular.json / workspace.json.
  * Works for standard Angular workspaces AND Nx workspaces that still maintain
@@ -46,47 +56,116 @@ function getAngularWorkspaceProject(tree, projectName) {
         isNxProjectJson: false,
     };
 }
+/** Scan all apps/ and projects/ subdirectories and return every application project.json. */
+function discoverNxApplicationProjects(tree) {
+    const results = [];
+    for (const root of ['apps', 'projects']) {
+        const dir = tree.getDir(root);
+        for (const sub of dir.subdirs) {
+            const path = `${root}/${sub}/project.json`;
+            if (!tree.exists(path))
+                continue;
+            try {
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                const content = JSON.parse(tree.read(path).toString('utf-8'));
+                if (content['projectType'] && content['projectType'] !== 'application')
+                    continue;
+                const name = content['name'] ?? sub;
+                const defaultSourceRoot = `${root}/${sub}/src`;
+                const sourceRoot = content['sourceRoot'] ?? defaultSourceRoot;
+                results.push({ path, name, sourceRoot, content });
+            }
+            catch {
+                continue;
+            }
+        }
+    }
+    return results;
+}
 /**
  * In Nx v16+ workspaces there is no writable root angular.json.
  * Discover project.json files under apps/ or projects/.
+ * Filters to Angular projects, asks for --project when multiple match.
  */
 function getNxProjectJsonConfig(tree, projectName) {
-    const candidates = [];
+    const allApps = discoverNxApplicationProjects(tree);
+    // If a project name was explicitly given, find it (any executor — user knows best)
     if (projectName) {
-        candidates.push(`apps/${projectName}/project.json`, `libs/${projectName}/project.json`, `${projectName}/project.json`);
-    }
-    // Auto-discover under apps/ and projects/
-    for (const root of ['apps', 'projects']) {
-        const dir = tree.getDir(root);
-        for (const sub of dir.subdirs) {
-            const p = `${root}/${sub}/project.json`;
-            if (!candidates.includes(p))
-                candidates.push(p);
+        // Try exact path candidates first
+        for (const root of ['apps', 'projects']) {
+            const path = `${root}/${projectName}/project.json`;
+            if (tree.exists(path)) {
+                try {
+                    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    const content = JSON.parse(tree.read(path).toString('utf-8'));
+                    const name = content['name'] ?? projectName;
+                    const sourceRoot = content['sourceRoot'] ?? `${root}/${projectName}/src`;
+                    return {
+                        file: path,
+                        projectName: name,
+                        content,
+                        sourceRoot,
+                        isNxProjectJson: true,
+                    };
+                }
+                catch {
+                    /* skip */
+                }
+            }
         }
-    }
-    for (const path of candidates) {
-        if (!tree.exists(path))
-            continue;
-        try {
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            const content = JSON.parse(tree.read(path).toString('utf-8'));
-            // Skip non-application projects (libraries, e2e, etc.)
-            if (content['projectType'] && content['projectType'] !== 'application')
-                continue;
-            const projName = content['name'] ?? path.split('/')[1];
-            const defaultSourceRoot = path.split('/').slice(0, -1).join('/') + '/src';
-            const sourceRoot = content['sourceRoot'] ?? defaultSourceRoot;
+        // Also search by name in discovered list
+        const byName = allApps.find((p) => p.name === projectName || p.path.includes(`/${projectName}/`));
+        if (byName) {
             return {
-                file: path,
-                projectName: projName,
-                content,
-                sourceRoot,
+                file: byName.path,
+                projectName: byName.name,
+                content: byName.content,
+                sourceRoot: byName.sourceRoot,
                 isNxProjectJson: true,
             };
         }
-        catch {
-            continue;
-        }
+        // Not found — throw with available list
+        const available = allApps.map((p) => `  • ${p.name}`).join('\n');
+        throw new schematics_1.SchematicsException(`Project "${projectName}" not found.\n` +
+            `Available application projects:\n${available || '  (none found)'}\n\n` +
+            `Re-run with: ng add @resolve-components/theme --project=<name>`);
+    }
+    // No project specified — filter to Angular projects only
+    const angularApps = allApps.filter((p) => isAngularProject(p.content));
+    if (angularApps.length === 1) {
+        // Exactly one Angular app → auto-pick
+        const found = angularApps[0];
+        return {
+            file: found.path,
+            projectName: found.name,
+            content: found.content,
+            sourceRoot: found.sourceRoot,
+            isNxProjectJson: true,
+        };
+    }
+    if (angularApps.length > 1) {
+        // Multiple Angular apps — cannot guess, ask user to specify
+        const list = angularApps.map((p) => `  • ${p.name}`).join('\n');
+        throw new schematics_1.SchematicsException(`Multiple Angular applications found. Please specify which one to configure:\n\n` +
+            `${list}\n\n` +
+            `Re-run with: ng add @resolve-components/theme --project=<name>`);
+    }
+    // No Angular apps found — fall back to any application project
+    if (allApps.length === 1) {
+        const found = allApps[0];
+        return {
+            file: found.path,
+            projectName: found.name,
+            content: found.content,
+            sourceRoot: found.sourceRoot,
+            isNxProjectJson: true,
+        };
+    }
+    if (allApps.length > 1) {
+        const list = allApps.map((p) => `  • ${p.name}`).join('\n');
+        throw new schematics_1.SchematicsException(`Could not auto-detect an Angular project. Found these application projects:\n\n` +
+            `${list}\n\n` +
+            `Re-run with: ng add @resolve-components/theme --project=<name>`);
     }
     return null;
 }
@@ -207,6 +286,67 @@ function addGlobalStyles(options) {
     };
 }
 // ---------------------------------------------------------------------------
+// Rule: wrap app.html with <rc-layout>
+// ---------------------------------------------------------------------------
+function addRcLayoutToTemplate(options) {
+    return (tree, ctx) => {
+        const cfg = resolveProjectConfig(tree, options);
+        const sourceRoot = cfg?.sourceRoot ?? 'src';
+        const templatePath = `${sourceRoot}/app/app.html`;
+        if (!tree.exists(templatePath)) {
+            ctx.logger.warn(`⚠  ${templatePath} not found — wrap your root template with <rc-layout> manually.`);
+            return tree;
+        }
+        const content = tree.read(templatePath).toString('utf-8');
+        if (content.includes('<rc-layout'))
+            return tree;
+        const wrapped = `<rc-layout>\n${content.trimEnd()}\n</rc-layout>\n`;
+        tree.overwrite(templatePath, wrapped);
+        ctx.logger.info(`  Wrapped ${templatePath} with <rc-layout>`);
+        return tree;
+    };
+}
+// ---------------------------------------------------------------------------
+// Rule: add RcLayout to app.ts imports
+// ---------------------------------------------------------------------------
+function addRcLayoutToAppComponent(options) {
+    return (tree, ctx) => {
+        const cfg = resolveProjectConfig(tree, options);
+        const sourceRoot = cfg?.sourceRoot ?? 'src';
+        // Support both app.ts and app.component.ts
+        const appTsPath = tree.exists(`${sourceRoot}/app/app.ts`)
+            ? `${sourceRoot}/app/app.ts`
+            : tree.exists(`${sourceRoot}/app/app.component.ts`)
+                ? `${sourceRoot}/app/app.component.ts`
+                : null;
+        if (!appTsPath) {
+            ctx.logger.warn(`⚠  app.ts / app.component.ts not found — add RcLayout to your root component imports manually.`);
+            return tree;
+        }
+        let content = tree.read(appTsPath).toString('utf-8');
+        if (content.includes('RcLayout'))
+            return tree;
+        // Add import statement after last existing import
+        const importLine = `import { RcLayout } from '@resolve-components/theme';\n`;
+        const lastImportMatch = [...content.matchAll(/^import .*?;\n/gms)]
+            .filter((m) => !m[0].includes('\n  '))
+            .pop();
+        if (lastImportMatch) {
+            const insertAt = lastImportMatch.index + lastImportMatch[0].length;
+            content =
+                content.slice(0, insertAt) + importLine + content.slice(insertAt);
+        }
+        else {
+            content = importLine + content;
+        }
+        // Add RcLayout to the component's imports array
+        content = content.replace(/(imports:\s*\[)/, `$1RcLayout, `);
+        tree.overwrite(appTsPath, content);
+        ctx.logger.info(`  Added RcLayout import → ${appTsPath}`);
+        return tree;
+    };
+}
+// ---------------------------------------------------------------------------
 // Exported schematic factory
 // ---------------------------------------------------------------------------
 function ngAdd(options) {
@@ -217,6 +357,8 @@ function ngAdd(options) {
             addBuildConfig(options),
             addProviderToConfig(options),
             addGlobalStyles(options),
+            addRcLayoutToTemplate(options),
+            addRcLayoutToAppComponent(options),
             (_tree, ctx) => {
                 ctx.addTask(new tasks_1.NodePackageInstallTask());
                 ctx.logger.info('\n✅ @resolve-components/theme setup complete!');