@db-ux/core-vite-plugin 4.12.1 → 4.13.0

package/CHANGELOG.md

@@ -1,5 +1,9 @@
 # @db-ux/core-vite-plugin
 
+## 4.13.0
+
+_version bump_
+
 ## 4.12.1
 
 _version bump_

package/build/detector.d.ts

@@ -1,9 +1,9 @@
 /**
  * Walk up the directory tree from `root` to locate a package path inside node_modules.
  * Handles monorepo hoisting where dependencies may live in a parent node_modules.
- * Returns the resolved absolute path or null if not found.
+ * Returns the resolved absolute path or `undefined` if not found.
  */
-export declare function resolvePackagePath(root: string, packagePath: string): string | null;
+export declare function resolvePackagePath(root: string, packagePath: string): string | undefined;
 /** Public accessor for the discovery cache. */
 export declare function discoverAll(root: string): {
     components: Set<string>;

package/build/detector.js

@@ -1,10 +1,10 @@
 import fg from 'fast-glob';
-import { readFileSync, readdirSync } from 'fs';
-import { resolve } from 'path';
+import { readFileSync, readdirSync } from 'node:fs';
+import { resolve } from 'node:path';
 /**
  * Walk up the directory tree from `root` to locate a package path inside node_modules.
  * Handles monorepo hoisting where dependencies may live in a parent node_modules.
- * Returns the resolved absolute path or null if not found.
+ * Returns the resolved absolute path or `undefined` if not found.
  */
 export function resolvePackagePath(root, packagePath) {
     let currentDir = root;
@@ -22,7 +22,7 @@ export function resolvePackagePath(root, packagePath) {
             break;
         currentDir = parentDir;
     }
-    return null;
+    return undefined;
 }
 /** Return subdirectory names (folders only) from the given path. */
 function readDirNames(dirPath) {
@@ -113,8 +113,8 @@ export function scanComponentDependencies(root, components, colors, densities, f
     }
 }
 /** Convert PascalCase to kebab-case: "NavigationItem" → "navigation-item". */
-function toKebabCase(str) {
-    return str.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
+function toKebabCase(string_) {
+    return string_.replaceAll(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
 }
 /**
  * Build an array of regex patterns to detect usage of design system values.
@@ -124,9 +124,9 @@ function toKebabCase(str) {
 function buildPatterns(classPrefix, dataAttr, values) {
     return [
         new RegExp(`${classPrefix}(${values})`, 'g'),
-        new RegExp(`\\[${dataAttr}=["']?(${values})["']?\\]`, 'g'),
+        new RegExp(String.raw `\[${dataAttr}=["']?(${values})["']?\]`, 'g'),
         new RegExp(`${dataAttr}=["'](${values})["']`, 'g'),
-        new RegExp(`["']${dataAttr}["']:\\s*["'](${values})["']`, 'g')
+        new RegExp(String.raw `["']${dataAttr}["']:\s*["'](${values})["']`, 'g')
     ];
 }
 /** Matches JSX/TSX component usage: <DBButton>, <DBNavigationItem> */
@@ -134,9 +134,9 @@ const JSX_COMPONENT_PATTERN = /<DB(\w+)[\s>/]/g;
 /** Matches Angular/HTML kebab-case usage: <db-button>, <db-navigation-item> */
 const KEBAB_COMPONENT_PATTERN = /<db-([\w-]+)[\s>/]/g;
 /** Matches CSS class-based usage: class="db-button ...", className="db-card" */
-const CLASS_COMPONENT_PATTERN = /(?:class|className)=(?:"[^"]*|'[^']*|\{[^}]*)db-([\w-]+)/g;
+const CLASS_COMPONENT_PATTERN = /(?:class|className)=(?:"[^"]*|'[^']*|{[^}]*)db-([\w-]+)/g;
 /** Matches named imports from @db-ux framework packages: import { DBButton, DBCard } from '...' */
-const IMPORT_PATTERN = /import\s+\{([^}]+)}\s+from\s+['"]@db-ux\/(?:react|ngx|v|wc)-core-components['"]/g;
+const IMPORT_PATTERN = /import\s+{([^}]+)}\s+from\s+['"]@db-ux\/(?:react|ngx|v|wc)-core-components['"]/g;
 /** Glob all source files from the project root, excluding node_modules/dist/build. */
 async function scanFiles(root) {
     return fg(['**/*.{vue,jsx,tsx,ts,html}'], {
@@ -151,7 +151,7 @@ function readSource(filePath) {
         return readFileSync(filePath, 'utf-8');
     }
     catch {
-        return null;
+        return undefined;
     }
 }
 /**
@@ -248,6 +248,6 @@ export async function detectFontSizes(root, forceInclude) {
     const validSet = new Set(validFontSizes);
     return detectByPatterns(root, forceInclude, 'db-font-size-', 'data-font-size', [`(${categories.join('|')})-(${sizes.join('|')})`], (match) => {
         const value = `${match[1]}-${match[2]}`;
-        return validSet.has(value) ? value : null;
+        return validSet.has(value) ? value : undefined;
     });
 }

package/build/generator.js

@@ -1,5 +1,5 @@
-import { readdirSync } from 'fs';
-import { resolve } from 'path';
+import { readdirSync } from 'node:fs';
+import { resolve } from 'node:path';
 /** Maps foundation feature names to their CSS file paths relative to build/styles/. */
 const FOUNDATION_IMPORTS = {
     helpers: 'helpers/classes/all.css',
@@ -54,7 +54,7 @@ function detectTheme(root, preferredTheme) {
             break;
         currentDir = parentDir;
     }
-    return null;
+    return undefined;
 }
 /**
  * Generate the CSS import statements based on detected/discovered values.
@@ -98,20 +98,17 @@ export function generateCSS(options) {
     }
     // Theme or default fallback
     if (theme) {
-        imports.push(`@import "${theme}/build/styles/rollup.css" layer(${themeName});`);
-        imports.push(`@import "@db-ux/core-foundations/build/styles/defaults/default-container-properties.css" layer(db-ux);`);
+        imports.push(`@import "${theme}/build/styles/rollup.css" layer(${themeName});`, `@import "@db-ux/core-foundations/build/styles/defaults/default-container-properties.css" layer(db-ux);`);
     }
     else {
-        imports.push(`@import "@db-ux/core-foundations/build/styles/theme/rollup.css" layer(db-ux);`);
-        imports.push(`@import "@db-ux/core-foundations/build/styles/fonts/rollup.css" layer(db-ux);`);
+        imports.push(`@import "@db-ux/core-foundations/build/styles/theme/rollup.css" layer(db-ux);`, `@import "@db-ux/core-foundations/build/styles/fonts/rollup.css" layer(db-ux);`);
     }
     // Tailwind theme
     if (hasTailwind) {
         imports.push(`@import "@db-ux/core-foundations/build/tailwind/theme/index.css";`);
     }
     // Required foundation styles
-    imports.push(`@import "@db-ux/core-foundations/build/styles/defaults/default-required.css" layer(db-ux);`);
-    imports.push(`@import "@db-ux/core-foundations/build/styles/defaults/default-root.css" layer(db-ux);`);
+    imports.push(`@import "@db-ux/core-foundations/build/styles/defaults/default-required.css" layer(db-ux);`, `@import "@db-ux/core-foundations/build/styles/defaults/default-root.css" layer(db-ux);`);
     // Optional foundation features
     for (const [key, path] of Object.entries(FOUNDATION_IMPORTS)) {
         const feature = key;

package/build/index.d.ts

@@ -8,4 +8,4 @@ import type { PluginConfig } from './types.js';
  * During build, only detected styles are included and unused ones are stripped.
  */
 export default function dbUxPlugin(config?: PluginConfig): any[];
-export type { PluginConfig };
+export { type PluginConfig } from './types.js';

package/build/index.js

@@ -1,5 +1,5 @@
-import { writeFile } from 'fs/promises';
-import { resolve } from 'path';
+import { writeFile } from 'node:fs/promises';
+import { resolve } from 'node:path';
 import { detectColors, detectComponents, detectDensities, detectFontSizes, discoverAll, scanComponentDependencies } from './detector.js';
 import { generateCSS } from './generator.js';
 import { removeUnusedStyles } from './optimizer.js';
@@ -35,8 +35,8 @@ export default function dbUxPlugin(config = {}) {
     let detectedDensities = new Set();
     let detectedFontSizes = new Set();
     let hasDetected = false;
-    let detectionPromise = null;
-    let cssModuleId = null;
+    let detectionPromise;
+    let cssModuleId;
     let hasTailwind = false;
     let root = process.cwd();
     let isBuild = false;
@@ -98,17 +98,17 @@ export default function dbUxPlugin(config = {}) {
                     root,
                     include: {
                         components: isBuild
-                            ? Array.from(detectedComponents)
-                            : Array.from(discovered.components),
+                            ? [...detectedComponents]
+                            : [...discovered.components],
                         foundations: include.foundations || [],
                         colors: isBuild
-                            ? Array.from(detectedColors)
+                            ? [...detectedColors]
                             : discovered.colors,
                         densities: isBuild
-                            ? Array.from(detectedDensities)
+                            ? [...detectedDensities]
                             : discovered.densities,
                         fontSizes: isBuild
-                            ? Array.from(detectedFontSizes)
+                            ? [...detectedFontSizes]
                             : discovered.fontSizes
                     },
                     exclude,
@@ -125,7 +125,7 @@ export default function dbUxPlugin(config = {}) {
                             .join('\n') +
                         '\n');
                 }
-                code = code.replace(/@import ["']@db-ux\/core-vite-plugin\/index\.css["'];?/g, css);
+                code = code.replaceAll(/@import ["']@db-ux\/core-vite-plugin\/index\.css["'];?/g, css);
             }
             return code;
         },
@@ -133,10 +133,10 @@ export default function dbUxPlugin(config = {}) {
             if (debug && hasDetected) {
                 const reportPath = resolve(root, 'db-ux-detection-report.json');
                 await writeFile(reportPath, JSON.stringify({
-                    components: Array.from(detectedComponents).sort(),
-                    colors: Array.from(detectedColors).sort(),
-                    densities: Array.from(detectedDensities).sort(),
-                    fontSizes: Array.from(detectedFontSizes).sort(),
+                    components: [...detectedComponents].sort(),
+                    colors: [...detectedColors].sort(),
+                    densities: [...detectedDensities].sort(),
+                    fontSizes: [...detectedFontSizes].sort(),
                     generatedImports
                 }, null, 2), 'utf-8');
             }
@@ -166,3 +166,4 @@ export default function dbUxPlugin(config = {}) {
     };
     return [mainPlugin, optimizerPlugin];
 }
+export {} from './types.js';

package/build/optimizer.d.ts

@@ -1,9 +1,9 @@
 /** All available values discovered from the filesystem, used to determine what is unused. */
-export interface OptimizerContext {
+export type OptimizerContext = {
     allColors: string[];
     allDensities: string[];
     allFontSizes: string[];
-}
+};
 /**
  * Remove unused CSS custom properties, @property declarations, and rule blocks
  * for colors, densities, and font sizes that were not detected in the project.

package/build/optimizer.js

@@ -8,28 +8,28 @@ export function removeUnusedStyles(css, detectedColors, detectedDensities, detec
     const unusedDensities = context.allDensities.filter((d) => !detectedDensities.has(d));
     const unusedFontSizes = context.allFontSizes.filter((f) => !detectedFontSizes.has(f));
     for (const color of unusedColors) {
-        css = css.replace(new RegExp(`@property --db-${color}-[a-z0-9-]+\\{[^}]+\\}`, 'g'), '');
+        css = css.replaceAll(new RegExp(String.raw `@property --db-${color}-[a-z0-9-]+\{[^}]+\}`, 'g'), '');
         // Make semicolon optional to handle last property in a block
-        css = css.replace(new RegExp(`--db-${color}-[a-z0-9-]+:[^;}]+;?`, 'g'), '');
+        css = css.replaceAll(new RegExp(`--db-${color}-[a-z0-9-]+:[^;}]+;?`, 'g'), '');
         // Normalize selectors — handle both quoted and unquoted data-color
-        css = css.replace(new RegExp(`\\[data-color=["']?${color}["']?\\],\\.db-color-${color}`, 'g'), `.db-color-${color}`);
-        css = css.replace(new RegExp(`\\.db-color-${color},\\[data-color=["']?${color}["']?\\]`, 'g'), `.db-color-${color}`);
+        css = css.replaceAll(new RegExp(String.raw `\[data-color=["']?${color}["']?\],\.db-color-${color}`, 'g'), `.db-color-${color}`);
+        css = css.replaceAll(new RegExp(String.raw `\.db-color-${color},\[data-color=["']?${color}["']?\]`, 'g'), `.db-color-${color}`);
         // Remove entire rule blocks including pseudo-classes
-        css = css.replace(new RegExp(`\\.db-color-${color}(?:[^{]*?)\\{[^}]+\\}`, 'g'), '');
+        css = css.replaceAll(new RegExp(String.raw `\.db-color-${color}(?:[^{]*?)\{[^}]+\}`, 'g'), '');
     }
     for (const density of unusedDensities) {
-        css = css.replace(new RegExp(`@property --db-[a-z-]+-${density}-[a-z0-9-]+\\{[^}]+\\}`, 'g'), '');
-        css = css.replace(new RegExp(`--db-[a-z-]+-${density}-[a-z0-9-]+:[^;}]+;?`, 'g'), '');
+        css = css.replaceAll(new RegExp(String.raw `@property --db-[a-z-]+-${density}-[a-z0-9-]+\{[^}]+\}`, 'g'), '');
+        css = css.replaceAll(new RegExp(`--db-[a-z-]+-${density}-[a-z0-9-]+:[^;}]+;?`, 'g'), '');
     }
     for (const fontSize of unusedFontSizes) {
         const [type, size] = fontSize.split('-');
-        css = css.replace(new RegExp(`--db-type-${fontSize}:[^;}]+;?`, 'g'), '');
-        css = css.replace(new RegExp(`--db-base-${type}-icon-weight-${size}:[^;}]+;?`, 'g'), '');
-        css = css.replace(new RegExp(`@property --db-base-icon-weight-[a-z]+-[a-z]+-${type}-${size}\\{[^}]+\\}`, 'g'), '');
-        css = css.replace(new RegExp(`@property --db-base-icon-font-size-[a-z]+-[a-z]+-${type}-${size}\\{[^}]+\\}`, 'g'), '');
-        css = css.replace(new RegExp(`@property --db-typography-[a-z]+-[a-z]+-${type}-${size}\\{[^}]+\\}`, 'g'), '');
+        css = css.replaceAll(new RegExp(`--db-type-${fontSize}:[^;}]+;?`, 'g'), '');
+        css = css.replaceAll(new RegExp(`--db-base-${type}-icon-weight-${size}:[^;}]+;?`, 'g'), '');
+        css = css.replaceAll(new RegExp(String.raw `@property --db-base-icon-weight-[a-z]+-[a-z]+-${type}-${size}\{[^}]+\}`, 'g'), '');
+        css = css.replaceAll(new RegExp(String.raw `@property --db-base-icon-font-size-[a-z]+-[a-z]+-${type}-${size}\{[^}]+\}`, 'g'), '');
+        css = css.replaceAll(new RegExp(String.raw `@property --db-typography-[a-z]+-[a-z]+-${type}-${size}\{[^}]+\}`, 'g'), '');
     }
-    css = css.replace(/@layer variables;/g, '');
-    css = css.replace(/@charset "UTF-8";/g, '');
+    css = css.replaceAll('@layer variables;', '');
+    css = css.replaceAll('@charset "UTF-8";', '');
     return css;
 }

package/build/types.d.ts

@@ -22,7 +22,7 @@ export type FontSize = 'body-3xs' | 'body-2xs' | 'body-xs' | 'body-sm' | 'body-m
 /**
  * Configuration options for the Vite plugin.
  */
-export interface PluginConfig {
+export type PluginConfig = {
     /**
      * Force include specific components, foundation features, color schemes, densities, or font sizes.
      */
@@ -70,12 +70,12 @@ export interface PluginConfig {
      * Generate detection report for debugging (default: false).
      */
     debug?: boolean;
-}
+};
 /**
  * Internal options passed to the CSS generator.
  */
-export interface GenerateOptions extends Pick<Required<PluginConfig>, 'include' | 'exclude'>, Pick<PluginConfig, 'theme' | 'additionalLayers' | 'overrideLayers'> {
+export type GenerateOptions = {
     /** Vite project root, used for resolving node_modules. */
     root: string;
     hasTailwind: boolean;
-}
+} & Pick<Required<PluginConfig>, 'include' | 'exclude'> & Pick<PluginConfig, 'theme' | 'additionalLayers' | 'overrideLayers'>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@db-ux/core-vite-plugin",
-  "version": "4.12.1",
+  "version": "4.13.0",
   "type": "module",
   "description": "Vite plugin for optimized DB UX Design System CSS imports",
   "repository": {
@@ -41,7 +41,7 @@
     "npm-run-all2": "9.0.2",
     "typescript": "5.9.3",
     "vite": "8.0.16",
-    "vitest": "4.1.8"
+    "vitest": "4.1.9"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",