@sigx/lynx-plugin 0.4.0 → 0.4.1

package/dist/icons.js

@@ -0,0 +1,226 @@
+/**
+ * Icon-set integration for @sigx/lynx-icons.
+ *
+ * At plugin setup time this slice:
+ *
+ * 1. Loads `signalx.config.ts` and reads the `iconSets: [...]` field.
+ * 2. Statically scans every `.tsx` / `.jsx` / `.ts` / `.js` file under the
+ *    project root for `<Icon set="…" name="…" />` usages.
+ * 3. Dynamically imports each adapter package (e.g. `@sigx/lynx-icons-fa-free`)
+ *    and resolves the used glyphs to `{ codepoint, svg }` records.
+ * 4. Writes three generated files into `node_modules/.cache/sigx-lynx-icons/`
+ *    and aliases the `@sigx/lynx-icons/__codepoints` / `__svgs` / `__font-face.css`
+ *    subpath imports to them, so Rspack tree-shakes everything else away.
+ *
+ * v1 emits SVG-mode artefacts only. Font-mode (build-time TTF subsetting +
+ * base64-inlined @font-face) is a v1.1 follow-up; for now the generated
+ * font-face.css is empty.
+ *
+ * The scanner is a one-shot regex pass at plugin start — adding a new icon
+ * during `pnpm dev` requires a dev-server restart in v1. A real SWC-AST
+ * Rspack loader is the planned upgrade.
+ */
+import { createRequire } from 'node:module';
+import { promises as fs, existsSync } from 'node:fs';
+import { join } from 'node:path';
+import { pathToFileURL } from 'node:url';
+const SCAN_REGEX_SET_FIRST = /<Icon\s+[^>]*?\bset\s*=\s*["']([\w-]+)["'][^>]*?\bname\s*=\s*["']([\w-]+)["']/g;
+const SCAN_REGEX_NAME_FIRST = /<Icon\s+[^>]*?\bname\s*=\s*["']([\w-]+)["'][^>]*?\bset\s*=\s*["']([\w-]+)["']/g;
+/** Directories to skip when walking the project. */
+const SKIP_DIRS = new Set(['node_modules', 'dist', 'ios', 'android', 'Pods', '.git', '.cache', '.rspeedy']);
+/** File extensions worth scanning. */
+const SOURCE_EXT = /\.(?:tsx?|jsx?)$/;
+async function walkSourceFiles(root) {
+    const out = [];
+    async function walk(dir) {
+        let entries;
+        try {
+            entries = await fs.readdir(dir, { withFileTypes: true });
+        }
+        catch {
+            return;
+        }
+        await Promise.all(entries.map(async (entry) => {
+            if (entry.name.startsWith('.'))
+                return;
+            if (SKIP_DIRS.has(entry.name))
+                return;
+            const full = join(dir, entry.name);
+            if (entry.isDirectory())
+                return walk(full);
+            if (entry.isFile() && SOURCE_EXT.test(entry.name))
+                out.push(full);
+        }));
+    }
+    await walk(root);
+    return out;
+}
+function addUsage(used, set, name) {
+    let bucket = used.get(set);
+    if (!bucket) {
+        bucket = new Set();
+        used.set(set, bucket);
+    }
+    bucket.add(name);
+}
+/**
+ * Extract `<Icon set="…" name="…" />` (and the name-first variant) usages
+ * from a single source string. Exported for unit testing — the prod path
+ * calls this once per file from {@link scanProject}.
+ */
+export function scanContent(content) {
+    if (!content.includes('<Icon'))
+        return [];
+    const seen = new Set();
+    const out = [];
+    const push = (set, name) => {
+        const key = `${set}\0${name}`;
+        if (seen.has(key))
+            return;
+        seen.add(key);
+        out.push({ set, name });
+    };
+    for (const m of content.matchAll(SCAN_REGEX_SET_FIRST))
+        push(m[1], m[2]);
+    for (const m of content.matchAll(SCAN_REGEX_NAME_FIRST))
+        push(m[2], m[1]);
+    return out;
+}
+async function scanProject(cwd) {
+    const used = new Map();
+    const files = await walkSourceFiles(cwd);
+    await Promise.all(files.map(async (file) => {
+        const content = await fs.readFile(file, 'utf8').catch(() => '');
+        for (const { set, name } of scanContent(content))
+            addUsage(used, set, name);
+    }));
+    return used;
+}
+async function loadAdapter(cwd, source) {
+    try {
+        const cwdRequire = createRequire(join(cwd, 'noop.js'));
+        const adapterPath = cwdRequire.resolve(source);
+        // Wrap with file:// — Windows ESM rejects bare absolute paths in dynamic
+        // import(). Same pattern as packages/lynx-cli/src/prebuild.ts loadConfig.
+        const mod = (await import(pathToFileURL(adapterPath).href));
+        return mod.default ?? mod;
+    }
+    catch (err) {
+        // Adapter not installed — silently skip; consumer will see missing-icon placeholders.
+        if (process.env['SIGX_DEBUG_ICONS']) {
+            // eslint-disable-next-line no-console
+            console.warn(`[@sigx/lynx-plugin] icons: failed to load adapter "${source}":`, err);
+        }
+        return null;
+    }
+}
+function collectGlyphsForSet(adapter, setConfig, usedNames) {
+    const codepoints = {};
+    const svgs = {};
+    const stylesToTry = setConfig.styles ?? adapter.styles;
+    // v1 contract: codepoint and svg are MUTUALLY EXCLUSIVE per set so the
+    // runtime can pick a render strategy without ambiguity. v1 only ships
+    // SVG mode (no @font-face CSS generation yet), so we never emit
+    // codepoints — even when the adapter returns them. v1.1's font-mode work
+    // flips the switch by emitting codepoints + matching @font-face CSS for
+    // sets whose `mode` is 'font'.
+    const emitCodepoints = false;
+    for (const name of usedNames) {
+        let glyph = null;
+        for (const style of stylesToTry) {
+            glyph = adapter.getGlyph(style, name);
+            if (glyph)
+                break;
+        }
+        if (!glyph)
+            continue;
+        if (emitCodepoints && glyph.codepoint !== undefined) {
+            codepoints[name] = glyph.codepoint;
+        }
+        else {
+            svgs[name] = { svg: glyph.svg };
+        }
+    }
+    return { codepoints, svgs };
+}
+/**
+ * Wire `@sigx/lynx-icons` adapter packages declared in `signalx.config.ts`.
+ * Called from {@link pluginSigxLynx}'s `setup()` after the dev/asset patches.
+ */
+export async function applyIcons(api, opts = {}) {
+    const cwd = opts.cwd ?? process.cwd();
+    // Two layered concerns:
+    // 1. No config / lynx-cli not installed → silent no-op (genuine non-Lynx context).
+    // 2. Config exists but loadConfig / resolveConfig throws → surface the error so a
+    //    typo in iconSets (duplicate ids, unknown styles/modes) doesn't silently
+    //    swallow itself and leave the user wondering why icons render as placeholders.
+    const configCandidates = [
+        'signalx.config.ts',
+        'signalx.config.js',
+        'signalx.config.mjs',
+    ];
+    const hasConfig = configCandidates.some((f) => existsSync(join(cwd, f)));
+    if (!hasConfig)
+        return;
+    let cli;
+    try {
+        cli = (await import('@sigx/lynx-cli'));
+    }
+    catch {
+        // @sigx/lynx-cli is an optional peer dep; consumer outside a sigx-lynx app — skip.
+        return;
+    }
+    // From here errors are real (bad config / failed validation) — let them throw
+    // so the build fails loudly. eslint-disable + console.error keeps the message
+    // visible even when the throw is wrapped by rsbuild.
+    const raw = await cli.loadConfig(cwd);
+    const config = cli.resolveConfig(raw);
+    if (!config.iconSets || config.iconSets.length === 0)
+        return;
+    const used = await scanProject(cwd);
+    const codepointsMap = {};
+    const svgsMap = {};
+    for (const setConfig of config.iconSets) {
+        const adapter = await loadAdapter(cwd, setConfig.source);
+        if (!adapter)
+            continue;
+        const setUsed = new Set(used.get(setConfig.id) ?? []);
+        for (const forced of setConfig.include)
+            setUsed.add(forced);
+        // `include: ['*']` → ship the full glyph catalog for each configured
+        // style. Required for JSON-driven UIs where icon names are unknown
+        // at build time. Trade-off: bundle grows by hundreds of KB.
+        if (setConfig.include.includes('*')) {
+            setUsed.delete('*');
+            const stylesToTry = setConfig.styles ?? adapter.styles;
+            for (const style of stylesToTry) {
+                for (const name of adapter.listGlyphs(style))
+                    setUsed.add(name);
+            }
+            // eslint-disable-next-line no-console
+            console.log(`[@sigx/lynx-plugin] icons: ${setConfig.id} bundling ${setUsed.size} glyphs (include: ['*'])`);
+        }
+        if (setUsed.size === 0)
+            continue;
+        const { codepoints, svgs } = collectGlyphsForSet(adapter, setConfig, setUsed);
+        if (Object.keys(codepoints).length > 0)
+            codepointsMap[setConfig.id] = codepoints;
+        if (Object.keys(svgs).length > 0)
+            svgsMap[setConfig.id] = svgs;
+    }
+    // Persist generated modules into the project's pnpm cache dir.
+    const cacheDir = join(cwd, 'node_modules', '.cache', 'sigx-lynx-icons');
+    await fs.mkdir(cacheDir, { recursive: true });
+    const codepointsPath = join(cacheDir, 'codepoints.mjs');
+    const svgsPath = join(cacheDir, 'svgs.mjs');
+    const fontFacePath = join(cacheDir, 'font-face.css');
+    await fs.writeFile(codepointsPath, `// Auto-generated by @sigx/lynx-plugin — do not edit.\nexport const codepoints = ${JSON.stringify(codepointsMap)};\n`);
+    await fs.writeFile(svgsPath, `// Auto-generated by @sigx/lynx-plugin — do not edit.\nexport const svgs = ${JSON.stringify(svgsMap)};\n`);
+    await fs.writeFile(fontFacePath, '/* Auto-generated by @sigx/lynx-plugin — font mode lands in v1.1. */\n');
+    // Alias the three subpath imports to the generated files.
+    api.modifyBundlerChain((chain) => {
+        chain.resolve.alias.set('@sigx/lynx-icons/__codepoints', codepointsPath);
+        chain.resolve.alias.set('@sigx/lynx-icons/__svgs', svgsPath);
+        chain.resolve.alias.set('@sigx/lynx-icons/__font-face.css', fontFacePath);
+    });
+}

package/dist/index.d.ts

@@ -16,8 +16,8 @@
  * ```
  */
 import type { RsbuildPlugin } from '@rsbuild/core';
-import { applyEntry } from './entry';
-import { LAYERS } from './layers';
+import { applyEntry } from './entry.js';
+import { LAYERS } from './layers.js';
 export { LAYERS, applyEntry };
 /**
  * Options for {@link pluginSigxLynx}.