@sealcode/sealgen 0.16.3 → 0.17.1

package/.eslintrc.cjs

@@ -20,6 +20,7 @@ module.exports = {
 		"@typescript-eslint/require-await": 0,
 		"no-await-in-loop": 2,
 		"@typescript-eslint/no-unused-vars": ["warn", { args: "none", "varsIgnorePattern": "^_", }],
+		"@typescript-eslint/no-this-alias": 0
 	},
 	settings: { jsdoc: { mode: "typescript" } },
 	overrides: [

package/@types/src/CSSBuilder.d.ts

@@ -9,7 +9,7 @@ export declare class CSSClump {
     getEntrypointPath(): string;
     makeEntrypoint(): Promise<void>;
     static assignFileToClumps(file_path: string): string[];
-    static findCSSClumps(project_dir: string): Promise<CSSClump[]>;
+    static findCSSClumps(project_dir: string, style_dirs: string[]): Promise<CSSClump[]>;
 }
 export declare class CSSBuilder extends Builder {
     getName(): string;

package/@types/src/builder.d.ts

@@ -1,10 +1,11 @@
 export declare abstract class Builder {
     project_dir: string;
+    style_dirs: string[];
     abstract ownsFile(file_path: string): boolean;
     abstract getName(): string;
     abstract _build(): Promise<void>;
     abstract dispose(): Promise<void>;
-    constructor(project_dir: string);
+    constructor(project_dir: string, style_dirs: string[]);
     ongoing_build: Promise<void> | null;
     build(notifier?: (message: string) => void): Promise<void>;
 }
@@ -21,6 +22,10 @@ export declare class BackendTSBuilder extends Builder {
     _build(): Promise<void>;
 }
 export declare class FrontendTSBuilder extends Builder {
+    project_dir: string;
+    style_dirs: string[];
+    controller_dirs: string[];
+    constructor(project_dir: string, style_dirs: string[], controller_dirs: string[]);
     getName(): string;
     ownsFile(file_path: string): boolean;
     dispose(): Promise<void>;

package/@types/src/esbuild-plugins/rewrite-asset-imports.d.ts

@@ -1,5 +1,5 @@
 import { PluginBuild } from "esbuild";
-export declare const rewrite_asset_imports_plugin: {
+export declare const rewrite_asset_imports_plugin: (project_dir: string) => {
     name: string;
     setup(build: PluginBuild): void;
 };

package/@types/src/generate-stimulus.d.ts

@@ -1 +1 @@
-export declare function generateStimulusControllers(): Promise<void>;
+export declare function generateStimulusControllers(controller_dirs: string[]): Promise<void>;

package/lib/CSSBuilder.js

@@ -89,9 +89,10 @@ class CSSClump {
     }
     return segments;
   }
-  static async findCSSClumps(project_dir) {
+  static async findCSSClumps(project_dir, style_dirs) {
     const clumps = {};
-    const all_files = await walkDir(resolve(project_dir, "src"));
+    const dirs_to_scan = [resolve(project_dir, "src"), ...style_dirs];
+    const all_files = (await Promise.all(dirs_to_scan.map(walkDir))).flat();
     for (const file of all_files) {
       if (!file.endsWith(".css"))
         continue;
@@ -125,10 +126,9 @@ class CSSBuilder extends Builder {
           (rel_path) => fs.unlink(resolve(this.project_dir, rel_path))
         )
       );
-      const clumps = await CSSClump.findCSSClumps(this.project_dir);
-      console.log(
-        "clumps!",
-        clumps.map((c) => c.name)
+      const clumps = await CSSClump.findCSSClumps(
+        this.project_dir,
+        this.style_dirs
       );
       await Promise.all(clumps.map((clump) => clump.build()));
     } catch (e) {

package/lib/build.js

@@ -2,6 +2,7 @@ import { promises as fs } from "fs";
 import * as chokidar from "chokidar";
 import { make_notifier } from "./notifier.js";
 import getPort from "get-port";
+import { resolve } from "node:path";
 import _locreq from "locreq";
 import {
   BackendTSBuilder,
@@ -9,6 +10,7 @@ import {
   FrontendTSBuilder
 } from "./builder.js";
 import { CSSBuilder } from "./CSSBuilder.js";
+import { hasShape, predicates } from "@sealcode/ts-predicates";
 const target_locreq = _locreq(process.cwd());
 async function get_notifier_port() {
   return getPort({ port: 4e3 });
@@ -23,12 +25,58 @@ async function write_notifier_config(watch, port) {
     JSON.stringify(config)
   );
 }
+const package_json_shape = {
+  sealgen: predicates.maybe(
+    predicates.shape({
+      styleDirs: predicates.maybe(predicates.array(predicates.string)),
+      controllerDirs: predicates.maybe(
+        predicates.array(predicates.string)
+      ),
+      copyToPublic: predicates.maybe(
+        predicates.array(
+          predicates.shape({
+            from: predicates.string,
+            to: predicates.string
+          })
+        )
+      )
+    })
+  )
+};
 async function build(watch) {
   const project_dir = target_locreq.resolve("");
-  const fonts_builder = new FontsBuilder(project_dir);
-  const backend_ts_builder = new BackendTSBuilder(project_dir);
-  const frontend_ts_builder = new FrontendTSBuilder(project_dir);
-  const css_builder = new CSSBuilder(project_dir);
+  const package_json = JSON.parse(
+    await fs.readFile(resolve(project_dir, "package.json"), "utf-8")
+  );
+  if (!hasShape(package_json_shape, package_json)) {
+    throw new Error("Misshaped package.json props");
+  }
+  const style_dirs = package_json.sealgen?.styleDirs || [];
+  const controller_dirs = package_json.sealgen?.controllerDirs || [];
+  const copy_to_public = package_json.sealgen?.copyToPublic || [];
+  await Promise.all(
+    copy_to_public.map(async ({ from, to }) => {
+      try {
+        await fs.stat(resolve(project_dir, "public", to));
+      } catch (e) {
+        await fs.mkdir(resolve(project_dir, "public", to, "../"), {
+          recursive: true
+        });
+        await fs.symlink(
+          resolve(project_dir, from),
+          resolve(project_dir, "public", to)
+        );
+      }
+    })
+  );
+  const fonts_builder = new FontsBuilder(project_dir, style_dirs);
+  const backend_ts_builder = new BackendTSBuilder(project_dir, style_dirs);
+  const frontend_ts_builder = new FrontendTSBuilder(
+    project_dir,
+    style_dirs,
+    controller_dirs
+  );
+  const css_builder = new CSSBuilder(project_dir, style_dirs);
   const builders = [
     fonts_builder,
     backend_ts_builder,

package/lib/builder.js

@@ -11,8 +11,9 @@ import { generateStimulusControllers } from "./generate-stimulus.js";
 import { FONTS_CONFIG_PATH, getFonts } from "./get-fonts.js";
 import { relative } from "node:path";
 class Builder {
-  constructor(project_dir) {
+  constructor(project_dir, style_dirs) {
     this.project_dir = project_dir;
+    this.style_dirs = style_dirs;
     this.ongoing_build = null;
   }
   build(notifier) {
@@ -77,7 +78,10 @@ class BackendTSBuilder extends Builder {
       loader: Object.fromEntries(
         embeddable_file_extensions.map((ext) => ["." + ext, "js"])
       ),
-      plugins: [rewrite_asset_imports_plugin, load_assets_plugin],
+      plugins: [
+        rewrite_asset_imports_plugin(this.project_dir),
+        load_assets_plugin
+      ],
       metafile: true
     });
     await fs.writeFile(
@@ -87,6 +91,12 @@ class BackendTSBuilder extends Builder {
   }
 }
 class FrontendTSBuilder extends Builder {
+  constructor(project_dir, style_dirs, controller_dirs) {
+    super(project_dir, style_dirs);
+    this.project_dir = project_dir;
+    this.style_dirs = style_dirs;
+    this.controller_dirs = controller_dirs;
+  }
   getName() {
     return "frontend-ts";
   }
@@ -97,7 +107,7 @@ class FrontendTSBuilder extends Builder {
   async dispose() {
   }
   async _build() {
-    await generateStimulusControllers();
+    await generateStimulusControllers(this.controller_dirs);
     const { metafile } = await build({
       entryPoints: ["./src/front/index.ts"],
       sourcemap: true,

package/lib/cli.js

@@ -9,7 +9,6 @@ import { generateRoutes } from "./generate-routes.js";
 import { makeEnv } from "./make-env.js";
 import yargs from "yargs/yargs";
 import { getFonts } from "./get-fonts.js";
-import { generateStimulusControllers } from "./generate-stimulus.js";
 import { addCRUD } from "./add-crud.js";
 const actions = {
   "add-collection": addCollection,
@@ -27,8 +26,7 @@ const actions = {
   },
   "make-env": makeEnv,
   "add-component": addJDDComponent,
-  "get-fonts": getFonts,
-  "generate-stimulus": generateStimulusControllers
+  "get-fonts": getFonts
 };
 void async function() {
   const action = process.argv.at(2);

package/lib/esbuild-plugins/rewrite-asset-imports.js

@@ -1,8 +1,8 @@
 import { promises as fs } from "fs";
-import { extname } from "node:path";
+import { extname, resolve } from "node:path";
 import { embeddable_file_extensions } from "../embeddable-file-extensions.js";
 import { removeNamedImports } from "../../remove-named-imports.js";
-const rewrite_asset_imports_plugin = {
+const rewrite_asset_imports_plugin = (project_dir) => ({
   name: "sealgen-rewrite-asset-imports",
   setup(build) {
     build.onLoad({ filter: /\.tsx?$/ }, async (args) => {
@@ -13,9 +13,23 @@ const rewrite_asset_imports_plugin = {
           "gm"
         );
         contents = contents.replaceAll(regex_assets, (line) => {
-          return line.replace(`.${ext}"`, '.js"');
+          line = line.replace(`.${ext}"`, '.js"');
+          return line;
         });
       }
+      const regex_import = new RegExp(
+        `^import (\\w+|{[^}]+}) from "([^"]+)";`,
+        "gm"
+      );
+      contents = contents.replaceAll(
+        regex_import,
+        (line, _, original_path) => {
+          return line.replace(
+            `"src/`,
+            `"` + resolve(project_dir, "./dist") + "/"
+          );
+        }
+      );
       contents = removeNamedImports(contents);
       return {
         contents,
@@ -23,7 +37,7 @@ const rewrite_asset_imports_plugin = {
       };
     });
   }
-};
+});
 export {
   rewrite_asset_imports_plugin
 };

package/lib/generate-stimulus.js

@@ -6,10 +6,13 @@ import recursive from "recursive-readdir";
 import path, { dirname } from "path";
 import { toKebabCase, toPascalCase } from "js-convert-case";
 const target_locreq = _locreq(process.cwd());
-async function generateStimulusControllers() {
+async function generateStimulusControllers(controller_dirs) {
   const output_file = "src/front/controllers.ts";
-  const stimulus_search_dir = target_locreq.resolve("src/");
-  const controller_names = (await recursive(stimulus_search_dir)).filter((c) => c.endsWith(".stimulus.ts")).sort();
+  const stimulus_search_dirs = [
+    target_locreq.resolve("src/"),
+    ...controller_dirs
+  ];
+  const controller_names = (await Promise.all(stimulus_search_dirs.map((dir) => recursive(dir)))).flat().filter((c) => c.endsWith(".stimulus.ts")).sort();
   const controller_data = controller_names.map(
     (p) => "./" + path.relative(target_locreq.resolve(dirname(output_file)), p).replace(/\.[tj]sx?$/, ".js")
   ).map((relative_path) => {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@sealcode/sealgen",
-	"version": "0.16.3",
+	"version": "0.17.1",
 	"description": "Module to automate adding routes and collections to a sealious application",
 	"main": "lib/index.js",
 	"type": "module",

package/src/CSSBuilder.ts

@@ -100,9 +100,13 @@ export class CSSClump {
 		return segments;
 	}
 
-	static async findCSSClumps(project_dir: string): Promise<CSSClump[]> {
+	static async findCSSClumps(
+		project_dir: string,
+		style_dirs: string[]
+	): Promise<CSSClump[]> {
 		const clumps: Record<string, CSSClump> = {};
-		const all_files = await walkDir(resolve(project_dir, "src"));
+		const dirs_to_scan = [resolve(project_dir, "src"), ...style_dirs];
+		const all_files = (await Promise.all(dirs_to_scan.map(walkDir))).flat();
 		for (const file of all_files) {
 			if (!file.endsWith(".css")) continue;
 			const clump_names = CSSClump.assignFileToClumps(file);
@@ -141,10 +145,9 @@ export class CSSBuilder extends Builder {
 					fs.unlink(resolve(this.project_dir, rel_path))
 				)
 			);
-			const clumps = await CSSClump.findCSSClumps(this.project_dir);
-			console.log(
-				"clumps!",
-				clumps.map((c) => c.name)
+			const clumps = await CSSClump.findCSSClumps(
+				this.project_dir,
+				this.style_dirs
 			);
 			await Promise.all(clumps.map((clump) => clump.build()));
 		} catch (e) {

package/src/build.ts

@@ -2,6 +2,7 @@ import { promises as fs } from "fs";
 import * as chokidar from "chokidar";
 import { make_notifier } from "./notifier.js";
 import getPort from "get-port";
+import { resolve } from "node:path";
 
 import _locreq from "locreq";
 
@@ -11,6 +12,7 @@ import {
 	FrontendTSBuilder,
 } from "./builder.js";
 import { CSSBuilder } from "./CSSBuilder.js";
+import { hasShape, predicates } from "@sealcode/ts-predicates";
 const target_locreq = _locreq(process.cwd());
 
 async function get_notifier_port() {
@@ -28,12 +30,61 @@ async function write_notifier_config(watch: boolean, port?: number) {
 	);
 }
 
+const package_json_shape = {
+	sealgen: predicates.maybe(
+		predicates.shape({
+			styleDirs: predicates.maybe(predicates.array(predicates.string)),
+			controllerDirs: predicates.maybe(
+				predicates.array(predicates.string)
+			),
+			copyToPublic: predicates.maybe(
+				predicates.array(
+					predicates.shape({
+						from: predicates.string,
+						to: predicates.string,
+					})
+				)
+			),
+		})
+	),
+};
+
 async function build(watch: boolean): Promise<void> {
 	const project_dir = target_locreq.resolve("");
-	const fonts_builder = new FontsBuilder(project_dir);
-	const backend_ts_builder = new BackendTSBuilder(project_dir);
-	const frontend_ts_builder = new FrontendTSBuilder(project_dir);
-	const css_builder = new CSSBuilder(project_dir);
+	const package_json = JSON.parse(
+		await fs.readFile(resolve(project_dir, "package.json"), "utf-8")
+	) as Record<string, unknown>;
+	if (!hasShape(package_json_shape, package_json)) {
+		throw new Error("Misshaped package.json props");
+	}
+	const style_dirs = package_json.sealgen?.styleDirs || [];
+	const controller_dirs = package_json.sealgen?.controllerDirs || [];
+	const copy_to_public = package_json.sealgen?.copyToPublic || [];
+
+	await Promise.all(
+		copy_to_public.map(async ({ from, to }) => {
+			try {
+				await fs.stat(resolve(project_dir, "public", to));
+			} catch (e) {
+				await fs.mkdir(resolve(project_dir, "public", to, "../"), {
+					recursive: true,
+				});
+				await fs.symlink(
+					resolve(project_dir, from),
+					resolve(project_dir, "public", to)
+				);
+			}
+		})
+	);
+
+	const fonts_builder = new FontsBuilder(project_dir, style_dirs);
+	const backend_ts_builder = new BackendTSBuilder(project_dir, style_dirs);
+	const frontend_ts_builder = new FrontendTSBuilder(
+		project_dir,
+		style_dirs,
+		controller_dirs
+	);
+	const css_builder = new CSSBuilder(project_dir, style_dirs);
 	const builders = [
 		fonts_builder,
 		backend_ts_builder,

package/src/builder.ts

@@ -9,7 +9,11 @@ import { generateComponents } from "./generate-components.js";
 import { generateRoutes } from "./generate-routes.js";
 import { generateStimulusControllers } from "./generate-stimulus.js";
 import { FONTS_CONFIG_PATH, getFonts } from "./get-fonts.js";
-import { relative } from "node:path";
+import { relative, resolve } from "node:path";
+import {
+	prepareSingleFileReplaceTscAliasPaths,
+	SingleFileReplacer,
+} from "tsc-alias";
 
 export abstract class Builder {
 	abstract ownsFile(file_path: string): boolean;
@@ -17,7 +21,7 @@ export abstract class Builder {
 	abstract _build(): Promise<void>;
 	abstract dispose(): Promise<void>;
 
-	constructor(public project_dir: string) {}
+	constructor(public project_dir: string, public style_dirs: string[]) {}
 
 	public ongoing_build: Promise<void> | null = null;
 
@@ -86,6 +90,7 @@ export class BackendTSBuilder extends Builder {
 				)}}`
 			)
 		).filter((path) => !path.includes(".#"));
+
 		const { metafile } = await build({
 			entryPoints,
 			sourcemap: true,
@@ -100,7 +105,10 @@ export class BackendTSBuilder extends Builder {
 			loader: Object.fromEntries(
 				embeddable_file_extensions.map((ext) => ["." + ext, "js"])
 			),
-			plugins: [rewrite_asset_imports_plugin, load_assets_plugin],
+			plugins: [
+				rewrite_asset_imports_plugin(this.project_dir),
+				load_assets_plugin,
+			],
 			metafile: true,
 		});
 
@@ -112,6 +120,14 @@ export class BackendTSBuilder extends Builder {
 }
 
 export class FrontendTSBuilder extends Builder {
+	constructor(
+		public project_dir: string,
+		public style_dirs: string[],
+		public controller_dirs: string[]
+	) {
+		super(project_dir, style_dirs);
+	}
+
 	getName(): string {
 		return "frontend-ts";
 	}
@@ -127,7 +143,7 @@ export class FrontendTSBuilder extends Builder {
 	async dispose(): Promise<void> {}
 
 	async _build(): Promise<void> {
-		await generateStimulusControllers();
+		await generateStimulusControllers(this.controller_dirs);
 		const { metafile } = await build({
 			entryPoints: ["./src/front/index.ts"],
 			sourcemap: true,

package/src/cli.ts

@@ -9,7 +9,6 @@ import { generateRoutes } from "./generate-routes.js";
 import { makeEnv } from "./make-env.js";
 import yargs from "yargs/yargs";
 import { getFonts } from "./get-fonts.js";
-import { generateStimulusControllers } from "./generate-stimulus.js";
 import { addCRUD } from "./add-crud.js";
 
 const actions: Record<
@@ -34,7 +33,6 @@ const actions: Record<
 	"make-env": makeEnv,
 	"add-component": addJDDComponent,
 	"get-fonts": getFonts,
-	"generate-stimulus": generateStimulusControllers,
 };
 
 void (async function () {

package/src/esbuild-plugins/rewrite-asset-imports.ts

@@ -1,10 +1,10 @@
 import { promises as fs } from "fs";
-import { extname } from "node:path";
+import { extname, resolve } from "node:path";
 import { embeddable_file_extensions } from "../embeddable-file-extensions.js";
 import { removeNamedImports } from "../../remove-named-imports.js";
 import { PluginBuild } from "esbuild";
 
-export const rewrite_asset_imports_plugin = {
+export const rewrite_asset_imports_plugin = (project_dir: string) => ({
 	name: "sealgen-rewrite-asset-imports",
 	setup(build: PluginBuild) {
 		build.onLoad({ filter: /\.tsx?$/ }, async (args) => {
@@ -15,9 +15,23 @@ export const rewrite_asset_imports_plugin = {
 					"gm"
 				);
 				contents = contents.replaceAll(regex_assets, (line) => {
-					return line.replace(`.${ext}"`, '.js"');
+					line = line.replace(`.${ext}"`, '.js"');
+					return line;
 				});
 			}
+			const regex_import = new RegExp(
+				`^import (\\w+|{[^}]+}) from "([^"]+)";`,
+				"gm"
+			);
+			contents = contents.replaceAll(
+				regex_import,
+				(line, _: string, original_path: string) => {
+					return line.replace(
+						`"src/`,
+						`"` + resolve(project_dir, "./dist") + "/"
+					);
+				}
+			);
 
 			contents = removeNamedImports(contents) as string;
 
@@ -27,4 +41,4 @@ export const rewrite_asset_imports_plugin = {
 			};
 		});
 	},
-};
+});

package/src/generate-stimulus.ts

@@ -8,10 +8,18 @@ import { toKebabCase, toPascalCase } from "js-convert-case";
 
 const target_locreq = _locreq(process.cwd());
 
-export async function generateStimulusControllers(): Promise<void> {
+export async function generateStimulusControllers(
+	controller_dirs: string[]
+): Promise<void> {
 	const output_file = "src/front/controllers.ts";
-	const stimulus_search_dir = target_locreq.resolve("src/");
-	const controller_names = (await recursive(stimulus_search_dir))
+	const stimulus_search_dirs = [
+		target_locreq.resolve("src/"),
+		...controller_dirs,
+	];
+	const controller_names = (
+		await Promise.all(stimulus_search_dirs.map((dir) => recursive(dir)))
+	)
+		.flat()
 		.filter((c) => c.endsWith(".stimulus.ts"))
 		.sort();
 	const controller_data = controller_names