@plumeria/vite-plugin 0.15.7 → 0.16.1

package/dist/create.d.ts

@@ -0,0 +1,5 @@
+import type { CSSProperties, CreateStyleType, CreateTheme, CreateValues } from 'zss-engine';
+declare function createCSS<T extends Record<string, CSSProperties>>(object: CreateStyleType<T>): string;
+declare const createVars: <const T extends CreateValues>(object: T) => Record<string, CreateValues>;
+declare const createTheme: <const T extends CreateTheme>(object: T) => Record<string, Record<string, string | number | object>>;
+export { createCSS, createVars, createTheme };

package/dist/create.js

@@ -0,0 +1,99 @@
+import { splitAtomicAndNested, processAtomicProps, genBase36Hash, transpile, } from 'zss-engine';
+function compileToSingleCSS(object) {
+    const baseSheets = [];
+    const querySheets = [];
+    const processedHashes = new Set();
+    Object.entries(object).forEach(([key, styleObj]) => {
+        const flat = {};
+        const nonFlat = {};
+        splitAtomicAndNested(styleObj, flat, nonFlat);
+        const records = [];
+        Object.entries(flat).forEach(([prop, value]) => {
+            const hashes = new Set();
+            const sheets = new Set();
+            processAtomicProps({ [prop]: value }, hashes, sheets);
+            const propBaseSheets = [];
+            const propQuerySheets = [];
+            for (const sheet of sheets) {
+                if (sheet.includes('@media') || sheet.includes('@container')) {
+                    propQuerySheets.push(sheet);
+                }
+                else {
+                    propBaseSheets.push(sheet);
+                }
+            }
+            const hash = [...hashes].join(' ');
+            const sheet = [...propBaseSheets, ...propQuerySheets].join('');
+            records.push({
+                key: prop,
+                hash,
+                sheet,
+            });
+        });
+        if (Object.keys(nonFlat).length > 0) {
+            const nonFlatObj = { [key]: nonFlat };
+            const nonFlatHash = genBase36Hash(nonFlatObj, 1, 7);
+            const { styleSheet } = transpile(nonFlatObj, nonFlatHash);
+            Object.entries(nonFlat).forEach(([atRule, nestedObj]) => {
+                Object.entries(nestedObj).forEach(([prop]) => {
+                    records.push({
+                        key: atRule + prop,
+                        hash: nonFlatHash,
+                        sheet: styleSheet,
+                    });
+                });
+            });
+        }
+        records.forEach(({ hash, sheet }) => {
+            if (!processedHashes.has(hash)) {
+                processedHashes.add(hash);
+                if (sheet.includes('@media') || sheet.includes('@container')) {
+                    querySheets.push(sheet);
+                }
+                else {
+                    baseSheets.push(sheet);
+                }
+            }
+        });
+    });
+    return [...baseSheets, ...querySheets].join('\n');
+}
+function createCSS(object) {
+    const result = {};
+    Object.entries(object).forEach(([key, styleObj]) => {
+        Object.defineProperty(result, key, {
+            get: () => Object.freeze(styleObj),
+        });
+    });
+    const compiledCSS = compileToSingleCSS(object);
+    return compiledCSS;
+}
+const createVars = (object) => {
+    const styles = {
+        ':root': {},
+    };
+    Object.entries(object).forEach(([key, value]) => {
+        styles[':root'][`--${key}`] = value;
+    });
+    styles;
+    return styles;
+};
+const createTheme = (object) => {
+    const styles = {};
+    Object.entries(object).forEach(([key, value]) => {
+        Object.entries(value).forEach(([subKey, subValue]) => {
+            if (subKey.startsWith('@media')) {
+                styles[':root'] ||= {};
+                styles[':root'][subKey] ||= {};
+                styles[':root'][subKey][`--${key}`] = subValue;
+            }
+            else {
+                const themeSelector = subKey === 'default' ? ':root' : `:root[data-theme="${subKey}"]`;
+                styles[themeSelector] ||= {};
+                styles[themeSelector][`--${key}`] = subValue;
+            }
+        });
+    });
+    return styles;
+};
+export { createCSS, createVars, createTheme };

package/dist/index.d.ts

@@ -1,2 +1,2 @@
 import type { Plugin } from 'vite';
-export default function plumeria(): Plugin;
+export declare function plumeria(): Plugin;

package/dist/index.js

@@ -1,6 +1,474 @@
-export default function plumeria() {
+import { parseSync, traverse, transformFromAstSync, } from '@babel/core';
+import * as t from '@babel/types';
+import path from 'path';
+import fs from 'fs';
+import { createCSS, createTheme, createVars } from './create';
+import { genBase36Hash, transpile, camelToKebabCase } from 'zss-engine';
+import { globSync } from '@rust-gear/glob';
+const PROJECT_ROOT = process.cwd().split('node_modules')[0];
+const PATTERN_PATH = path.join(PROJECT_ROOT, '**/*.{js,jsx,ts,tsx}');
+const GLOB_OPTIONS = {
+    exclude: ['**/node_modules/**', '**/dist/**', '**/build/**', '**/.next/**'],
+    cwd: PROJECT_ROOT,
+};
+let constTable = {};
+let variableTable = {};
+let themeTable = {};
+let keyframesHashTable = {};
+let keyframesObjectTable = {};
+let defineVarsObjectTable = {};
+let defineThemeObjectTable = {};
+function objectExpressionToObject(node, constTable, keyframesHashTable, variableTable, themeTable) {
+    const obj = {};
+    node.properties.forEach((prop) => {
+        if (!t.isObjectProperty(prop))
+            return;
+        const key = getPropertyKey(prop.key, constTable, variableTable);
+        if (!key)
+            return;
+        const val = prop.value;
+        if (t.isIdentifier(val) || t.isMemberExpression(val)) {
+            const resolvedKeyframe = resolveKeyframesTableMemberExpression(val, keyframesHashTable);
+            if (resolvedKeyframe !== undefined) {
+                obj[key] = resolvedKeyframe;
+                return;
+            }
+            const resolvedVariable = resolveVariableTableMemberExpressionByNode(val, variableTable);
+            if (resolvedVariable !== undefined) {
+                obj[key] = resolvedVariable;
+                return;
+            }
+            const resolvedTheme = resolveThemeTableMemberExpressionByNode(val, themeTable);
+            if (resolvedTheme !== undefined) {
+                obj[key] = resolvedTheme;
+                return;
+            }
+        }
+        if (t.isStringLiteral(val) ||
+            t.isNumericLiteral(val) ||
+            t.isBooleanLiteral(val)) {
+            obj[key] = val.value;
+        }
+        else if (t.isUnaryExpression(val)) {
+            obj[key] = evaluateUnaryExpression(val);
+        }
+        else if (t.isObjectExpression(val)) {
+            obj[key] = objectExpressionToObject(val, constTable, keyframesHashTable, variableTable, themeTable);
+        }
+        else if (t.isMemberExpression(val)) {
+            const resolved = resolveConstTableMemberExpression(val, constTable);
+            obj[key] = resolved !== undefined ? resolved : '[unresolved]';
+        }
+        else if (t.isIdentifier(val)) {
+            if (constTable[val.name] !== undefined) {
+                obj[key] = constTable[val.name];
+            }
+            else {
+                obj[key] = '[unresolved identifier]';
+            }
+        }
+        else {
+            obj[key] = '[unsupported value type]';
+        }
+    });
+    return obj;
+}
+function getPropertyKey(node, constTable, variableTable) {
+    if (t.isIdentifier(node)) {
+        if (constTable[node.name] && typeof constTable[node.name] === 'string') {
+            return constTable[node.name];
+        }
+        return node.name;
+    }
+    if (t.isStringLiteral(node))
+        return node.value;
+    if (t.isMemberExpression(node)) {
+        const result = resolveConstTableMemberExpression(node, constTable);
+        if (typeof result === 'string')
+            return result;
+        throw new Error(`Resolved key is not a string: ${JSON.stringify(result)}`);
+    }
+    if (t.isTemplateLiteral(node)) {
+        return evaluateTemplateLiteral(node, constTable, variableTable);
+    }
+    if (t.isBinaryExpression(node)) {
+        return evaluateBinaryExpression(node, constTable, variableTable);
+    }
+    throw new Error(`Unsupported property key type: ${node.type}`);
+}
+function evaluateTemplateLiteral(node, constTable, variableTable) {
+    let result = '';
+    for (let i = 0; i < node.quasis.length; i++) {
+        result += node.quasis[i].value.cooked || node.quasis[i].value.raw;
+        if (i < node.expressions.length) {
+            const expr = node.expressions[i];
+            const evaluatedExpr = evaluateExpression(expr, constTable, variableTable);
+            result += String(evaluatedExpr);
+        }
+    }
+    return result;
+}
+function evaluateBinaryExpression(node, constTable, variableTable) {
+    const left = evaluateExpression(node.left, constTable, variableTable);
+    const right = evaluateExpression(node.right, constTable, variableTable);
+    if (node.operator === '+') {
+        return String(left) + String(right);
+    }
+    throw new Error(`Unsupported binary operator: ${node.operator}`);
+}
+function evaluateExpression(node, constTable, variableTable) {
+    if (t.isStringLiteral(node))
+        return node.value;
+    if (t.isNumericLiteral(node))
+        return node.value;
+    if (t.isBooleanLiteral(node))
+        return node.value;
+    if (t.isNullLiteral(node))
+        return null;
+    if (t.isIdentifier(node)) {
+        if (constTable[node.name] !== undefined)
+            return constTable[node.name];
+        if (keyframesHashTable[node.name] !== undefined)
+            return keyframesHashTable[node.name];
+        return `[unresolved: ${node.name}]`;
+    }
+    if (t.isMemberExpression(node)) {
+        const resolved = resolveConstTableMemberExpression(node, constTable);
+        if (resolved !== undefined)
+            return resolved;
+        const resolvedVar = resolveVariableTableMemberExpressionByNode(node, variableTable);
+        if (resolvedVar !== undefined)
+            return resolvedVar;
+        const resolvedTheme = resolveThemeTableMemberExpressionByNode(node, themeTable);
+        if (resolvedTheme !== undefined)
+            return resolvedTheme;
+        return `[unresolved member expression]`;
+    }
+    if (t.isBinaryExpression(node))
+        return evaluateBinaryExpression(node, constTable, variableTable);
+    if (t.isTemplateLiteral(node))
+        return evaluateTemplateLiteral(node, constTable, variableTable);
+    if (t.isUnaryExpression(node))
+        return evaluateUnaryExpression(node);
+    throw new Error(`Unsupported expression type: ${node.type}`);
+}
+function evaluateUnaryExpression(node) {
+    const arg = node.argument;
+    switch (node.operator) {
+        case '-':
+            if (t.isNumericLiteral(arg))
+                return -arg.value;
+            break;
+        case '+':
+            if (t.isNumericLiteral(arg))
+                return +arg.value;
+            break;
+        default:
+            throw new Error(`Unsupported unary operator: ${node.operator}`);
+    }
+    throw new Error(`Unsupported UnaryExpression argument type: ${arg.type}`);
+}
+function resolveKeyframesTableMemberExpression(node, keyframesHashTable) {
+    if (t.isIdentifier(node))
+        return keyframesHashTable[node.name];
+    if (t.isMemberExpression(node)) {
+        if (t.isIdentifier(node.object))
+            return keyframesHashTable[node.object.name];
+    }
+    return undefined;
+}
+function resolveConstTableMemberExpression(node, constTable) {
+    if (t.isIdentifier(node.object) && t.isIdentifier(node.property)) {
+        const varName = node.object.name;
+        const key = node.property.name;
+        const tableValue = constTable[varName];
+        if (typeof tableValue === 'string') {
+            return tableValue;
+        }
+        if (tableValue && typeof tableValue === 'object' && key in tableValue) {
+            return tableValue[key];
+        }
+    }
+    return undefined;
+}
+function resolveVariableTableMemberExpressionByNode(node, variableTable, asObject = false) {
+    if (t.isIdentifier(node)) {
+        if (asObject && typeof variableTable[node.name] === 'object') {
+            return { ...variableTable[node.name] };
+        }
+        const cssVarName = camelToKebabCase(node.name);
+        return `var(--${cssVarName})`;
+    }
+    if (t.isMemberExpression(node) && t.isIdentifier(node.object)) {
+        const varName = node.object.name;
+        let key;
+        if (t.isIdentifier(node.property)) {
+            key = node.property.name;
+        }
+        else if (t.isStringLiteral(node.property)) {
+            key = node.property.value;
+        }
+        if (key &&
+            variableTable[varName] &&
+            variableTable[varName][key] !== undefined) {
+            if (asObject) {
+                return { [key]: variableTable[varName][key] };
+            }
+            const cssVarName = camelToKebabCase(key);
+            return `var(--${cssVarName})`;
+        }
+    }
+    return undefined;
+}
+function resolveThemeTableMemberExpressionByNode(node, themeTable, asObject = false) {
+    if (t.isIdentifier(node)) {
+        if (asObject && typeof themeTable[node.name] === 'object') {
+            return { ...themeTable[node.name] };
+        }
+        const cssVarName = camelToKebabCase(node.name);
+        return `var(--${cssVarName})`;
+    }
+    if (t.isMemberExpression(node) && t.isIdentifier(node.object)) {
+        const varName = node.object.name;
+        let key;
+        if (t.isIdentifier(node.property)) {
+            key = node.property.name;
+        }
+        else if (t.isStringLiteral(node.property)) {
+            key = node.property.value;
+        }
+        if (key && themeTable[varName] && themeTable[varName][key] !== undefined) {
+            if (asObject) {
+                return { [key]: themeTable[varName][key] };
+            }
+            const cssVarName = camelToKebabCase(key);
+            return `var(--${cssVarName})`;
+        }
+    }
+    return undefined;
+}
+function collectLocalConsts(ast) {
+    const localConsts = {};
+    traverse(ast, {
+        VariableDeclarator(path) {
+            const { node } = path;
+            if (t.isIdentifier(node.id) &&
+                node.init &&
+                t.isStringLiteral(node.init)) {
+                localConsts[node.id.name] = node.init.value;
+            }
+        },
+    });
+    return localConsts;
+}
+function isCSSDefineFile(filePath, target) {
+    if (fs.statSync(filePath).isDirectory())
+        return false;
+    const code = fs.readFileSync(filePath, 'utf8');
+    let ast;
+    try {
+        ast = parseSync(code, {
+            sourceType: 'module',
+            presets: [
+                ['@babel/preset-typescript', { isTSX: true, allExtensions: true }],
+            ],
+        });
+    }
+    catch (err) {
+        console.error(err);
+        return false;
+    }
+    if (!ast)
+        return false;
+    let found = false;
+    traverse(ast, {
+        CallExpression(path) {
+            const callee = path.node.callee;
+            if (callee.type === 'MemberExpression' &&
+                callee.object.type === 'Identifier' &&
+                callee.object.name === 'css' &&
+                callee.property.type === 'Identifier' &&
+                callee.property.name === target) {
+                found = true;
+                path.stop();
+            }
+        },
+    });
+    return found;
+}
+function scanForDefineConsts() {
+    const constTableLocal = {};
+    const files = globSync(PATTERN_PATH, GLOB_OPTIONS);
+    for (const filePath of files) {
+        if (!isCSSDefineFile(filePath, 'defineConsts'))
+            continue;
+        const source = fs.readFileSync(filePath, 'utf8');
+        const ast = parseSync(source, {
+            sourceType: 'module',
+            presets: [
+                ['@babel/preset-typescript', { isTSX: true, allExtensions: true }],
+            ],
+        });
+        if (!ast)
+            continue;
+        for (const node of ast.program.body) {
+            const declarations = t.isVariableDeclaration(node)
+                ? node.declarations
+                : t.isExportNamedDeclaration(node) &&
+                    node.declaration &&
+                    t.isVariableDeclaration(node.declaration)
+                    ? node.declaration.declarations
+                    : [];
+            for (const decl of declarations) {
+                if (t.isVariableDeclarator(decl) &&
+                    t.isIdentifier(decl.id) &&
+                    t.isCallExpression(decl.init) &&
+                    t.isMemberExpression(decl.init.callee) &&
+                    t.isIdentifier(decl.init.callee.object, { name: 'css' }) &&
+                    t.isIdentifier(decl.init.callee.property, { name: 'defineConsts' }) &&
+                    t.isObjectExpression(decl.init.arguments[0])) {
+                    const varName = decl.id.name;
+                    const obj = objectExpressionToObject(decl.init.arguments[0], constTableLocal, keyframesHashTable, variableTable, themeTable);
+                    constTableLocal[varName] = obj;
+                }
+            }
+        }
+    }
+    return constTableLocal;
+}
+function scanForKeyframes() {
+    const keyframesHashTableLocal = {};
+    const keyframesObjectTableLocal = {};
+    const files = globSync(PATTERN_PATH, GLOB_OPTIONS);
+    for (const filePath of files) {
+        if (!isCSSDefineFile(filePath, 'keyframes'))
+            continue;
+        const source = fs.readFileSync(filePath, 'utf8');
+        const ast = parseSync(source, {
+            sourceType: 'module',
+            presets: [
+                ['@babel/preset-typescript', { isTSX: true, allExtensions: true }],
+            ],
+        });
+        if (!ast)
+            continue;
+        for (const node of ast.program.body) {
+            const declarations = t.isVariableDeclaration(node)
+                ? node.declarations
+                : t.isExportNamedDeclaration(node) &&
+                    node.declaration &&
+                    t.isVariableDeclaration(node.declaration)
+                    ? node.declaration.declarations
+                    : [];
+            for (const decl of declarations) {
+                if (t.isVariableDeclarator(decl) &&
+                    t.isIdentifier(decl.id) &&
+                    t.isCallExpression(decl.init) &&
+                    t.isMemberExpression(decl.init.callee) &&
+                    t.isIdentifier(decl.init.callee.object, { name: 'css' }) &&
+                    t.isIdentifier(decl.init.callee.property, { name: 'keyframes' }) &&
+                    t.isObjectExpression(decl.init.arguments[0])) {
+                    const varName = decl.id.name;
+                    const obj = objectExpressionToObject(decl.init.arguments[0], constTable, keyframesHashTableLocal, variableTable, themeTable);
+                    const hash = genBase36Hash(obj, 1, 8);
+                    keyframesHashTableLocal[varName] = hash;
+                    keyframesObjectTableLocal[hash] = obj;
+                }
+            }
+        }
+    }
+    return { keyframesHashTableLocal, keyframesObjectTableLocal };
+}
+function scanForDefineVars() {
+    const variableTableLocal = {};
+    const defineVarsObjectTableLocal = {};
+    const files = globSync(PATTERN_PATH, GLOB_OPTIONS);
+    for (const filePath of files) {
+        if (!isCSSDefineFile(filePath, 'defineVars'))
+            continue;
+        const source = fs.readFileSync(filePath, 'utf8');
+        const ast = parseSync(source, {
+            sourceType: 'module',
+            presets: [
+                ['@babel/preset-typescript', { isTSX: true, allExtensions: true }],
+            ],
+        });
+        if (!ast)
+            continue;
+        for (const node of ast.program.body) {
+            const declarations = t.isVariableDeclaration(node)
+                ? node.declarations
+                : t.isExportNamedDeclaration(node) &&
+                    node.declaration &&
+                    t.isVariableDeclaration(node.declaration)
+                    ? node.declaration.declarations
+                    : [];
+            for (const decl of declarations) {
+                if (t.isVariableDeclarator(decl) &&
+                    t.isIdentifier(decl.id) &&
+                    t.isCallExpression(decl.init) &&
+                    t.isMemberExpression(decl.init.callee) &&
+                    t.isIdentifier(decl.init.callee.object, { name: 'css' }) &&
+                    t.isIdentifier(decl.init.callee.property, { name: 'defineVars' }) &&
+                    t.isObjectExpression(decl.init.arguments[0])) {
+                    const varName = decl.id.name;
+                    const obj = objectExpressionToObject(decl.init.arguments[0], constTable, keyframesHashTable, variableTableLocal, themeTable);
+                    variableTableLocal[varName] = obj;
+                    defineVarsObjectTableLocal[varName] = obj;
+                }
+            }
+        }
+    }
+    return { variableTableLocal, defineVarsObjectTableLocal };
+}
+function scanForDefineTheme() {
+    const themeTableLocal = {};
+    const defineThemeObjectTableLocal = {};
+    const files = globSync(PATTERN_PATH, GLOB_OPTIONS);
+    for (const filePath of files) {
+        if (!isCSSDefineFile(filePath, 'defineTheme'))
+            continue;
+        const source = fs.readFileSync(filePath, 'utf8');
+        const ast = parseSync(source, {
+            sourceType: 'module',
+            presets: [
+                ['@babel/preset-typescript', { isTSX: true, allExtensions: true }],
+            ],
+        });
+        if (!ast)
+            continue;
+        for (const node of ast.program.body) {
+            const declarations = t.isVariableDeclaration(node)
+                ? node.declarations
+                : t.isExportNamedDeclaration(node) &&
+                    node.declaration &&
+                    t.isVariableDeclaration(node.declaration)
+                    ? node.declaration.declarations
+                    : [];
+            for (const decl of declarations) {
+                if (t.isVariableDeclarator(decl) &&
+                    t.isIdentifier(decl.id) &&
+                    t.isCallExpression(decl.init) &&
+                    t.isMemberExpression(decl.init.callee) &&
+                    t.isIdentifier(decl.init.callee.object, { name: 'css' }) &&
+                    t.isIdentifier(decl.init.callee.property, { name: 'defineTheme' }) &&
+                    t.isObjectExpression(decl.init.arguments[0])) {
+                    const varName = decl.id.name;
+                    const obj = objectExpressionToObject(decl.init.arguments[0], constTable, keyframesHashTable, variableTable, themeTableLocal);
+                    themeTableLocal[varName] = obj;
+                    defineThemeObjectTableLocal[varName] = obj;
+                }
+            }
+        }
+    }
+    return { themeTableLocal, defineThemeObjectTableLocal };
+}
+export function plumeria() {
+    const stylesByFile = new Map();
+    let hasScanned = false;
+    const outputPath = path.join(import.meta.dirname, '..', 'zero-virtual.css');
     return {
-        name: '@plumeria/vite',
+        name: 'plumeria-vite-plugin',
         config: ({ build = {} }) => ({
             build: {
                 ...build,
@@ -13,5 +481,181 @@ export default function plumeria() {
                 },
             },
         }),
+        buildStart() {
+            if (hasScanned)
+                return;
+            constTable = {};
+            variableTable = {};
+            themeTable = {};
+            keyframesHashTable = {};
+            keyframesObjectTable = {};
+            defineVarsObjectTable = {};
+            defineThemeObjectTable = {};
+            constTable = scanForDefineConsts();
+            const keyframesResult = scanForKeyframes();
+            keyframesHashTable = keyframesResult.keyframesHashTableLocal;
+            keyframesObjectTable = keyframesResult.keyframesObjectTableLocal;
+            const varsResult = scanForDefineVars();
+            variableTable = varsResult.variableTableLocal;
+            defineVarsObjectTable = varsResult.defineVarsObjectTableLocal;
+            const themeResult = scanForDefineTheme();
+            themeTable = themeResult.themeTableLocal;
+            defineThemeObjectTable = themeResult.defineThemeObjectTableLocal;
+            hasScanned = true;
+        },
+        async transform(source, id) {
+            if (id.includes('node_modules') ||
+                !/\.(js|jsx|ts|tsx|vue|svelte|astro)$/.test(id)) {
+                return null;
+            }
+            try {
+                let ast = null;
+                try {
+                    ast = parseSync(source, {
+                        sourceType: 'module',
+                        presets: [
+                            [
+                                '@babel/preset-typescript',
+                                { isTSX: true, allExtensions: true },
+                            ],
+                        ],
+                    });
+                }
+                catch (err) {
+                    return null;
+                }
+                if (!ast)
+                    return null;
+                const localConsts = collectLocalConsts(ast);
+                Object.assign(constTable, localConsts);
+                let extractedObject = null;
+                const extractedGlobalObjects = [];
+                const pluginAst = {
+                    visitor: {
+                        CallExpression(path) {
+                            const callee = path.node.callee;
+                            if (t.isMemberExpression(callee) &&
+                                t.isIdentifier(callee.object, { name: 'css' }) &&
+                                t.isIdentifier(callee.property)) {
+                                const args = path.node.arguments;
+                                if (callee.property.name === 'create' &&
+                                    args.length === 1 &&
+                                    t.isObjectExpression(args[0])) {
+                                    extractedObject = objectExpressionToObject(args[0], constTable, keyframesHashTable, variableTable, themeTable);
+                                }
+                                if (callee.property.name === 'global' &&
+                                    args.length === 1 &&
+                                    t.isObjectExpression(args[0])) {
+                                    extractedGlobalObjects.push(objectExpressionToObject(args[0], constTable, keyframesHashTable, variableTable, themeTable));
+                                }
+                            }
+                        },
+                    },
+                };
+                transformFromAstSync(ast, source, {
+                    code: false,
+                    plugins: [pluginAst],
+                    configFile: false,
+                });
+                const fileStyles = {};
+                let hasCSSDefinitions = false;
+                if (extractedObject) {
+                    const base = createCSS(extractedObject);
+                    if (base) {
+                        fileStyles.baseStyles = base;
+                        hasCSSDefinitions = true;
+                    }
+                }
+                if (extractedGlobalObjects.length > 0) {
+                    fileStyles.globalStyles = extractedGlobalObjects
+                        .map((obj) => transpile(obj, undefined, '--global').styleSheet)
+                        .join('\n');
+                    hasCSSDefinitions = true;
+                }
+                if (Object.keys(keyframesObjectTable).length > 0) {
+                    fileStyles.keyframeStyles = Object.entries(keyframesObjectTable)
+                        .map(([hash, obj]) => transpile({ [`@keyframes ${hash}`]: obj }, undefined, '--global').styleSheet)
+                        .join('\n');
+                    hasCSSDefinitions = true;
+                }
+                if (Object.keys(defineVarsObjectTable).length > 0) {
+                    fileStyles.varStyles = Object.values(defineVarsObjectTable)
+                        .map((obj) => transpile(createVars(obj), undefined, '--global')
+                        .styleSheet)
+                        .join('\n');
+                    hasCSSDefinitions = true;
+                }
+                if (Object.keys(defineThemeObjectTable).length > 0) {
+                    fileStyles.themeStyles = Object.values(defineThemeObjectTable)
+                        .map((obj) => transpile(createTheme(obj), undefined, '--global')
+                        .styleSheet)
+                        .join('\n');
+                    hasCSSDefinitions = true;
+                }
+                if (Object.keys(fileStyles).length > 0) {
+                    stylesByFile.set(id, {
+                        ...fileStyles,
+                        lastUpdated: Date.now(),
+                    });
+                }
+                if (hasCSSDefinitions) {
+                    const allStyles = Array.from(stylesByFile.values());
+                    const keyframeStylesSet = new Set();
+                    const varStylesSet = new Set();
+                    const themeStylesSet = new Set();
+                    const globalStylesSet = new Set();
+                    const baseStylesSet = new Set();
+                    for (const style of allStyles) {
+                        if (style.keyframeStyles)
+                            keyframeStylesSet.add(style.keyframeStyles);
+                        if (style.varStyles)
+                            varStylesSet.add(style.varStyles);
+                        if (style.themeStyles)
+                            themeStylesSet.add(style.themeStyles);
+                        if (style.globalStyles)
+                            globalStylesSet.add(style.globalStyles);
+                        if (style.baseStyles)
+                            baseStylesSet.add(style.baseStyles);
+                    }
+                    const css = [
+                        ...Array.from(keyframeStylesSet),
+                        ...Array.from(varStylesSet),
+                        ...Array.from(themeStylesSet),
+                        ...Array.from(globalStylesSet),
+                        ...Array.from(baseStylesSet),
+                    ]
+                        .filter(Boolean)
+                        .join('\n');
+                    fs.writeFileSync(outputPath, css);
+                    return {
+                        code: `${source}\nimport '${path.relative(path.dirname(id), outputPath)}';`,
+                        map: null,
+                    };
+                }
+            }
+            catch (error) {
+                console.error(`Error processing ${id}:`, error);
+            }
+            return null;
+        },
+        configureServer(server) {
+            server.watcher.on('change', (filePath) => {
+                if (filePath.endsWith('.ts') ||
+                    filePath.endsWith('.tsx') ||
+                    filePath.endsWith('.js') ||
+                    filePath.endsWith('.jsx')) {
+                    if (isCSSDefineFile(filePath, 'defineConsts') ||
+                        isCSSDefineFile(filePath, 'keyframes') ||
+                        isCSSDefineFile(filePath, 'defineVars') ||
+                        isCSSDefineFile(filePath, 'defineTheme')) {
+                        hasScanned = false;
+                        console.log('🔄 CSS definition changed, rescanning...');
+                    }
+                }
+            });
+            server.watcher.on('unlink', (filePath) => {
+                stylesByFile.delete(filePath);
+            });
+        },
     };
 }

package/dist/types.d.ts

@@ -0,0 +1,14 @@
+type CSSPrimitive = string | number | boolean | null;
+type ParseErrorString = `[unresolved]` | `[unresolved identifier]` | `[unsupported value type]` | `[unresolved: ${string}]` | `[unresolved member expression]`;
+export type CSSValue = CSSPrimitive | CSSObject | ParseErrorString;
+export type CSSObject = {
+    [key: string]: CSSValue;
+};
+export type ConstTable = Record<string, CSSObject | string>;
+export type VariableTable = Record<string, CSSObject>;
+export type ThemeTable = Record<string, CSSObject>;
+export type KeyframesHashTable = Record<string, string>;
+export type KeyframesObjectTable = Record<string, CSSObject>;
+export type DefineVarsObjectTable = Record<string, CSSObject>;
+export type DefineThemeObjectTable = Record<string, CSSObject>;
+export {};

package/dist/types.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plumeria/vite-plugin",
-  "version": "0.15.7",
+  "version": "0.16.1",
   "type": "module",
   "description": "Plumeria Vite plugin",
   "repository": {
@@ -12,10 +12,19 @@
   "types": "dist/index.d.ts",
   "license": "MIT",
   "files": [
-    "dist/"
+    "dist/",
+    "zero-virtual.css"
   ],
+  "dependencies": {
+    "@babel/core": "^7.28.0",
+    "@babel/preset-typescript": "^7.27.1",
+    "@babel/types": "^7.28.2"
+  },
   "devDependencies": {
-    "vite": "7.1.1"
+    "vite": "7.1.1",
+    "@rust-gear/glob": "^0.2.2",
+    "@types/babel__core": "^7.20.5",
+    "zss-engine": "^0.2.80"
   },
   "publishConfig": {
     "access": "public"

package/zero-virtual.css

@@ -0,0 +1 @@
+/** Placeholder file */