x4js 2.3.5 → 2.3.7

package/cli/build-options.mjs

@@ -4,7 +4,7 @@ import { sassPlugin } from "esbuild-sass-plugin";
 import { lessPlugin } from "./less-plugin.mjs";
 import { copyPlugin } from "./copy-plugin.mjs";
 import { rawFilePlugin } from "./rawfile-plugin.mjs";
-import { diagnosticsPlugin } from "./diagnostic.mjs";
+import { diagnosticsPlugin } from "./diagnostic-plugin.mjs";
 
 const cliDir = path.dirname(fileURLToPath(import.meta.url));
 const devClient = path.join(cliDir, "dev-client.js");

package/cli/build.mjs

@@ -1,15 +1,16 @@
 import fs from "node:fs/promises";
 import { parseArgs } from "node:util";
 import esbuild from "esbuild";
-import { loadConfig } from "./config.mjs";
+import { DEFAULT_CONFIG_FILE, expandEnv, loadConfig } from "./config.mjs";
 import { createBuildOptions } from "./build-options.mjs";
 import { info, success } from "./log.mjs";
-import { printBuildError} from "./diagnostic-plugin.mjs";
+import { printBuildError, printWarnings } from "./diagnostic-plugin.mjs";
 
 export async function build(argv = [], root = process.cwd()) {
     const { values, positionals } = parseArgs({
         args: argv,
         options: {
+            config: { type: "string" },
             debug: { type: "boolean", default: false },
         },
         allowPositionals: true,
@@ -19,29 +20,26 @@ export async function build(argv = [], root = process.cwd()) {
     if (positionals.length)
         throw new Error(`Unexpected argument: ${positionals[0]}`);
 
-    const config = loadConfig(root);
+    const configArg = values.config ? expandEnv(values.config) : DEFAULT_CONFIG_FILE;
+    const config = loadConfig(root, configArg, process.env, { explicit: values.config !== undefined });
     const mode = values.debug ? "debug" : "production";
 
     info("mode", mode);
+    info("config", config.configFile);
     info("outdir", config.outdir);
 
     await fs.rm(config.outdir, { recursive: true, force: true });
     await fs.mkdir(config.outdir, { recursive: true });
 
     const started = performance.now();
-	const options = createBuildOptions(config, mode);
-
-	try {
-		const result = await esbuild.build(options);
-		if (result.warnings.length)
-			await printWarnings(result.warnings);
-
-		logSuccess(`built      ${Date.now() - start}ms`);
-	}
-	catch (error) {
-		await printBuildError(error);
-		process.exitCode = 1;
-	}
-
-	success("built", `${Math.round(performance.now() - started)}ms`);
+    try {
+        const result = await esbuild.build(createBuildOptions(config, mode));
+        if (result.warnings.length)
+            await printWarnings(result.warnings);
+        success("built", `${Math.round(performance.now() - started)}ms`);
+    }
+    catch (error) {
+        await printBuildError(error);
+        process.exitCode = 1;
+    }
 }

package/cli/config.mjs

@@ -1,6 +1,8 @@
 import fs from "node:fs";
 import path from "node:path";
 
+export const DEFAULT_CONFIG_FILE = "x4.config.json";
+
 const DEFAULTS = Object.freeze({
     entryPoints: ["src/main.ts"],
     outdir: "./bin",
@@ -36,94 +38,107 @@ export function resolvePath(root, value, env = process.env) {
         : path.resolve(root, expanded);
 }
 
+export function resolveConfigFile(root, configFile = DEFAULT_CONFIG_FILE, env = process.env) {
+    return resolvePath(root, configFile, env);
+}
+
+function readJson(filename) {
+    try {
+        return JSON.parse(fs.readFileSync(filename, "utf8"));
+    }
+    catch (error) {
+        throw new Error(`Cannot read config '${filename}': ${error.message}`);
+    }
+}
+
 function validateCopy(copy) {
     if (!Array.isArray(copy))
-        throw new Error("x4.copy must be an array");
+        throw new Error("copy must be an array");
 
     for (const item of copy) {
         if (!item || typeof item !== "object" || typeof item.from !== "string" || typeof item.to !== "string")
-            throw new Error("Each x4.copy entry must contain string 'from' and 'to' fields");
+            throw new Error("Each copy entry must contain string 'from' and 'to' fields");
         if (path.isAbsolute(item.to))
-            throw new Error(`x4.copy destination must be relative to outdir: '${item.to}'`);
+            throw new Error(`copy destination must be relative to outdir: '${item.to}'`);
         const normalized = path.normalize(item.to);
         if (normalized === ".." || normalized.startsWith(`..${path.sep}`))
-            throw new Error(`x4.copy destination escapes outdir: '${item.to}'`);
+            throw new Error(`copy destination escapes outdir: '${item.to}'`);
     }
 }
 
-export function loadConfig(root = process.cwd(), env = process.env) {
+export function loadConfig(root = process.cwd(), configFile = DEFAULT_CONFIG_FILE, env = process.env, { explicit = false } = {}) {
     root = path.resolve(root);
-    const packageFile = path.join(root, "package.json");
-
-    if (!fs.existsSync(packageFile))
-        throw new Error(`Cannot find package.json in '${root}'`);
+    const filename = resolveConfigFile(root, configFile, env);
 
-    let pkg;
-    try {
-        pkg = JSON.parse(fs.readFileSync(packageFile, "utf8"));
-    }
-    catch (error) {
-        throw new Error(`Cannot read package.json: ${error.message}`);
-    }
+    let cfg = {};
+    if (fs.existsSync(filename))
+        cfg = readJson(filename);
+    else if (explicit)
+        throw new Error(`Config file not found: ${filename}`);
 
-    const cfg = pkg.x4 ?? {};
-    if (cfg === null || typeof cfg !== "object" || Array.isArray(cfg))
-        throw new Error("package.json field 'x4' must be an object");
+    if (!cfg || typeof cfg !== "object" || Array.isArray(cfg))
+        throw new Error("x4 config must be an object");
 
     const entryPoints = cfg.entryPoints ?? DEFAULTS.entryPoints;
     if (!Array.isArray(entryPoints) || !entryPoints.length || entryPoints.some((entry) => typeof entry !== "string"))
-        throw new Error("x4.entryPoints must be a non-empty array of strings");
+        throw new Error("entryPoints must be a non-empty array of strings");
 
     const copy = cfg.copy ?? DEFAULTS.copy;
     validateCopy(copy);
 
     const external = cfg.external ?? DEFAULTS.external;
     if (!Array.isArray(external) || external.some((entry) => typeof entry !== "string"))
-        throw new Error("x4.external must be an array of strings");
+        throw new Error("external must be an array of strings");
 
     const define = cfg.define ?? DEFAULTS.define;
     if (!define || typeof define !== "object" || Array.isArray(define))
-        throw new Error("x4.define must be an object");
+        throw new Error("define must be an object");
     if (Object.values(define).some((value) => typeof value !== "string"))
-        throw new Error("x4.define values must be strings containing esbuild define expressions");
+        throw new Error("define values must be strings containing esbuild define expressions");
 
     const devCfg = cfg.dev ?? {};
     if (!devCfg || typeof devCfg !== "object" || Array.isArray(devCfg))
-        throw new Error("x4.dev must be an object");
+        throw new Error("dev must be an object");
 
     const host = devCfg.host ?? DEFAULTS.dev.host;
     if (typeof host !== "string" || !host)
-        throw new Error("x4.dev.host must be a non-empty string");
+        throw new Error("dev.host must be a non-empty string");
 
     const port = devCfg.port;
     if (port !== undefined && (!Number.isInteger(port) || port < 0 || port > 65535))
-        throw new Error("x4.dev.port must be an integer between 0 and 65535");
+        throw new Error("dev.port must be an integer between 0 and 65535");
 
     const https = devCfg.https ?? DEFAULTS.dev.https;
     if (typeof https !== "boolean")
-        throw new Error("x4.dev.https must be a boolean");
+        throw new Error("dev.https must be a boolean");
 
     if (devCfg.tls !== undefined) {
         if (!devCfg.tls || typeof devCfg.tls !== "object" || Array.isArray(devCfg.tls))
-            throw new Error("x4.dev.tls must be an object");
+            throw new Error("dev.tls must be an object");
         if (typeof devCfg.tls.cert !== "string" || typeof devCfg.tls.key !== "string")
-            throw new Error("x4.dev.tls requires string 'cert' and 'key' fields");
+            throw new Error("dev.tls requires string 'cert' and 'key' fields");
     }
 
     const outdirRaw = cfg.outdir ?? DEFAULTS.outdir;
     if (typeof outdirRaw !== "string")
-        throw new Error("x4.outdir must be a string");
+        throw new Error("outdir must be a string");
 
     const outdir = resolvePath(root, outdirRaw, env);
     if (outdir === root)
-        throw new Error("x4.outdir cannot be the project root");
+        throw new Error("outdir cannot be the project root");
     if (outdir === path.parse(outdir).root)
-        throw new Error("x4.outdir cannot be a filesystem root");
+        throw new Error("outdir cannot be a filesystem root");
+
+    let esbuildOptions = {};
+    if (cfg.esbuild !== undefined) {
+        if (!cfg.esbuild || typeof cfg.esbuild !== "object" || Array.isArray(cfg.esbuild))
+            throw new Error("esbuild must be an object");
+        esbuildOptions = { ...cfg.esbuild };
+    }
 
     return {
         root,
-        packageFile,
-        package: pkg,
+        configFile: filename,
         entryPoints: entryPoints.map((entry) => resolvePath(root, entry, env)),
         outdir,
         copy: copy.map((item) => ({
@@ -132,26 +147,20 @@ export function loadConfig(root = process.cwd(), env = process.env) {
         })),
         external: [...external],
         define: { ...define },
-		dev: {
+        dev: {
             host,
             port,
             https,
             tls: devCfg.tls ? { ...devCfg.tls } : undefined,
         },
-        esbuild: (() => {
-            if (cfg.esbuild === undefined)
-                return {};
-            if (!cfg.esbuild || typeof cfg.esbuild !== "object" || Array.isArray(cfg.esbuild))
-                throw new Error("x4.esbuild must be an object");
-            return { ...cfg.esbuild };
-        })(),
+        esbuild: esbuildOptions,
     };
 }
 
 export function resolveTls(config, env = process.env) {
     const tls = config.dev.tls;
     if (!tls)
-        throw new Error("HTTPS is enabled but x4.dev.tls.cert/key are not configured");
+        throw new Error("HTTPS is enabled but dev.tls.cert/key are not configured");
 
     const certfile = resolvePath(config.root, tls.cert, env);
     const keyfile = resolvePath(config.root, tls.key, env);

package/cli/dev.mjs

@@ -3,7 +3,7 @@ import path from "node:path";
 import { spawn } from "node:child_process";
 import { parseArgs } from "node:util";
 import esbuild from "esbuild";
-import { loadConfig, resolveTls } from "./config.mjs";
+import { DEFAULT_CONFIG_FILE, expandEnv, loadConfig, resolveConfigFile, resolveTls } from "./config.mjs";
 import { createBuildOptions } from "./build-options.mjs";
 import { info, success, failure } from "./log.mjs";
 
@@ -59,6 +59,7 @@ export async function dev(argv = [], root = process.cwd()) {
     const { values, positionals } = parseArgs({
         args: argv,
         options: {
+            config: { type: "string" },
             host: { type: "string" },
             port: { type: "string" },
             http: { type: "boolean", default: false },
@@ -71,12 +72,15 @@ export async function dev(argv = [], root = process.cwd()) {
 
     if (positionals.length)
         throw new Error(`Unexpected argument: ${positionals[0]}`);
-
     if (values.port !== undefined && !/^\d+$/.test(values.port))
         throw new Error("--port must be an integer");
 
+    const configArg = values.config ? expandEnv(values.config) : DEFAULT_CONFIG_FILE;
+    const explicitConfig = values.config !== undefined;
+    const watchedConfigFile = resolveConfigFile(root, configArg);
+
     let context;
-    let packageWatcher;
+    let configWatcher;
     let stopping = false;
     let restartTimer;
     let restartChain = Promise.resolve();
@@ -96,7 +100,6 @@ export async function dev(argv = [], root = process.cwd()) {
 
         if (port !== undefined)
             serveOptions.port = port;
-
         if (useHttps)
             Object.assign(serveOptions, resolveTls(config));
 
@@ -109,6 +112,7 @@ export async function dev(argv = [], root = process.cwd()) {
             const actualHost = result.hosts.includes(host) ? host : (result.hosts[0] ?? host);
             const url = serverUrl(actualHost, result.port, useHttps);
             info("mode", "dev");
+            info("config", config.configFile);
             info("outdir", config.outdir);
             success("server", url);
 
@@ -126,9 +130,9 @@ export async function dev(argv = [], root = process.cwd()) {
     async function reload() {
         let config;
         try {
-            config = loadConfig(root);
+            config = loadConfig(root, configArg, process.env, { explicit: explicitConfig });
             protocolConfig(config, values);
-            if ((values.https || (!values.http && config.dev.https)))
+            if (values.https || (!values.http && config.dev.https))
                 resolveTls(config);
         }
         catch (error) {
@@ -147,8 +151,6 @@ export async function dev(argv = [], root = process.cwd()) {
         }
         catch (error) {
             failure(`restart: ${error.message}`);
-            // The old context cannot be restored after dispose. Keep watching
-            // package.json so fixing the configuration starts dev again.
         }
     }
 
@@ -159,11 +161,13 @@ export async function dev(argv = [], root = process.cwd()) {
         }, 150);
     }
 
-    const initialConfig = loadConfig(root);
+    const initialConfig = loadConfig(root, configArg, process.env, { explicit: explicitConfig });
     await start(initialConfig);
 
-    packageWatcher = fs.watch(path.resolve(root), { persistent: true }, (_event, filename) => {
-        if (filename === null || filename.toString() === "package.json")
+    const watchDir = path.dirname(watchedConfigFile);
+    const watchName = path.basename(watchedConfigFile);
+    configWatcher = fs.watch(watchDir, { persistent: true }, (_event, filename) => {
+        if (filename === null || filename.toString() === watchName)
             scheduleReload();
     });
 
@@ -172,7 +176,7 @@ export async function dev(argv = [], root = process.cwd()) {
             return;
         stopping = true;
         clearTimeout(restartTimer);
-        packageWatcher?.close();
+        configWatcher?.close();
         await restartChain.catch(() => {});
         await context?.dispose();
     }

package/cli/main.mjs

@@ -21,10 +21,11 @@ function printHelp(version) {
 Usage:
   x4js create <project> [--template <name>] [--no-install]
   x4js templates
-  x4js dev [--host <host>] [--port <port>] [--http|--https] [--open]
-  x4js build [--debug]
+  x4js dev [--config <file>] [--host <host>] [--port <port>] [--http|--https] [--open]
+  x4js build [--config <file>] [--debug]
 
 Options:
+  --config <file>  Config file (default: x4.config.json)
   -h, --help       Show help
   -v, --version    Show version`);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "x4js",
-  "version": "2.3.5",
+  "version": "2.3.7",
   "type": "module",
   "main": "src/x4.ts",
   "module": "src/x4.ts",

package/src/components/gridview/gridview.ts

@@ -33,7 +33,7 @@ import { _tr } from '../../core/core_i18n';
 
 import "./gridview.module.scss"
 
-export type CellRenderer = (rec: DataRecord) => Component;
+export type CellRenderer = (rec: DataRecord, col_id: any) => Component;
 export type CellClassifier = (data: any, rec: DataRecord, col: string ) => string;	// return the cell computed class
 
 type ColType = "number" | "money" | "checkbox" | "date" | "string" | "image" | "percent" | "icon" | "date-time";
@@ -694,6 +694,11 @@ export class Gridview<P extends GridviewProps = GridviewProps, E extends Gridvie
 			return null;
 		}
 
+        if( column.renderer ) {
+            const cell = column.renderer( rec, col );
+            return cell;
+        }
+
 		let cls = "";
 		if( column.classifier ) {
 			extra_cls.push( column.classifier( data, rec, col ) );