build: migrate avatar, accordion and label to secondary entrypoints (#…

…514)

* build: migrate avatar, accordion and label to secondary entrypoints

* build: fix storybook build

* build: adding prettier json plugin

* build: remove merge conflicts

* build: correcting prettier plugin order

* build: correcting prettier plugin order

.prettierrc.mjs

@@ -4,5 +4,5 @@ export default {
 	useTabs: true,
 	bracketSpacing: true,
 	htmlWhitespaceSensitivity: 'ignore',
-	plugins: ['prettier-plugin-organize-imports', 'prettier-plugin-tailwindcss'],
+	plugins: ['prettier-plugin-organize-imports', 'prettier-plugin-packagejson', 'prettier-plugin-tailwindcss'],
 };

CONTRIBUTING.md

@@ -75,7 +75,7 @@ nx g @spartan-ng/tools:brain-secondary-entrypoint --name=feature-name
 If you are migrating an existing feature to a Brain feature, you can use something like the following command:
 
 ```shell
-nx g @spartan-ng/tools:brain-secondary-entrypoint --name=checkbox --project=ui-checkbox-helm
+nx g @spartan-ng/tools:brain-secondary-entrypoint --name=checkbox --project=ui-checkbox-brain
 ```
 
 ## Submitting pull requests

libs/brain/accordion/README.md

@@ -0,0 +1,3 @@
+# @spartan-ng/brain/accordion
+
+Secondary entry point of `@spartan-ng/brain`. It can be used by importing from `@spartan-ng/brain/accordion`.

libs/brain/accordion/ng-package.json

@@ -0,0 +1,5 @@
+{
+	"lib": {
+		"entryFile": "src/index.ts"
+	}
+}

libs/brain/avatar/README.md

@@ -0,0 +1,3 @@
+# @spartan-ng/brain/avatar
+
+Secondary entry point of `@spartan-ng/brain`. It can be used by importing from `@spartan-ng/brain/avatar`.

libs/brain/avatar/ng-package.json

@@ -0,0 +1,5 @@
+{
+	"lib": {
+		"entryFile": "src/index.ts"
+	}
+}

libs/ui/avatar/brain/src/lib/util/hex-color-for.ts → libs/brain/avatar/src/lib/util/hex-color-for.ts

@@ -5,7 +5,7 @@ function hashString(str: string) {
 	return h || 0;
 }
 
-function hashManyTimes(times: any, str: string) {
+function hashManyTimes(times: number, str: string) {
 	let h = hashString(str);
 
 	for (let i = 0; i < times; i++) h = hashString(String(h));

libs/brain/label/README.md

@@ -0,0 +1,3 @@
+# @spartan-ng/brain/label
+
+Secondary entry point of `@spartan-ng/brain`. It can be used by importing from `@spartan-ng/brain/label`.

libs/brain/label/ng-package.json

@@ -0,0 +1,5 @@
+{
+	"lib": {
+		"entryFile": "src/index.ts"
+	}
+}

libs/brain/package.json

@@ -1,12 +1,15 @@
 {
 	"name": "@spartan-ng/brain",
 	"version": "0.0.1-alpha.357",
+	"sideEffects": false,
 	"peerDependencies": {
+		"@angular/cdk": ">=18.0.0",
 		"@angular/common": ">=18.0.0",
 		"@angular/core": ">=18.0.0",
-		"@angular/cdk": ">=18.0.0",
 		"@angular/forms": ">=18.0.0",
-		"@spartan-ng/ui-forms-brain": "0.0.1-alpha.357"
-	},
-	"sideEffects": false
+		"@spartan-ng/ui-core": "0.0.1-alpha.357",
+		"@spartan-ng/ui-forms-brain": "0.0.1-alpha.357",
+		"clsx": ">=2.0.0",
+		"rxjs": ">=6.6.0"
+	}
 }

libs/cli/package.json

@@ -3,21 +3,21 @@
 	"version": "0.0.1-alpha.367",
 	"type": "commonjs",
 	"dependencies": {
+		"@nx/angular": ">=20.0.0",
 		"@nx/devkit": ">=20.0.0",
 		"@nx/js": ">=20.0.0",
-		"@nx/angular": ">=20.0.0",
 		"enquirer": "2.3.6",
-		"semver": "7.5.4",
 		"jsonc-eslint-parser": "^2.1.0",
-		"nx": ">=20.0.0"
+		"nx": ">=20.0.0",
+		"semver": "7.5.4"
 	},
 	"peerDependencies": {
 		"tslib": "^2.3.0"
 	},
-	"executors": "./executors.json",
-	"generators": "./generators.json",
-	"schematics": "./generators.json",
 	"publishConfig": {
 		"access": "public"
-	}
+	},
+	"executors": "./executors.json",
+	"generators": "./generators.json",
+	"schematics": "./generators.json"
 }

libs/cli/src/generators/migrate-brain-imports/generator.ts

@@ -100,7 +100,7 @@ function replaceUsages(tree: Tree, oldPackageName: string, newPackageName: strin
 			// this is relevant for this repo only - and this file is auto-generated
 			'supported-ui-libraries.json',
 			// we don't want to replace usages in the import map as these are used to detect the usages
-			'import-map.json',
+			'import-map.ts',
 		];
 		if (ignoredFiles.includes(basename(path))) {
 			return;

libs/cli/src/generators/migrate-brain-imports/import-map.ts

@@ -1,3 +1,6 @@
 export default {
 	'@spartan-ng/ui-checkbox-brain': '@spartan-ng/brain/checkbox',
+	'@spartan-ng/ui-avatar-brain': '@spartan-ng/brain/avatar',
+	'@spartan-ng/ui-accordion-brain': '@spartan-ng/brain/accordion',
+	'@spartan-ng/ui-label-brain': '@spartan-ng/brain/label',
 };

libs/cli/src/generators/ui/libs/ui-accordion-helm/files/lib/hlm-accordion-content.component.ts.template

@@ -1,5 +1,5 @@
 import { ChangeDetectionStrategy, Component, ViewEncapsulation, computed, effect, input } from '@angular/core';
-import { BrnAccordionContentComponent } from '@spartan-ng/ui-accordion-brain';
+import { BrnAccordionContentComponent } from '@spartan-ng/brain/accordion';
 import { hlm } from '@spartan-ng/ui-core';
 import type { ClassValue } from 'clsx';
 

libs/cli/src/generators/ui/libs/ui-accordion-helm/files/lib/hlm-accordion-item.directive.ts.template

@@ -1,5 +1,5 @@
 import { Directive, computed, input } from '@angular/core';
-import { BrnAccordionItemDirective } from '@spartan-ng/ui-accordion-brain';
+import { BrnAccordionItemDirective } from '@spartan-ng/brain/accordion';
 import { hlm } from '@spartan-ng/ui-core';
 import type { ClassValue } from 'clsx';
 

libs/cli/src/generators/ui/libs/ui-accordion-helm/files/lib/hlm-accordion-trigger.directive.ts.template

@@ -1,5 +1,5 @@
 import { Directive, computed, input } from '@angular/core';
-import { BrnAccordionTriggerDirective } from '@spartan-ng/ui-accordion-brain';
+import { BrnAccordionTriggerDirective } from '@spartan-ng/brain/accordion';
 import { hlm } from '@spartan-ng/ui-core';
 import type { ClassValue } from 'clsx';
 

libs/cli/src/generators/ui/libs/ui-accordion-helm/files/lib/hlm-accordion.directive.ts.template

@@ -1,5 +1,5 @@
 import { Directive, computed, inject, input } from '@angular/core';
-import { BrnAccordionDirective } from '@spartan-ng/ui-accordion-brain';
+import { BrnAccordionDirective } from '@spartan-ng/brain/accordion';
 import { hlm } from '@spartan-ng/ui-core';
 import type { ClassValue } from 'clsx';
 

libs/cli/src/generators/ui/libs/ui-avatar-helm/files/lib/fallback/hlm-avatar-fallback.directive.spec.ts.template

@@ -1,6 +1,6 @@
 import { Component, PLATFORM_ID } from '@angular/core';
 import { type ComponentFixture, TestBed, fakeAsync } from '@angular/core/testing';
-import { hexColorFor, isBright } from '@spartan-ng/ui-avatar-brain';
+import { hexColorFor, isBright } from '@spartan-ng/brain/avatar';
 import { HlmAvatarFallbackDirective } from './hlm-avatar-fallback.directive';
 
 @Component({

libs/cli/src/generators/ui/libs/ui-avatar-helm/files/lib/fallback/hlm-avatar-fallback.directive.ts.template

@@ -1,5 +1,5 @@
 import { Directive, computed, inject } from '@angular/core';
-import { BrnAvatarFallbackDirective, hexColorFor, isBright } from '@spartan-ng/ui-avatar-brain';
+import { BrnAvatarFallbackDirective, hexColorFor, isBright } from '@spartan-ng/brain/avatar';
 import { hlm } from '@spartan-ng/ui-core';
 
 @Directive({

libs/cli/src/generators/ui/libs/ui-avatar-helm/files/lib/hlm-avatar.component.spec.ts.template

@@ -1,6 +1,6 @@
 import { Component, Input } from '@angular/core';
 import { type ComponentFixture, TestBed } from '@angular/core/testing';
-import { BrnAvatarFallbackDirective, BrnAvatarImageDirective } from '@spartan-ng/ui-avatar-brain';
+import { BrnAvatarFallbackDirective, BrnAvatarImageDirective } from '@spartan-ng/brain/avatar';
 import { HlmAvatarComponent } from './hlm-avatar.component';
 
 @Component({

libs/cli/src/generators/ui/libs/ui-avatar-helm/files/lib/hlm-avatar.component.ts.template

@@ -1,5 +1,5 @@
 import { ChangeDetectionStrategy, Component, ViewEncapsulation, computed, input } from '@angular/core';
-import { BrnAvatarComponent } from '@spartan-ng/ui-avatar-brain';
+import { BrnAvatarComponent } from '@spartan-ng/brain/avatar';
 import { hlm } from '@spartan-ng/ui-core';
 import { type VariantProps, cva } from 'class-variance-authority';
 import type { ClassValue } from 'clsx';

libs/cli/src/generators/ui/libs/ui-avatar-helm/files/lib/image/hlm-avatar-image.directive.ts.template

@@ -1,5 +1,5 @@
 import { Directive, computed, inject, input } from '@angular/core';
-import { BrnAvatarImageDirective } from '@spartan-ng/ui-avatar-brain';
+import { BrnAvatarImageDirective } from '@spartan-ng/brain/avatar';
 import { hlm } from '@spartan-ng/ui-core';
 import type { ClassValue } from 'clsx';
 

libs/cli/src/generators/ui/libs/ui-label-helm/files/lib/hlm-label.directive.ts.template

@@ -1,6 +1,6 @@
 import { Directive, computed, inject, input, signal } from '@angular/core';
 import { hlm } from '@spartan-ng/ui-core';
-import { BrnLabelDirective } from '@spartan-ng/ui-label-brain';
+import { BrnLabelDirective } from '@spartan-ng/brain/label';
 import { type VariantProps, cva } from 'class-variance-authority';
 import type { ClassValue } from 'clsx';
 

libs/tools/package.json

@@ -2,19 +2,19 @@
 	"name": "@spartan-ng/tools",
 	"version": "0.0.1",
 	"type": "commonjs",
-	"executors": "./executors.json",
-	"generators": "./generators.json",
 	"dependencies": {
+		"@nx/angular": "20.1.1",
 		"@nx/devkit": "20.1.1",
-		"process": "0.11.10",
+		"@nx/workspace": "20.1.1",
+		"@spartan-ng/cli": "0.0.1-alpha.367",
 		"enquirer": "2.3.6",
 		"jsonc-eslint-parser": "^2.1.0",
-		"replace-json-property": "^1.9.0",
 		"nx": "20.1.1",
+		"process": "0.11.10",
+		"replace-json-property": "^1.9.0",
 		"tslib": "~2.7.0",
-		"@nx/angular": "20.1.1",
-		"@nx/workspace": "20.1.1",
-		"@spartan-ng/cli": "0.0.1-alpha.367",
 		"typescript": "~5.5.0"
-	}
+	},
+	"executors": "./executors.json",
+	"generators": "./generators.json"
 }

libs/tools/src/generators/brain-secondary-entrypoint/generator.ts

@@ -10,10 +10,10 @@ import {
 	visitNotIgnoredFiles,
 } from '@nx/devkit';
 import { removeGenerator } from '@nx/workspace/generators';
-import { migrateBrainImportsGenerator } from '@spartan-ng/cli';
+import { replaceBrainPackageWithSecondaryEntrypoint } from '@spartan-ng/cli';
 import { basename } from 'node:path';
 import { PackageJson } from 'nx/src/utils/package-json';
-import ts from 'typescript';
+import * as ts from 'typescript';
 import { BrainSecondaryEntrypointGeneratorSchema } from './schema';
 
 export async function brainSecondaryEntrypointGenerator(tree: Tree, options: BrainSecondaryEntrypointGeneratorSchema) {
@@ -46,7 +46,7 @@ async function migrateExistingProject(tree: Tree, options: BrainSecondaryEntrypo
 	}
 
 	// read the package.json file to determine the import path
-	const { name: importPath } = readJson<PackageJson>(tree, joinPathFragments(root, 'package.json'));
+	const { name: importPath, peerDependencies } = readJson<PackageJson>(tree, joinPathFragments(root, 'package.json'));
 
 	// add this as an automated migration to our CLI generator
 	const importMap = tree.read('libs/cli/src/generators/migrate-brain-imports/import-map.ts', 'utf8');
@@ -59,7 +59,7 @@ async function migrateExistingProject(tree: Tree, options: BrainSecondaryEntrypo
 					return ts.factory.createObjectLiteralExpression([
 						...node.properties,
 						ts.factory.createPropertyAssignment(
-							ts.factory.createStringLiteral(importPath),
+							ts.factory.createStringLiteral(`@spartan-ng/${options.project}`),
 							ts.factory.createStringLiteral(`@spartan-ng/brain/${options.name}`),
 						),
 					]);
@@ -102,11 +102,27 @@ async function migrateExistingProject(tree: Tree, options: BrainSecondaryEntrypo
 	// remove the original library
 	await removeGenerator(tree, { projectName: options.project, skipFormat: true, forceRemove: true, importPath });
 
+	// copy over any peer dependencies from the original package.json
+	updateJson<PackageJson>(tree, 'libs/brain/package.json', (json) => {
+		for (const [key, value] of Object.entries(peerDependencies)) {
+			if (!json.peerDependencies[key]) {
+				json.peerDependencies[key] = value;
+			}
+		}
+
+		return json;
+	});
+
 	// migrate library peer dependencies
 	migratePeerDependencies(tree, importPath);
 
 	// migrate the imports - nicely we use our public migration generator here, so we can test it within our own project.
-	await migrateBrainImportsGenerator(tree, { skipFormat: true, skipInstall: true });
+	replaceBrainPackageWithSecondaryEntrypoint(
+		tree,
+		{ skipFormat: true, skipInstall: true },
+		importPath,
+		`@spartan-ng/brain/${options.name}`,
+	);
 }
 
 function migratePeerDependencies(tree: Tree, oldPackage: string): void {

libs/trpc/package.json

@@ -2,44 +2,44 @@
 	"name": "@spartan-ng/trpc",
 	"version": "0.2.29",
 	"description": "Angular/Nitro-based tRPC integration",
-	"author": "Robin Goetz",
 	"keywords": [
 		"angular",
 		"trpc",
 		"remote-procedure-call",
 		"meta-framework"
 	],
-	"license": "MIT",
+	"homepage": "https://spartan.ng",
 	"bugs": {
 		"url": "https://github.com/goetzrobin/spartan/issues"
 	},
-	"homepage": "https://spartan.ng",
 	"repository": {
 		"type": "git",
 		"url": "https://github.com/goetzrobin/spartan.git"
 	},
+	"license": "MIT",
+	"author": "Robin Goetz",
+	"sideEffects": false,
+	"dependencies": {},
 	"peerDependencies": {
+		"@analogjs/vite-plugin-angular": "1.9.4",
 		"@angular/common": ">=18.0.0",
+		"@angular/compiler": "18.2.5",
 		"@angular/core": ">=18.0.0",
+		"@angular/platform-browser-dynamic": "18.2.5",
 		"@trpc/client": "^10.45.2",
 		"@trpc/server": "^10.45.2",
+		"h3": "^1.12.0",
 		"isomorphic-fetch": "^3.0.0",
-		"superjson": "^2.2.1",
 		"rxjs": "~7.8.1",
-		"h3": "^1.12.0",
+		"superjson": "^2.2.1",
 		"ufo": "1.5.4",
-		"@analogjs/vite-plugin-angular": "1.9.4",
-		"@angular/compiler": "18.2.5",
-		"@angular/platform-browser-dynamic": "18.2.5",
 		"vite": "5.4.8"
 	},
-	"dependencies": {},
+	"publishConfig": {
+		"access": "public"
+	},
 	"ng-update": {
 		"packageGroup": [],
 		"migrations": "./migrations/migration.json"
-	},
-	"sideEffects": false,
-	"publishConfig": {
-		"access": "public"
 	}
 }

libs/ui/accordion/accordion.stories.ts

@@ -1,7 +1,7 @@
+import { BrnAccordionDirective, BrnAccordionImports } from '@spartan-ng/brain/accordion';
 import type { Meta, StoryObj } from '@storybook/angular';
 import { moduleMetadata } from '@storybook/angular';
 import { HlmIconComponent } from '../icon/helm/src';
-import { BrnAccordionDirective, BrnAccordionImports } from './brain/src';
 import { HlmAccordionImports } from './helm/src';
 
 const meta: Meta<BrnAccordionDirective> = {