@budsbox/builder_vite 2.0.0 → 2.1.1

package/dist/lib.d.ts

@@ -1,31 +1,7 @@
-import type { Awaitable, Undef } from '@budsbox/lib-types';
-import { type ConfigEnv, type LibraryOptions, type UserConfig, type UserConfigExport, type UserConfigFnPromise } from 'vite';
-/**
- * Represents a custom user configuration function used to generate Vite configuration.
- *
- * @typeParam TOptions - The type of the custom options object, with a default to `object`.
- * @param viteEnv - A readonly object representing the Vite configuration environment.
- * @param options - An optional readonly object representing additional custom configuration options.
- * @returns A promise or value containing the generated Vite user configuration.
- */
-export type CustomUserConfigFn<TOptions extends object = object> = (viteEnv: Readonly<ConfigEnv>, options?: Undef<Readonly<TOptions>>) => Awaitable<UserConfig>;
-/**
- * A `ConfigFactory` is a function type that generates an asynchronous Vite's configuration object generator function.
- *
- * @param custom - An optional custom configuration of type `UserConfigExport`. It can be used
- * to override or extend default configurations.
- * @returns A function to be invoked by Vite to generate the final configuration object.
- */
-export type ConfigFactory = (custom?: UserConfigExport) => UserConfigFnPromise;
-/**
- * A `ConfigFactory` is a function type that generates an asynchronous Vite's configuration object generator function.
- *
- * @param custom - An optional custom configuration of type `UserConfigExport`. It can be used
- * to override or extend default configurations.
- * @param options - An optional object containing additional configuration options, specific to the factory.
- * @returns A function to be invoked by Vite to generate the final configuration object.
- */
-export type ConfigFactoryWithOptions<TOptions extends object> = (custom?: UserConfigExport, options?: Readonly<Partial<TOptions>>) => UserConfigFnPromise;
+import type { PackageJson } from 'type-fest';
+import type { ResolvedJson } from '@budsbox/lib-node/pckg';
+import type { ConfigFactoryWithOptions, CustomUserConfigFn, ScopedNameGenerator } from './types.js';
+import { type LibraryOptions, type UserConfigExport, type UserConfigFnPromise } from 'vite';
 /**
  * Creates a configuration factory that extends or modifies a base configuration.
  *
@@ -58,4 +34,16 @@ export declare const formatVarName: (packageName: string) => string;
  *          where the extension is either `mjs` for `es` format or `cjs` for other formats.
  */
 export declare const formatFileName: Exclude<LibraryOptions['fileName'], string | undefined>;
+/**
+ * Factory function for creating a `ScopedNameGenerator` that generates scoped,
+ * unique CSS class names based on file paths, package details, and additional rules.
+ *
+ * @param basePackage - The resolved package.json of the base package as a read-only object.
+ *   This package serves as the reference point for relative path calculations and scoping.
+ * @param excludePathChunks - An optional array of path chunks to exclude from being used in
+ *   generated scoped names. Defaults to ['src', 'dist', 'build', 'node_modules'].
+ * @returns A `ScopedNameGenerator` function that takes a local CSS class name and a file path
+ *   as input and returns a generated scoped name.
+ */
+export declare const generateScopedNameFactory: (basePackage: Readonly<ResolvedJson<PackageJson>>, excludePathChunks?: readonly string[]) => ScopedNameGenerator;
 //# sourceMappingURL=lib.d.ts.map

package/dist/lib.js

@@ -1,7 +1,12 @@
+import { readFileSync } from 'node:fs';
+import { basename, dirname, relative } from 'node:path';
+import cssesc from 'cssesc';
 import { mergeConfig, } from 'vite';
-import { isFunction, isNotNil } from '@budsbox/lib-es/guards';
+import { createCachedFn } from '@budsbox/lib-es/function';
+import { isFunction, isNil, isNotNil, isString } from '@budsbox/lib-es/guards';
 import { fif } from '@budsbox/lib-es/logical';
-import { camelCase, parsePackageName } from '@budsbox/lib-es/string';
+import { camelCase, parsePackageName, splitPath } from '@budsbox/lib-es/string';
+import { lookupFileSync } from '@budsbox/lib-node/fs';
 export function createConfigFactory(base) {
     return (custom, options) => async (env) => {
         const resolvedBase = await fif(await base, isFunction, (baseFn) => baseFn(env, options), (baseObj) => baseObj);
@@ -35,4 +40,78 @@ export const formatVarName = (packageName) => {
  *          where the extension is either `mjs` for `es` format or `cjs` for other formats.
  */
 export const formatFileName = (format, entryName) => `${entryName}.${format === 'es' ? 'mjs' : 'cjs'}`;
+/**
+ * Factory function for creating a `ScopedNameGenerator` that generates scoped,
+ * unique CSS class names based on file paths, package details, and additional rules.
+ *
+ * @param basePackage - The resolved package.json of the base package as a read-only object.
+ *   This package serves as the reference point for relative path calculations and scoping.
+ * @param excludePathChunks - An optional array of path chunks to exclude from being used in
+ *   generated scoped names. Defaults to ['src', 'dist', 'build', 'node_modules'].
+ * @returns A `ScopedNameGenerator` function that takes a local CSS class name and a file path
+ *   as input and returns a generated scoped name.
+ */
+export const generateScopedNameFactory = (basePackage, excludePathChunks = [
+    'src',
+    'dist',
+    'build',
+    'node_modules',
+]) => {
+    const excludeSet = new Set(excludePathChunks);
+    const { scope: baseScope } = parsePackageName(basePackage.json.name ?? 'anon', true);
+    const lookupCache = new Map();
+    const packageCache = new Map();
+    const scopedNameCache = new Map();
+    const scopedNameGenerator = (localName, filepath) => {
+        const foundPath = lookupFileSync({
+            startDir: dirname(filepath),
+            filename: 'package.json',
+            cache: lookupCache,
+        });
+        let pckgPrefix = '';
+        if (isString(foundPath)) {
+            if (foundPath !== basePackage.path) {
+                const pckg = readPackageJson(packageCache, foundPath);
+                const { scope, name } = parsePackageName(pckg.name ?? '', true);
+                pckgPrefix =
+                    scope === baseScope || isNil(scope) ? name : `${scope}_-_${name}`;
+            }
+        }
+        else {
+            pckgPrefix = '-standalone-';
+        }
+        const subPath = relative(dirname(foundPath ?? basePackage.path), filepath);
+        const pathPart = splitPath(dirname(subPath))
+            .map((chunk) => (chunk === '..' ? '_--_' : chunk))
+            .filter((chunk) => !excludeSet.has(chunk))
+            .join('-');
+        const nameChunks = basename(filepath)
+            .split('.')
+            // remove extension
+            .slice(0, -1);
+        // remove `module` sub-extension
+        if (nameChunks.at(-1) === 'module') {
+            nameChunks.pop();
+        }
+        // remove common filename
+        if (nameChunks.at(-1) === 'style') {
+            nameChunks.pop();
+        }
+        return cssesc([
+            pckgPrefix,
+            [pathPart, nameChunks.join('-')].filter(Boolean).join('_'),
+            localName,
+        ]
+            .filter(Boolean)
+            .join('__'));
+    };
+    const cached = createCachedFn(scopedNameGenerator, (...args) => args.join(':'));
+    const generateScopedName = (localName, filepath) => cached(scopedNameCache, localName, filepath);
+    return generateScopedName;
+};
+const readPackageJson = createCachedFn((path) => {
+    if (!path.endsWith('package.json'))
+        throw new Error(`Not a package.json path: ${path}`);
+    return JSON.parse(readFileSync(path, 'utf-8'));
+});
 //# sourceMappingURL=lib.js.map

package/dist/plain.d.ts

@@ -1,3 +1,20 @@
+import { type PluginOptions } from 'vite-plugin-react-rich-svg';
+/**
+ * Extended configuration options for the `vite-plugin-react-rich-svg` plugin.
+ *
+ * @see https://github.com/iGoodie/vite-plugin-react-rich-svg?tab=readme-ov-file#plugin-configurations
+ */
+export interface CustomReactRichSvgOptions extends PluginOptions {
+    /**
+     * Enables/disables SVGO optimization for the whole plugin.
+     * Defaults to `true` when `NODE_ENV` is `production`. May be overridden by sub-options (like `rawLoaderOptions.svgoEnabled`).
+     */
+    svgoEnabled?: boolean;
+    /**
+     * Default SVGO configuration for the whole plugin.
+     */
+    svgoConfig?: NonNullable<PluginOptions['rawLoaderOptions']>['svgoConfig'];
+}
 /**
  * Represents configuration options for plain configurations.
  */
@@ -12,14 +29,16 @@ export interface PlainConfigOptions {
     lib?: boolean;
     /**
      * An array of strings representing the chunks to exclude from the path part when generating scoped names for CSS modules.
-     *
-     * @default ['src']
      */
     generateScopedNameExcludedPathChunks?: readonly string[];
     /**
      * Whether to add the scope of the package to the conditions for module `exports` resolution.
      */
     addScopeToConditions?: boolean;
+    /**
+     * Options for the `vite-plugin-react-rich-svg` plugin.
+     */
+    reactRichSvgOptions?: CustomReactRichSvgOptions;
 }
-export declare const usePlainConfig: import("./lib.js").ConfigFactoryWithOptions<PlainConfigOptions>;
+export declare const usePlainConfig: import("./types.js").ConfigFactoryWithOptions<PlainConfigOptions>;
 //# sourceMappingURL=plain.d.ts.map

package/dist/plain.js

@@ -1,75 +1,58 @@
-import { readFileSync } from 'node:fs';
-import { basename, dirname, relative } from 'node:path';
-import cssesc from 'cssesc';
+import { env } from 'node:process';
 import { NodePackageImporter } from 'sass-embedded';
 import { defaultClientConditions } from 'vite';
-import { createCachedFn } from '@budsbox/lib-es/function';
-import { isNil, isNotNil, isString } from '@budsbox/lib-es/guards';
+import richSvg from 'vite-plugin-react-rich-svg';
+import { isNotNil } from '@budsbox/lib-es/guards';
 import { fifs } from '@budsbox/lib-es/logical';
-import { parsePackageName, splitPath } from '@budsbox/lib-es/string';
-import { lookupFileSync } from '@budsbox/lib-node/fs';
+import { parsePackageName } from '@budsbox/lib-es/string';
 import { findCurrentPackageJson } from '@budsbox/lib-node/pckg';
 import packageJson from '#package.json' with { type: 'json' };
-import { createConfigFactory, formatFileName, formatVarName } from './lib.js';
-const readPackageJson = createCachedFn((path) => {
-    if (!path.endsWith('package.json'))
-        throw new Error(`Not a package.json path: ${path}`);
-    return JSON.parse(readFileSync(path, 'utf-8'));
-});
-export const usePlainConfig = createConfigFactory(async ({ mode }, { importMeta, lib = false, generateScopedNameExcludedPathChunks = ['src'], addScopeToConditions = false, } = {}) => {
-    const runnerPackage = await findCurrentPackageJson(importMeta);
-    const { scope: runnerScope } = parsePackageName(runnerPackage.json.name ?? 'anon', true);
-    const lookupCache = new Map();
-    const packageCache = new Map();
-    const excludeChunks = new Set(generateScopedNameExcludedPathChunks);
+import { createConfigFactory, formatFileName, formatVarName, generateScopedNameFactory, } from './lib.js';
+export const usePlainConfig = createConfigFactory(async ({ mode }, { importMeta, lib = false, generateScopedNameExcludedPathChunks, addScopeToConditions = false, 
+// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+reactRichSvgOptions = {}, } = {}) => {
+    const basePackage = await findCurrentPackageJson(importMeta);
+    const { scope: baseScope } = parsePackageName(basePackage.json.name ?? 'anon', true);
     const clientConditions = ((addScopeToConditions ||
         // enabled by default in this monorepo
-        sameScope(packageJson, runnerPackage.json)) &&
-        isNotNil(runnerScope)) ?
-        [runnerScope, ...defaultClientConditions]
+        sameScope(packageJson, basePackage.json)) &&
+        isNotNil(baseScope)) ?
+        [baseScope, ...defaultClientConditions]
         : [...defaultClientConditions];
-    const generateScopedName = createCachedFn((localName, filepath) => {
-        const foundPath = lookupFileSync({
-            startDir: dirname(filepath),
-            filename: 'package.json',
-            cache: lookupCache,
-        });
-        let pckgPrefix = '';
-        if (isString(foundPath)) {
-            if (foundPath !== runnerPackage.path) {
-                const pckg = readPackageJson(packageCache, foundPath);
-                const { scope, name } = parsePackageName(pckg.name ?? '', true);
-                pckgPrefix =
-                    scope === runnerScope || isNil(scope) ?
-                        name
-                        : `${scope}_-_${name}`;
-            }
-        }
-        else {
-            pckgPrefix = '-standalone-';
-        }
-        const subPath = relative(dirname(foundPath ?? runnerPackage.path), filepath);
-        const pathPart = splitPath(dirname(subPath))
-            .map((chunk) => (chunk === '..' ? '_--_' : chunk))
-            .filter((chunk) => !excludeChunks.has(chunk))
-            .join('-');
-        const nameChunks = basename(filepath).split('.').slice(0, -1);
-        if (nameChunks.at(-1) === 'module') {
-            nameChunks.pop();
-        }
-        if (nameChunks.at(-1) === 'style') {
-            nameChunks.pop();
-        }
-        return cssesc([
-            pckgPrefix,
-            [pathPart, nameChunks.join('-')].filter(Boolean).join('_'),
-            localName,
-        ]
-            .filter(Boolean)
-            .join('__'));
-    }, (...args) => args.join(':'));
-    const scopedNameCache = new Map();
+    const svgoEnabled = reactRichSvgOptions.svgoEnabled ?? env.NODE_ENV === 'production';
+    const svgoConfig = reactRichSvgOptions.svgoConfig ?? {};
     return {
+        plugins: [
+            richSvg({
+                ...reactRichSvgOptions,
+                base64LoaderOptions: {
+                    svgoEnabled,
+                    svgoConfig,
+                    ...reactRichSvgOptions.base64LoaderOptions,
+                },
+                componentLoaderOptions: {
+                    ...reactRichSvgOptions.componentLoaderOptions,
+                    svgrConfig: {
+                        svgo: svgoEnabled,
+                        svgoConfig,
+                        ...reactRichSvgOptions.componentLoaderOptions?.svgrConfig,
+                    },
+                },
+                rawLoaderOptions: {
+                    svgoEnabled,
+                    svgoConfig,
+                    ...reactRichSvgOptions.rawLoaderOptions,
+                },
+                urlLoaderOptions: {
+                    svgoEnabled,
+                    svgoConfig,
+                    ...reactRichSvgOptions.urlLoaderOptions,
+                },
+            }),
+        ],
+        resolve: {
+            conditions: clientConditions,
+        },
         root: 'src',
         build: {
             outDir: '../dist',
@@ -77,19 +60,16 @@ export const usePlainConfig = createConfigFactory(async ({ mode }, { importMeta,
             ...fifs(lib, {
                 lib: {
                     entry: 'index.ts',
-                    name: formatVarName(runnerPackage.json.name ?? '_anon_'),
+                    name: formatVarName(basePackage.json.name ?? '_anon_'),
                     fileName: formatFileName,
                     cssFileName: 'index',
                 },
             }),
         },
-        resolve: {
-            conditions: clientConditions,
-        },
         css: {
             modules: {
                 localsConvention: 'camelCaseOnly',
-                generateScopedName: mode === 'production' ? '[hash:hex]' : ((localName, filepath) => generateScopedName(scopedNameCache, localName, filepath)),
+                generateScopedName: mode === 'production' ? '[hash:hex]' : (generateScopedNameFactory(basePackage, generateScopedNameExcludedPathChunks)),
             },
             preprocessorOptions: {
                 scss: {

package/dist/react.d.ts

@@ -4,5 +4,5 @@ import { type PlainConfigOptions } from './plain.js';
  */
 export interface ReactConfigOptions extends PlainConfigOptions {
 }
-export declare const useReactConfig: import("./lib.js").ConfigFactoryWithOptions<ReactConfigOptions>;
+export declare const useReactConfig: import("./types.js").ConfigFactoryWithOptions<ReactConfigOptions>;
 //# sourceMappingURL=react.d.ts.map

package/dist/types.d.ts

@@ -0,0 +1,38 @@
+import type { ConfigEnv, UserConfig, UserConfigExport, UserConfigFnPromise } from 'vite';
+import type { Awaitable, Undef } from '@budsbox/lib-types';
+/**
+ * Represents a custom user configuration function used to generate Vite configuration.
+ *
+ * @typeParam TOptions - The type of the custom options object, with a default to `object`.
+ * @param viteEnv - A readonly object representing the Vite configuration environment.
+ * @param options - An optional readonly object representing additional custom configuration options.
+ * @returns A promise or value containing the generated Vite user configuration.
+ */
+export type CustomUserConfigFn<TOptions extends object = object> = (viteEnv: Readonly<ConfigEnv>, options?: Undef<Readonly<TOptions>>) => Awaitable<UserConfig>;
+/**
+ * A `ConfigFactory` is a function type that generates an asynchronous Vite's configuration object generator function.
+ *
+ * @param custom - An optional custom configuration of type `UserConfigExport`. It can be used
+ * to override or extend default configurations.
+ * @returns A function to be invoked by Vite to generate the final configuration object.
+ */
+export type ConfigFactory = (custom?: UserConfigExport) => UserConfigFnPromise;
+/**
+ * A `ConfigFactory` is a function type that generates an asynchronous Vite's configuration object generator function.
+ *
+ * @param custom - An optional custom configuration of type `UserConfigExport`. It can be used
+ * to override or extend default configurations.
+ * @param options - An optional object containing additional configuration options, specific to the factory.
+ * @returns A function to be invoked by Vite to generate the final configuration object.
+ */
+export type ConfigFactoryWithOptions<TOptions extends object> = (custom?: UserConfigExport, options?: Readonly<Partial<TOptions>>) => UserConfigFnPromise;
+/**
+ * A type definition for a function that generates a scoped class name for a given input.
+ * This is used in CSS module transformations.
+ *
+ * @param localName - The local name of the class or element.
+ * @param filename - The filename of the source file.
+ * @returns A scoped class name.
+ */
+export type ScopedNameGenerator = (this: void, localName: string, filename: string) => string;
+//# sourceMappingURL=types.d.ts.map

package/dist/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@budsbox/builder_vite",
-  "version": "2.0.0",
+  "version": "2.1.1",
   "homepage": "https://gitlab.com/budsbox/fe/seed",
   "bugs": {
     "url": "https://gitlab.com/budsbox/fe/seed/-/issues"
@@ -10,13 +10,19 @@
   "author": "Konstantin Kutsyllo <trikadin@pm.me>",
   "type": "module",
   "imports": {
-    "#package.json": "./package.json"
+    "#package.json": "./package.json",
+    "#client": {
+      "types": "./client.d.ts"
+    }
   },
   "exports": {
     ".": {
       "import": "./dist/index.js",
       "types": "./dist/index.d.ts"
     },
+    "./client": {
+      "types": "./client.d.ts"
+    },
     "./package.json": "./package.json"
   },
   "files": [
@@ -29,17 +35,18 @@
   },
   "dependencies": {
     "@budsbox/lib-es": "^2.3.0",
-    "@budsbox/lib-node": "^1.1.0",
+    "@budsbox/lib-node": "^1.1.1",
     "@types/node": "^22.15.2",
     "cssesc": "^3.0.0",
+    "ts-deepmerge": "^7.0.3",
     "tslib": "^2.8.1",
     "type-fest": "^4.32.0"
   },
   "devDependencies": {
-    "@budsbox/eslint": "^1.2.0",
-    "@budsbox/eslint_presets-node-lib": "^1.0.4",
-    "@budsbox/eslint_presets-tools": "^1.0.4",
-    "@budsbox/lib-types": "^1.2.0",
+    "@budsbox/eslint": "^1.2.1",
+    "@budsbox/eslint_presets-node-lib": "^1.0.5",
+    "@budsbox/eslint_presets-tools": "^1.0.5",
+    "@budsbox/lib-types": "^1.3.0",
     "@budsbox/tsconfigs": "^4.3.1",
     "@types/cssesc": "^3",
     "@types/eslint": "^9.6.1",
@@ -48,13 +55,15 @@
     "eslint": "^9.26.0",
     "sass-embedded": "^1.92.1",
     "typescript": "^5.8.3",
-    "vite": "^7.1.5"
+    "vite": "^7.1.5",
+    "vite-plugin-react-rich-svg": "1.x"
   },
   "peerDependencies": {
     "@vitejs/plugin-react": "^5.0.3",
     "babel-plugin-react-compiler": "^19.1.0-rc.3",
     "sass-embedded": "^1.92.1",
-    "vite": "^7.1.5"
+    "vite": "^7.1.5",
+    "vite-plugin-react-rich-svg": "1.x"
   },
   "packageManager": "yarn@4.9.2"
 }