@craft-ng/dev-tools 0.1.0 → 0.1.2

package/README.md

@@ -10,315 +10,67 @@ Development tools for ng-craft: ESLint configs, ESLint rules, and codemods.
 npm install -D @craft-ng/dev-tools
 ```
 
-### Publication sur npm
-
-Pour publier le package sur npm (mainteneurs uniquement) :
-
-#### 1. Se connecter à npm
-
-```bash
-npm login
-```
-
-Vous aurez besoin d'un compte npm avec les droits de publication sur le scope `@craft-ng`.
-
-#### 2. Builder le package
-
-```bash
-npx nx build dev-tools
-```
-
-#### 3. Mettre à jour la version
-
-Modifiez la version dans `libs/dev-tools/package.json` selon [semver](https://semver.org/) :
-
-- **Patch** (0.1.0 → 0.1.1) : Corrections de bugs
-- **Minor** (0.1.0 → 0.2.0) : Nouvelles fonctionnalités rétrocompatibles
-- **Major** (0.1.0 → 1.0.0) : Changements non rétrocompatibles
-
-#### 4. Publier
-
-Depuis le répertoire de build :
-
 ```bash
-cd dist/libs/dev-tools
-npm publish --access public
-```
-
-> **Note** : L'option `--access public` est nécessaire pour les packages scoped (`@craft-ng/...`) si vous souhaitez les rendre publics.
-
-#### 5. Créer un tag Git (recommandé)
-
-Retournez à la racine et créez un tag :
-
-```bash
-cd ../../..
-git tag dev-tools-v0.1.0
-git push origin dev-tools-v0.1.0
-```
-
-### En développement local (avant publication)
-
-Pour tester ce package dans un autre projet avant de le publier sur npm :
-
-#### 1. Builder le package
-
-Depuis la racine du monorepo ng-craft :
-
-```bash
-npx nx build dev-tools
-```
-
-Cela génère les fichiers compilés dans `dist/libs/dev-tools/`.
-
-#### 2. Créer un lien npm local
-
-Depuis la racine du monorepo :
-
-```bash
-cd dist/libs/dev-tools
-npm link
-```
-
-#### 3. Utiliser le lien dans votre autre projet
-
-Dans votre projet Angular externe :
-
-```bash
-cd /chemin/vers/votre-projet
-npm link @craft-ng/dev-tools
-```
-
-> **Note** : Après chaque modification du code de `@craft-ng/dev-tools`, vous devez rebuilder avec `npx nx build dev-tools` pour que les changements soient pris en compte dans les projets liés.
-
-#### 4. Supprimer le lien (quand terminé)
-
-Dans votre projet externe :
-
-```bash
-npm unlink @craft-ng/dev-tools
-npm install
-```
-
-## Configuration complète dans un nouveau projet
-
-Voici un exemple de configuration complète pour utiliser tous les outils dans un projet Angular :
-
-### 1. Installer les dépendances
-
-```bash
-npm install -D @craft-ng/dev-tools @craft-ng/core
-npm install -D @angular-eslint/eslint-plugin @typescript-eslint/eslint-plugin eslint
-```
-
-### 2. Configurer ESLint
-
-Créez ou modifiez `eslint.config.mjs` :
-
-```javascript
-import craftAngular from '@craft-ng/dev-tools/eslint/angular';
 import craftRules from '@craft-ng/dev-tools/eslint-rules';
 
 export default [
   {
-    ignores: ['dist/**', 'node_modules/**'],
-  },
-  ...craftAngular,
-  {
-    files: ['**/*.ts'],
     plugins: {
-      '@craft-ng': craftRules,
+      'craft-ng': craftRules
     },
     rules: {
-      // Règles craft-ng recommandées
-      '@craft-ng/brand-angular-deps-match': 'error',
-      '@craft-ng/no-angular-inject': 'error',
-      '@craft-ng/no-direct-angular-class-export': 'error',
-    },
-  },
+      'craft-ng/brand-angular-deps-match': 'error',
+      'craft-ng/no-angular-inject': 'error',
+      'craft-ng/no-direct-angular-class-export': 'error',
+    }
+  }
 ];
 ```
 
-### 3. Transformer votre code existant
-
 ```bash
-# Prévisualiser les changements (dry-run)
-npx craft-brand --root ./src --dry-run
-
-# Appliquer les transformations
-npx craft-brand --root ./src
-```
-
-### 4. Ajouter des scripts npm
-
-Dans votre `package.json` :
-
-```json
-{
-  "scripts": {
-    "lint": "eslint .",
-    "lint:fix": "eslint . --fix",
-    "codemod:preview": "craft-brand --dry-run",
-    "codemod:apply": "craft-brand"
-  }
-}
-```
-
-## Features
-
-### 1. ESLint Configurations
-
-Pre-configured ESLint settings for ng-craft projects.
-
-#### Basic TypeScript Config
-
-```javascript
-// eslint.config.mjs
-import craftEslint from '@craft-ng/dev-tools/eslint';
-
-export default [...craftEslint];
-```
+const craftRules = require('@craft-ng/dev-tools/eslint-rules');
 
-#### Angular Config
-
-```javascript
-// eslint.config.mjs
-import craftAngular from '@craft-ng/dev-tools/eslint/angular';
-
-export default [...craftAngular];
-```
-
-### 2. ESLint Rules
-
-Custom ESLint rules for enforcing ng-craft patterns.
-
-#### Available Rules
-
-- **`brand-angular-deps-match`** - Ensures `deps({ injected, importDeps, providers })` matches the Angular symbol dependencies
-- **`no-angular-inject`** - Disallows Angular `inject()`, `@Injectable`, and `@Service` usage
-- **`no-direct-angular-class-export`** - Disallows direct exports of Angular symbols managed through `brandAngularSymbol`
-
-#### Usage
-
-```javascript
-// eslint.config.mjs
-import craftAngular from '@craft-ng/dev-tools/eslint/angular';
-import craftRules from '@craft-ng/dev-tools/eslint-rules';
-
-export default [
-  ...craftAngular,
+module.exports = defineConfig([
   {
+    files: ['**/*.ts'],
+    extends: [
+      eslint.configs.recommended,
+      tseslint.configs.recommended,
+      tseslint.configs.stylistic,
+      angular.configs.tsRecommended,
+    ],
+    processor: angular.processInlineTemplates,
     plugins: {
-      '@craft-ng': craftRules,
+      'craft-ng': craftRules,
     },
     rules: {
-      '@craft-ng/brand-angular-deps-match': 'error',
-      '@craft-ng/no-angular-inject': 'error',
-      '@craft-ng/no-direct-angular-class-export': 'error',
+      '@angular-eslint/directive-selector': [
+        'error',
+        {
+          type: 'attribute',
+          prefix: 'app',
+          style: 'camelCase',
+        },
+      ],
+      '@angular-eslint/component-selector': [
+        'error',
+        {
+          type: 'element',
+          prefix: 'app',
+          style: 'kebab-case',
+        },
+      ],
+      '@typescript-eslint/consistent-type-definitions': 'off',
+      // Ajoutez vos règles craft-ng ici
+      'craft-ng/brand-angular-deps-match': 'error',
+      'craft-ng/no-angular-inject': 'error',
+      'craft-ng/no-direct-angular-class-export': 'error',
     },
   },
-];
-```
-
-### 3. Codemod: `craft-brand`
-
-Automatically transforms Angular components, directives, pipes, and injectables to use `brandAngularSymbol` and `deps()`.
-
-#### CLI Usage
-
-```bash
-# Transform all TypeScript files in the current directory
-npx craft-brand
-
-# Transform with specific root directory
-npx craft-brand --root ./src
-
-# Dry run (preview changes without writing)
-npx craft-brand --dry-run
-
-# Only transform standalone components/directives
-npx craft-brand --transform-only-standalone-declarables
-
-# Custom helper import path
-npx craft-brand --helper-import @my-lib/core
-
-# Use specific tsconfig
-npx craft-brand --tsconfig ./tsconfig.app.json
-```
-
-#### Programmatic Usage
-
-```typescript
-import { runAngularBrandCodemod } from '@craft-ng/dev-tools';
-
-await runAngularBrandCodemod({
-  rootDir: './src',
-  dryRun: true,
-  transformOnlyStandaloneDeclarables: false,
-  includeProviders: true,
-  includeViewProviders: true,
-  helperImportPath: '@craft-ng/core',
-  log: console.log,
-});
-```
-
-#### What it does
-
-Transforms this:
-
-```typescript
-import { Component, inject } from '@angular/core';
-
-@Component({
-  standalone: true,
-  imports: [CommonModule],
-  providers: [MyService],
-})
-export class DemoComponent {
-  private api = inject(ApiService);
-  constructor(private http: HttpClient) {}
-}
-```
-
-Into this:
-
-```typescript
-import { Component, inject } from '@angular/core';
-import { brandAngularSymbol, deps } from '@craft-ng/core';
-
-@Component({
-  standalone: true,
-  imports: [CommonModule],
-  providers: [MyService],
-})
-class DemoComponent {
-  private api = inject(ApiService);
-  constructor(private http: HttpClient) {}
-}
-
-export default brandAngularSymbol(
-  DemoComponent,
-  deps({
-    injected: [HttpClient, ApiService],
-    importDeps: [CommonModule],
-    providers: [MyService],
-  }),
-);
+  {
+    files: ['**/*.html'],
+    extends: [angular.configs.templateRecommended, angular.configs.templateAccessibility],
+    rules: {},
+  },
+]);
 ```
-
-#### CLI Options
-
-| Option                                    | Description                                        | Default                |
-| ----------------------------------------- | -------------------------------------------------- | ---------------------- |
-| `--root <dir>`                            | Project root directory                             | `cwd`                  |
-| `--tsconfig <path>`                       | Path to tsconfig.json                              | `<root>/tsconfig.json` |
-| `--helper-import <path>`                  | Import path for `brandAngularSymbol` and `deps`    | `@craft-ng/core`       |
-| `--transform-only-standalone-declarables` | Only transform standalone components/directives    | `false`                |
-| `--no-providers`                          | Do not include metadata providers in `deps()`      | `false`                |
-| `--no-view-providers`                     | Do not include component viewProviders in `deps()` | `false`                |
-| `--dry-run`                               | Print results without writing files                | `false`                |
-| `--help`                                  | Show help                                          | -                      |
-
-## License
-
-MIT

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@craft-ng/dev-tools",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "Development tools for ng-craft: ESLint configs, ESLint rules, and codemods",
   "type": "module",
   "main": "./src/index.js",
@@ -10,9 +10,10 @@
       "types": "./src/index.d.ts",
       "default": "./src/index.js"
     },
-    "./eslint": "./src/eslint/index.mjs",
-    "./eslint/angular": "./src/eslint/angular.mjs",
-    "./eslint-rules": "./src/eslint-rules/index.cjs",
+    "./eslint-rules": {
+      "types": "./src/eslint-rules/index.d.cts",
+      "default": "./src/eslint-rules/index.cjs"
+    },
     "./package.json": "./package.json"
   },
   "bin": {

package/src/eslint-rules/brand-angular-deps-match.cjs

@@ -1,11 +1,14 @@
 const fs = require('node:fs');
 const path = require('node:path');
 
+process.env.TS_NODE_PROJECT ??= path.resolve(__dirname, '../tsconfig.codemod.json');
+require('ts-node/register/transpile-only');
+
 const { Project } = require('ts-morph');
 const {
   analyzeSourceFileDependencies,
   readExistingDependencyGroups,
-} = require('../scripts/angular-brand-codemod.js');
+} = require('../angular-brand-codemod.ts');
 
 const projectCache = new Map();
 
@@ -32,24 +35,13 @@ module.exports = {
           return;
         }
 
-        const sourceFile = getProjectSourceFile(
-          getProject(getCwd(context)),
-          filePath,
-          text,
-        );
+        const sourceFile = getProjectSourceFile(getProject(getCwd(context)), filePath, text);
         const analysis = analyzeSourceFileDependencies(sourceFile);
-        if (
-          !analysis.classDeclaration ||
-          analysis.skipped ||
-          !analysis.className
-        ) {
+        if (!analysis.classDeclaration || analysis.skipped || !analysis.className) {
           return;
         }
 
-        const existing = readExistingDependencyGroups(
-          sourceFile,
-          analysis.className,
-        );
+        const existing = readExistingDependencyGroups(sourceFile, analysis.className);
         if (!existing.found) {
           return;
         }
@@ -145,14 +137,7 @@ function getCwd(context) {
   return context.cwd ?? process.cwd();
 }
 
-function reportIfMismatch(
-  context,
-  sourceCode,
-  existing,
-  propertyName,
-  expected,
-  actual,
-) {
+function reportIfMismatch(context, sourceCode, existing, propertyName, expected, actual) {
   if (isSameDependencyList(expected, actual)) {
     return;
   }
@@ -160,9 +145,7 @@ function reportIfMismatch(
   reportNode(
     context,
     sourceCode,
-    existing.propertyNodes[propertyName] ??
-      existing.depsObjectNode ??
-      existing.exportAssignmentNode,
+    existing.propertyNodes[propertyName] ?? existing.depsObjectNode ?? existing.exportAssignmentNode,
     `deps.${propertyName} does not match the Angular symbol. Expected ${formatDependencyList(expected)} but found ${formatDependencyList(actual)}.`,
   );
 }
@@ -182,10 +165,7 @@ function getNodeLoc(sourceCode, node) {
 }
 
 function isSameDependencyList(left, right) {
-  return (
-    left.length === right.length &&
-    left.every((value, index) => value === right[index])
-  );
+  return left.length === right.length && left.every((value, index) => value === right[index]);
 }
 
 function formatDependencyList(dependencies) {

package/src/eslint-rules/index.cjs

@@ -1,4 +1,3 @@
-// ESLint rules for ng-craft
 const brandAngularDepsMatch = require('./brand-angular-deps-match.cjs');
 const noAngularInject = require('./no-angular-inject.cjs');
 const noDirectAngularClassExport = require('./no-direct-angular-class-export.cjs');

package/src/eslint-rules/index.d.cts

@@ -0,0 +1,5 @@
+import type { ESLint, Linter } from 'eslint';
+
+declare const plugin: ESLint.Plugin;
+
+export = plugin;

package/src/eslint-rules/no-angular-inject.cjs

@@ -131,8 +131,7 @@ function getAngularBlockedDecoratorName(
     expression.object.type === 'Identifier' &&
     angularNamespaceImports.has(expression.object.name) &&
     expression.property.type === 'Identifier' &&
-    (expression.property.name === 'Injectable' ||
-      expression.property.name === 'Service')
+    (expression.property.name === 'Injectable' || expression.property.name === 'Service')
   ) {
     return expression.property.name;
   }

package/src/eslint-rules/no-direct-angular-class-export.cjs

@@ -1,8 +1,11 @@
 const fs = require('node:fs');
 const path = require('node:path');
 
+process.env.TS_NODE_PROJECT ??= path.resolve(__dirname, '../tsconfig.codemod.json');
+require('ts-node/register/transpile-only');
+
 const { Project, Node, SyntaxKind } = require('ts-morph');
-const { getAngularKind } = require('../scripts/angular-brand-codemod.js');
+const { getAngularKind } = require('../angular-brand-codemod.ts');
 
 const projectCache = new Map();
 
@@ -29,11 +32,7 @@ module.exports = {
           return;
         }
 
-        const sourceFile = getProjectSourceFile(
-          getProject(getCwd(context)),
-          filePath,
-          text,
-        );
+        const sourceFile = getProjectSourceFile(getProject(getCwd(context)), filePath, text);
         const angularClasses = sourceFile
           .getClasses()
           .map((classDeclaration) => ({
@@ -43,12 +42,7 @@ module.exports = {
           .filter((entry) => Boolean(entry.angularKind));
 
         for (const { classDeclaration, angularKind } of angularClasses) {
-          reportDirectClassExport(
-            context,
-            sourceCode,
-            classDeclaration,
-            angularKind,
-          );
+          reportDirectClassExport(context, sourceCode, classDeclaration, angularKind);
           reportIdentifierExportAssignment(
             context,
             sourceCode,
@@ -56,13 +50,7 @@ module.exports = {
             classDeclaration,
             angularKind,
           );
-          reportNamedExports(
-            context,
-            sourceCode,
-            sourceFile,
-            classDeclaration,
-            angularKind,
-          );
+          reportNamedExports(context, sourceCode, sourceFile, classDeclaration, angularKind);
         }
       },
     };
@@ -119,12 +107,7 @@ function getCwd(context) {
   return context.cwd ?? process.cwd();
 }
 
-function reportDirectClassExport(
-  context,
-  sourceCode,
-  classDeclaration,
-  angularKind,
-) {
+function reportDirectClassExport(context, sourceCode, classDeclaration, angularKind) {
   const hasDirectExportModifier = classDeclaration
     .getModifiers()
     .some(
@@ -176,13 +159,7 @@ function reportIdentifierExportAssignment(
   }
 }
 
-function reportNamedExports(
-  context,
-  sourceCode,
-  sourceFile,
-  classDeclaration,
-  angularKind,
-) {
+function reportNamedExports(context, sourceCode, sourceFile, classDeclaration, angularKind) {
   const className = classDeclaration.getName();
   if (!className) {
     return;

package/src/eslint/angular.mjs

@@ -1,26 +0,0 @@
-import baseConfig from './index.mjs';
-
-export default [
-  ...baseConfig,
-  {
-    files: ['**/*.ts'],
-    rules: {
-      '@angular-eslint/directive-selector': [
-        'error',
-        {
-          type: 'attribute',
-          prefix: 'app',
-          style: 'camelCase',
-        },
-      ],
-      '@angular-eslint/component-selector': [
-        'error',
-        {
-          type: 'element',
-          prefix: 'app',
-          style: 'kebab-case',
-        },
-      ],
-    },
-  },
-];

package/src/eslint/index.mjs

@@ -1,18 +0,0 @@
-export default [
-  {
-    files: ['**/*.ts'],
-    rules: {
-      '@typescript-eslint/no-unused-vars': [
-        'warn',
-        {
-          argsIgnorePattern: '^_',
-          varsIgnorePattern: '^_',
-          caughtErrorsIgnorePattern: '^_',
-        },
-      ],
-      'no-empty-object-type': 'off',
-      '@typescript-eslint/no-empty-object-type': 'off',
-      '@typescript-eslint/no-unsafe-function-type': 'off',
-    },
-  },
-];