@gtkx/cli 1.0.0-rc.1 → 1.0.0-rc.2

package/src/vite-plugins/built-url.ts

@@ -1,6 +1,32 @@
 import type { Plugin } from "vite";
 
-export function gtkxBuiltUrl(assetBase?: string): Plugin {
+const renderAssetUrl = (
+    filename: string,
+    type: string,
+    assetBase: string | undefined,
+): { runtime: string } | undefined => {
+    if (type !== "asset") {
+        return undefined;
+    }
+
+    if (assetBase) {
+        const executableDir = "require(\"path\").dirname(process.execPath)";
+
+        return {
+            runtime:
+                `require("path").join(${executableDir},` +
+                `${JSON.stringify(assetBase)},${JSON.stringify(filename)})`,
+        };
+    }
+
+    const filenameLiteral = JSON.stringify(`./${filename}`);
+
+    return {
+        runtime: `new URL(${filenameLiteral}, import.meta.url).pathname`,
+    };
+};
+
+function gtkxBuiltUrl(assetBase?: string): Plugin {
     return {
         name: "gtkx:built-url",
         apply: "build",
@@ -13,23 +39,12 @@ export function gtkxBuiltUrl(assetBase?: string): Plugin {
             return {
                 experimental: {
                     renderBuiltUrl(filename, { type }) {
-                        if (type !== "asset") {
-                            return;
-                        }
-
-                        if (assetBase) {
-                            return {
-                                runtime: `require("path").join(require("path").dirname(process.execPath),${JSON.stringify(assetBase)},${JSON.stringify(filename)})`,
-                            };
-                        }
-
-                        const filenameLiteral = JSON.stringify(`./${filename}`);
-                        return {
-                            runtime: `new URL(${filenameLiteral}, import.meta.url).pathname`,
-                        };
+                        return renderAssetUrl(filename, type, assetBase);
                     },
                 },
             };
         },
     };
 }
+
+export { gtkxBuiltUrl };

package/src/vite-plugins/css.ts

@@ -1,38 +1,53 @@
-import { readFileSync } from "node:fs";
 import type { Plugin } from "vite";
+import { readFileSync } from "node:fs";
 import { createVirtualNamespace } from "./virtual-module.js";
 
+type CssResolveContext = Parameters<typeof resolveToVirtual>[0];
+type CssResolveRequest = Parameters<typeof resolveToVirtual>[1];
+
 const CSS_RE = /\.css$/i;
 const INJECT_SUFFIX = "?inject";
 const VIRTUAL_PREFIX = "\0gtkx-css:";
 const { isVirtual, fromVirtualId, resolveToVirtual } = createVirtualNamespace(VIRTUAL_PREFIX);
 
-export function gtkxCss(): Plugin {
+const resolveCssId = async (ctx: CssResolveContext, request: CssResolveRequest): Promise<string | undefined> => {
+    if (!CSS_RE.test(request.source)) {
+        return;
+    }
+
+    const virtualId = await resolveToVirtual(ctx, request);
+
+    if (virtualId === undefined) {
+        return;
+    }
+
+    return virtualId + INJECT_SUFFIX;
+};
+
+const loadInjectedCss = (id: string): string | undefined => {
+    if (!isVirtual(id) || !id.endsWith(INJECT_SUFFIX)) {
+        return;
+    }
+
+    const filePath = fromVirtualId(id.slice(0, -INJECT_SUFFIX.length));
+    const content = readFileSync(filePath, "utf8");
+
+    return ["import { injectGlobal } from \"@gtkx/css\";", `injectGlobal(${JSON.stringify(content)});`].join("\n");
+};
+
+function gtkxCss(): Plugin {
     return {
         name: "gtkx:css",
         enforce: "pre",
 
-        async resolveId(source, importer, options) {
-            if (!CSS_RE.test(source)) {
-                return;
-            }
-
-            const virtualId = await resolveToVirtual(this, { source, importer, options });
-            if (virtualId === undefined) return;
-
-            return virtualId + INJECT_SUFFIX;
+        resolveId(source, importer, options) {
+            return resolveCssId(this, { source, importer, options });
         },
 
         load(id) {
-            if (isVirtual(id) && id.endsWith(INJECT_SUFFIX)) {
-                const filePath = fromVirtualId(id.slice(0, -INJECT_SUFFIX.length));
-                const content = readFileSync(filePath, "utf-8");
-                return [`import { injectGlobal } from "@gtkx/css";`, `injectGlobal(${JSON.stringify(content)});`].join(
-                    "\n",
-                );
-            }
-
-            return;
+            return loadInjectedCss(id);
         },
     };
 }
+
+export { gtkxCss };

package/src/vite-plugins/fast-refresh/refresh-filter.ts

@@ -1,18 +1,26 @@
-export const REFRESH_REG = "$RefreshReg$";
-
-export const REFRESH_SIG = "$RefreshSig$";
-
-export const REFRESH_RUNTIME_SPECIFIER = "@gtkx/cli/refresh-runtime";
-
+const REFRESH_REG = "$RefreshReg$";
+const REFRESH_SIG = "$RefreshSig$";
+const REFRESH_RUNTIME_SPECIFIER = "@gtkx/cli/refresh-runtime";
 const REFRESH_INCLUDE = /\.[tj]sx?$/;
 const REFRESH_EXCLUDE = /node_modules|[/\\]dist[/\\]|[/\\]\.gtkx[/\\]/;
 
-export const shouldTransformForRefresh = (
+const shouldTransformForRefresh = (
     id: string,
     transformOptions: { ssr?: boolean | undefined } | undefined,
 ): boolean => {
-    if (!transformOptions?.ssr) return false;
-    if (!REFRESH_INCLUDE.test(id)) return false;
-    if (REFRESH_EXCLUDE.test(id)) return false;
+    if (!transformOptions?.ssr) {
+        return false;
+    }
+
+    if (!REFRESH_INCLUDE.test(id)) {
+        return false;
+    }
+
+    if (REFRESH_EXCLUDE.test(id)) {
+        return false;
+    }
+
     return true;
 };
+
+export { REFRESH_REG, REFRESH_SIG, REFRESH_RUNTIME_SPECIFIER, shouldTransformForRefresh };

package/src/vite-plugins/fast-refresh/swc-refresh.ts

@@ -1,9 +1,55 @@
-import { fileURLToPath } from "node:url";
-import { type Options as SwcOptions, transform } from "@swc/core";
 import type { Plugin } from "vite";
+import { type Output, type Options as SwcOptions, transform } from "@swc/core";
+import { fileURLToPath } from "node:url";
 import { REFRESH_REG, REFRESH_RUNTIME_SPECIFIER, REFRESH_SIG, shouldTransformForRefresh } from "./refresh-filter.js";
 
-export function gtkxSwcRefresh(): Plugin {
+const buildSwcOptions = (id: string): SwcOptions => {
+    const isTsx = id.endsWith(".tsx");
+    const isTs = id.endsWith(".ts") || isTsx;
+
+    return {
+        filename: id,
+        sourceFileName: id,
+        sourceMaps: true,
+        jsc: {
+            parser: isTs ? { syntax: "typescript", tsx: isTsx } : { syntax: "ecmascript", jsx: true },
+            transform: {
+                react: {
+                    runtime: "automatic",
+                    development: true,
+                    refresh: true,
+                },
+            },
+            target: "es2022",
+        },
+    };
+};
+
+const buildRefreshResult = (result: Output): { code: string; map?: string } =>
+    result.map === undefined ? { code: result.code } : { code: result.code, map: result.map };
+
+const injectRefreshRegistration = (
+    code: string,
+    id: string,
+    transformOptions: { ssr?: boolean | undefined } | undefined,
+): { code: string; map: null } | undefined => {
+    if (!shouldTransformForRefresh(id, transformOptions)) {
+        return;
+    }
+
+    if (!code.includes(REFRESH_REG) && !code.includes(REFRESH_SIG)) {
+        return;
+    }
+
+    const header = `
+import { createModuleRegistration as __createModuleRegistration__ } from "${REFRESH_RUNTIME_SPECIFIER}";
+const { ${REFRESH_REG}, ${REFRESH_SIG} } = __createModuleRegistration__(${JSON.stringify(id)});
+`;
+
+    return { code: header + code, map: null };
+};
+
+function gtkxSwcRefresh(): Plugin {
     return {
         name: "gtkx:swc-refresh",
         enforce: "pre",
@@ -14,66 +60,33 @@ export function gtkxSwcRefresh(): Plugin {
                 return;
             }
 
-            const isTsx = id.endsWith(".tsx");
-            const isTs = id.endsWith(".ts") || isTsx;
-
-            const swcOptions: SwcOptions = {
-                filename: id,
-                sourceFileName: id,
-                sourceMaps: true,
-                jsc: {
-                    parser: isTs ? { syntax: "typescript", tsx: isTsx } : { syntax: "ecmascript", jsx: true },
-                    transform: {
-                        react: {
-                            runtime: "automatic",
-                            development: true,
-                            refresh: true,
-                        },
-                    },
-                    target: "es2022",
-                },
-            };
-
-            const result = await transform(code, swcOptions);
+            const result = await transform(code, buildSwcOptions(id));
 
-            return result.map === undefined ? { code: result.code } : { code: result.code, map: result.map };
+            return buildRefreshResult(result);
         },
     };
 }
 
-export function gtkxRefreshRuntime(): Plugin {
+function gtkxRefreshRuntime(): Plugin {
     return {
         name: "gtkx:refresh-runtime",
         enforce: "post",
         apply: "serve",
 
         resolveId(id) {
-            if (id !== REFRESH_RUNTIME_SPECIFIER) return undefined;
-            return fileURLToPath(import.meta.resolve(REFRESH_RUNTIME_SPECIFIER));
-        },
-
-        transform(code, id, transformOptions) {
-            if (!shouldTransformForRefresh(id, transformOptions)) {
-                return;
-            }
-
-            if (!code.includes(REFRESH_REG) && !code.includes(REFRESH_SIG)) {
+            if (id !== REFRESH_RUNTIME_SPECIFIER) {
                 return;
             }
 
-            const moduleIdJson = JSON.stringify(id);
-
-            const header = `
-import { createModuleRegistration as __createModuleRegistration__ } from "${REFRESH_RUNTIME_SPECIFIER}";
-const { ${REFRESH_REG}, ${REFRESH_SIG} } = __createModuleRegistration__(${moduleIdJson});
-`;
+            return fileURLToPath(import.meta.resolve(REFRESH_RUNTIME_SPECIFIER));
+        },
 
-            return {
-                code: header + code,
-                map: null,
-            };
+        transform(code, id, transformOptions) {
+            return injectRefreshRegistration(code, id, transformOptions);
         },
     };
 }
 
-export const gtkxFastRefresh = (): Plugin[] => [gtkxSwcRefresh(), gtkxRefreshRuntime()];
+const gtkxFastRefresh = (): Plugin[] => [gtkxSwcRefresh(), gtkxRefreshRuntime()];
+
+export { gtkxSwcRefresh, gtkxRefreshRuntime, gtkxFastRefresh };

package/src/vite-plugins/icons.ts

@@ -1,28 +1,49 @@
+import type { Plugin, UserConfig } from "vite";
+import { info } from "@gtkx/utils";
 import { readFileSync } from "node:fs";
 import { join } from "node:path";
-import { info } from "@gtkx/utils";
-import type { Plugin, UserConfig } from "vite";
 import { prependBanner } from "../internal/banner.js";
 import { resolveDataDir } from "../internal/data-dir.js";
 import { type ListedFile, listFilesRecursive } from "../internal/list-files.js";
 
+type PluginState = {
+    iconsDir: string | null;
+};
+
+type PluginContext = {
+    emitFile: (file: { type: "asset"; fileName: string; source: Buffer }) => void;
+};
+
 const ICONS_DIR = "icons";
 
 const XDG_ENV_BANNER = [
-    `process.env.XDG_DATA_DIRS = [`,
-    `    decodeURIComponent(new URL(".", import.meta.url).pathname),`,
-    `    process.env.XDG_DATA_DIRS || "/usr/local/share:/usr/share",`,
-    `].join(":");`,
+    "process.env.XDG_DATA_DIRS = [",
+    "    decodeURIComponent(new URL(\".\", import.meta.url).pathname),",
+    "    process.env.XDG_DATA_DIRS || \"/usr/local/share:/usr/share\",",
+    "].join(\":\");",
 ].join("\n");
 
-type PluginState = {
-    iconsDir: string | null;
-};
-
 const findIconFiles = (iconsDir: string | null): ListedFile[] =>
     iconsDir === null ? [] : listFilesRecursive(iconsDir);
 
-export function gtkxIcons(): Plugin {
+const resolveIconsDir = (config: UserConfig): string | null => {
+    const root = config.root ?? process.cwd();
+    const dataDir = resolveDataDir(root);
+
+    return dataDir === null ? null : join(root, dataDir, ICONS_DIR);
+};
+
+const emitIcons = (ctx: PluginContext, icons: ListedFile[]): void => {
+    for (const { absPath, rel } of icons) {
+        ctx.emitFile({ type: "asset", fileName: join(ICONS_DIR, rel), source: readFileSync(absPath) });
+    }
+
+    if (icons.length > 0) {
+        info(`Copied ${String(icons.length)} icon(s) into ${ICONS_DIR}/`);
+    }
+};
+
+function gtkxIcons(): Plugin {
     const state: PluginState = {
         iconsDir: null,
     };
@@ -33,26 +54,21 @@ export function gtkxIcons(): Plugin {
         apply: "build",
 
         config(config: UserConfig) {
-            const root = config.root ?? process.cwd();
-            const dataDir = resolveDataDir(root);
-            state.iconsDir = dataDir === null ? null : join(root, dataDir, ICONS_DIR);
+            state.iconsDir = resolveIconsDir(config);
         },
 
         outputOptions(options) {
-            if (findIconFiles(state.iconsDir).length === 0) return;
+            if (findIconFiles(state.iconsDir).length === 0) {
+                return;
+            }
+
             return prependBanner(options, XDG_ENV_BANNER);
         },
 
         buildEnd() {
-            const icons = findIconFiles(state.iconsDir);
-            for (const { absPath, rel } of icons) {
-                this.emitFile({
-                    type: "asset",
-                    fileName: join(ICONS_DIR, rel),
-                    source: readFileSync(absPath),
-                });
-            }
-            if (icons.length > 0) info(`Copied ${icons.length} icon(s) into ${ICONS_DIR}/`);
+            emitIcons(this, findIconFiles(state.iconsDir));
         },
     };
 }
+
+export { gtkxIcons };

package/src/vite-plugins/index.ts

@@ -1,6 +1,6 @@
+import type { Plugin } from "vite";
 import { createConfigLoader } from "@gtkx/config/internal";
 import createConfigPlugin from "@gtkx/config/vite-plugin";
-import type { Plugin } from "vite";
 import { gtkxCss } from "./css.js";
 import { gtkxIcons } from "./icons.js";
 import { gtkxReactCompiler } from "./react-compiler.js";
@@ -8,8 +8,9 @@ import { gtkxResources } from "./resources.js";
 import { gtkxSettings } from "./settings.js";
 import { gtkxUndeclaredLibrary } from "./undeclared-library.js";
 
-export const gtkxVitePlugins = (mode?: string): Plugin[] => {
-    const loadConfig = createConfigLoader(mode !== undefined ? { mode } : {});
+const gtkxVitePlugins = (mode?: string): Plugin[] => {
+    const loadConfig = createConfigLoader(mode === undefined ? {} : { mode });
+
     return [
         createConfigPlugin({ name: "gtkx:config", loadConfig }),
         gtkxUndeclaredLibrary(mode),
@@ -20,3 +21,5 @@ export const gtkxVitePlugins = (mode?: string): Plugin[] => {
         gtkxReactCompiler(loadConfig),
     ];
 };
+
+export { gtkxVitePlugins };

package/src/vite-plugins/native.ts

@@ -1,25 +1,28 @@
+import type { Plugin } from "vite";
 import { existsSync, readFileSync } from "node:fs";
 import { createRequire } from "node:module";
 import { arch, platform } from "node:os";
 import { dirname, join } from "node:path";
-import type { Plugin } from "vite";
+import { stripQuery } from "./strip-query.js";
 
 const EMITTED_BINDING_SPECIFIER = "./gtkx.node";
 
 function resolveBinaryPath(projectRequire: ReturnType<typeof createRequire>, currentArch: string): string {
     const nativeRoot = dirname(projectRequire.resolve("@gtkx/native/package.json"));
     const localBinary = join(nativeRoot, `native.linux-${currentArch}-gnu.node`);
+
     return existsSync(localBinary) ? localBinary : projectRequire.resolve(`@gtkx/native-linux-${currentArch}-gnu`);
 }
 
 function resolvePlatformBinary(projectRequire: ReturnType<typeof createRequire>): Buffer {
     const currentPlatform = platform();
-    const currentArch = arch();
 
     if (currentPlatform !== "linux") {
         throw new Error(`Unsupported build platform: ${currentPlatform}, only Linux is supported`);
     }
 
+    const currentArch = arch();
+
     if (currentArch !== "x64" && currentArch !== "arm64") {
         throw new Error(`Unsupported build architecture: ${currentArch}, only x64 and arm64 are supported`);
     }
@@ -29,28 +32,32 @@ function resolvePlatformBinary(projectRequire: ReturnType<typeof createRequire>)
 
 function rewriteLoader(code: string): string {
     const idents: string[] = [];
+
     for (const match of code.matchAll(/export\s*\{\s*([A-Za-z0-9_$]+)\s*\}/g)) {
         const ident = match[1];
+
         if (ident) {
             idents.push(ident);
         }
     }
+
     const bindings = idents.join(", ");
 
     return [
-        `import { createRequire as __gtkxCreateRequire } from "node:module";`,
+        "import { createRequire as __gtkxCreateRequire } from \"node:module\";",
         `const __gtkxNative = __gtkxCreateRequire(import.meta.url)(${JSON.stringify(EMITTED_BINDING_SPECIFIER)});`,
         `const { ${bindings} } = __gtkxNative;`,
         `export { ${bindings} };`,
     ].join("\n");
 }
 
-export function gtkxNative(root: string): Plugin {
+function gtkxNative(root: string): Plugin {
     const projectRequire = createRequire(join(root, "package.json"));
     let cachedLoaderPath: string | undefined;
 
     const loaderPath = (): string => {
         cachedLoaderPath ??= join(dirname(projectRequire.resolve("@gtkx/native/package.json")), "index.js");
+
         return cachedLoaderPath;
     };
 
@@ -68,7 +75,9 @@ export function gtkxNative(root: string): Plugin {
         },
 
         transform(code, id) {
-            return id.replace(/\?.*$/, "") === loaderPath() ? rewriteLoader(code) : null;
+            return stripQuery(id) === loaderPath() ? rewriteLoader(code) : null;
         },
     };
 }
+
+export { gtkxNative };

package/src/vite-plugins/react-compiler.ts

@@ -1,32 +1,56 @@
-/// <reference path="../babel-modules.d.ts" />
+import type { ResolvedReactCompilerOptions } from "@gtkx/config";
+import type { Plugin, ResolvedConfig, UserConfig } from "vite";
 import { transformAsync } from "@babel/core";
 import babelPresetTypescriptNs from "@babel/preset-typescript";
-import type { ResolvedReactCompilerOptions } from "@gtkx/config";
 import { type ConfigLoader, createConfigLoader } from "@gtkx/config/internal";
 import babelPluginReactCompilerNs from "babel-plugin-react-compiler";
-import type { Plugin, ResolvedConfig, UserConfig } from "vite";
+
+type ReactCompilerState = {
+    root: string;
+    options: ResolvedReactCompilerOptions | null;
+};
 
 const babelPresetTypescript = babelPresetTypescriptNs.default ?? babelPresetTypescriptNs;
 const babelPluginReactCompiler = babelPluginReactCompilerNs.default ?? babelPluginReactCompilerNs;
-
 const SOURCE_EXTENSION = /\.[jt]sx?$/;
 const TYPESCRIPT_EXTENSION = /\.tsx?$/;
-const TYPE_ONLY_EXTENSION = /\.ts$/;
 const NODE_MODULES = /(?:^|\/)node_modules\//;
 
-type ReactCompilerState = {
-    root: string;
-    options: ResolvedReactCompilerOptions | null;
-};
-
 const isProjectSource = (root: string, id: string): boolean => {
-    if (!SOURCE_EXTENSION.test(id)) return false;
-    if (NODE_MODULES.test(id)) return false;
-    if (root !== "" && !id.startsWith(`${root}/`)) return false;
+    if (!SOURCE_EXTENSION.test(id)) {
+        return false;
+    }
+
+    if (NODE_MODULES.test(id)) {
+        return false;
+    }
+
+    if (root !== "" && !id.startsWith(`${root}/`)) {
+        return false;
+    }
+
     return true;
 };
 
-export function gtkxReactCompiler(loadConfig: ConfigLoader = createConfigLoader()): Plugin {
+const compileSource = async (code: string, id: string, options: ResolvedReactCompilerOptions) => {
+    const result = await transformAsync(code, {
+        filename: id,
+        babelrc: false,
+        configFile: false,
+        sourceMaps: true,
+        parserOpts: { plugins: id.endsWith(".ts") ? [] : ["jsx"] },
+        presets: TYPESCRIPT_EXTENSION.test(id) ? [babelPresetTypescript] : [],
+        plugins: [[babelPluginReactCompiler, options]],
+    });
+
+    if (!result?.code) {
+        return;
+    }
+
+    return result.map == null ? { code: result.code } : { code: result.code, map: JSON.stringify(result.map) };
+};
+
+function gtkxReactCompiler(loadConfig: ConfigLoader = createConfigLoader()): Plugin {
     const state: ReactCompilerState = {
         root: "",
         options: null,
@@ -37,7 +61,8 @@ export function gtkxReactCompiler(loadConfig: ConfigLoader = createConfigLoader(
         enforce: "pre",
 
         async config(config: UserConfig) {
-            state.options = (await loadConfig(config.root ?? process.cwd())).reactCompiler;
+            const resolved = await loadConfig(config.root ?? process.cwd());
+            state.options = resolved.reactCompiler;
         },
 
         configResolved(config: ResolvedConfig) {
@@ -46,25 +71,14 @@ export function gtkxReactCompiler(loadConfig: ConfigLoader = createConfigLoader(
 
         async transform(code, id) {
             const options = state.options;
-            if (options === null || !isProjectSource(state.root, id)) {
-                return;
-            }
 
-            const result = await transformAsync(code, {
-                filename: id,
-                babelrc: false,
-                configFile: false,
-                sourceMaps: true,
-                parserOpts: { plugins: TYPE_ONLY_EXTENSION.test(id) ? [] : ["jsx"] },
-                presets: TYPESCRIPT_EXTENSION.test(id) ? [babelPresetTypescript] : [],
-                plugins: [[babelPluginReactCompiler, options]],
-            });
-
-            if (!result?.code) {
+            if (options === null || !isProjectSource(state.root, id)) {
                 return;
             }
 
-            return result.map == null ? { code: result.code } : { code: result.code, map: JSON.stringify(result.map) };
+            return compileSource(code, id, options);
         },
     };
 }
+
+export { gtkxReactCompiler };

package/src/vite-plugins/react-dom-prebundle.ts

@@ -1,10 +1,11 @@
 import type { Plugin } from "vite";
 
-export const gtkxReactDomPrebundle = (): Plugin => ({
+const gtkxReactDomPrebundle = (): Plugin => ({
     name: "gtkx:react-dom-prebundle",
     enforce: "post",
     config(config) {
         config.optimizeDeps ??= {};
+
         if (config.optimizeDeps.include) {
             config.optimizeDeps.include = config.optimizeDeps.include.filter(
                 (dep) => dep !== "react-dom" && !dep.startsWith("react-dom/"),
@@ -12,3 +13,5 @@ export const gtkxReactDomPrebundle = (): Plugin => ({
         }
     },
 });
+
+export { gtkxReactDomPrebundle };