@plumeria/turbopack-loader 18.4.1 → 18.5.0

package/dist/file-lock.d.ts

@@ -1,2 +1,2 @@
-export declare function acquireLock(lockDir: string, delayMs?: number, maxDelayMs?: number): Promise<void>;
+export declare function acquireLock(lockDir: string, delayMs?: number, maxDelayMs?: number, timeoutMs?: number): Promise<void>;
 export declare function releaseLockSync(lockDir: string): void;

package/dist/file-lock.js

@@ -37,7 +37,8 @@ exports.acquireLock = acquireLock;
 exports.releaseLockSync = releaseLockSync;
 const fs = __importStar(require("fs"));
 const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
-async function acquireLock(lockDir, delayMs = 2, maxDelayMs = 50) {
+async function acquireLock(lockDir, delayMs = 2, maxDelayMs = 50, timeoutMs = 30_000) {
+    const started = Date.now();
     let delay = delayMs;
     while (true) {
         try {
@@ -46,7 +47,11 @@ async function acquireLock(lockDir, delayMs = 2, maxDelayMs = 50) {
         }
         catch (err) {
             if (err.code === 'EEXIST') {
-                await sleep(delay);
+                const remaining = timeoutMs - (Date.now() - started);
+                if (remaining <= 0) {
+                    throw new Error(`Plumeria: Timed out waiting for CSS lock "${lockDir}". If no build is running, remove the stale lock directory and retry.`, { cause: err });
+                }
+                await sleep(Math.min(delay, remaining));
                 delay = Math.min(delay * 2, maxDelayMs);
                 continue;
             }

package/dist/index.js

@@ -77,7 +77,10 @@ async function generateProductionCss(virtualFilePath, options) {
 }
 const ensureProductionCss = (virtualFilePath, options) => {
     if (!productionCss) {
-        productionCss = generateProductionCss(virtualFilePath, options);
+        productionCss = generateProductionCss(virtualFilePath, options).catch((error) => {
+            productionCss = null;
+            throw error;
+        });
     }
     return productionCss;
 };
@@ -105,12 +108,37 @@ const componentFunctionOf = (node) => {
     }
     return undefined;
 };
+const unwrapPatternDefault = (pattern) => pattern?.type === 'AssignmentPattern' ? pattern.left : pattern;
+const destructuredPropAliases = (fn) => {
+    const aliases = new Map();
+    const first = fn.params[0];
+    const pattern = unwrapPatternDefault(first?.pat ?? first);
+    if (pattern?.type !== 'ObjectPattern')
+        return aliases;
+    for (const item of pattern.properties ?? []) {
+        if (item.type !== 'KeyValuePatternProperty')
+            continue;
+        const local = unwrapPatternDefault(item.value);
+        const key = item.key;
+        if (!utils_1.t.isIdentifier(local))
+            continue;
+        if (!utils_1.t.isIdentifier(key) && !utils_1.t.isStringLiteral(key))
+            continue;
+        const name = String(key.value);
+        if (name !== local.value)
+            aliases.set(local.value, name);
+    }
+    return aliases;
+};
 const isStaticArgValue = (node) => node.type === 'StringLiteral' ||
     node.type === 'NumericLiteral' ||
     node.type === 'BooleanLiteral' ||
     (node.type === 'TemplateLiteral' && node.expressions.length === 0) ||
     utils_1.t.isIdentifier(node) ||
     utils_1.t.isMemberExpression(node);
+const isNoOpStyle = (node) => utils_1.t.isNullLiteral(node) ||
+    (utils_1.t.isBooleanLiteral(node) && node.value === false) ||
+    (utils_1.t.isIdentifier(node) && node.value === 'undefined');
 const foldDynamicVars = (vars) => {
     const grouped = new Map();
     [...vars]
@@ -188,6 +216,7 @@ async function loader(source) {
                 utils_1.t.isFunctionExpression(node)) {
                 const rootId = (0, utils_1.getRootIdentifier)(node);
                 const isPlumeriaStyle = rootId &&
+                    isVisibleReference(node) &&
                     ((localCreateStyles[rootId] !== undefined &&
                         localCreateStyles[rootId].type !== 'constant') ||
                         mergedCreateTable[rootId] !== undefined ||
@@ -204,6 +233,10 @@ async function loader(source) {
                 }
             }
         };
+        const scannedTables = (0, utils_1.scanAll)();
+        const ownFailure = (0, utils_1.resolveFileError)(resourcePath, '');
+        if (ownFailure)
+            throwCompilationError(`Plumeria: ${ownFailure.message}`);
         for (const node of ast.body) {
             if (node.type === 'ImportDeclaration') {
                 const sourcePath = node.source.value;
@@ -217,7 +250,6 @@ async function loader(source) {
                 }
             }
         }
-        const scannedTables = (0, utils_1.scanAll)();
         if (scannedTables.componentPropsTable) {
             const parentFiles = new Set();
             for (const compKey of Object.keys(scannedTables.componentPropsTable)) {
@@ -237,18 +269,22 @@ async function loader(source) {
             }
         }
         const components = [];
+        const propAliases = new Map();
+        const addComponent = (name, fn) => {
+            components.push({ name, node: fn });
+            const aliases = destructuredPropAliases(fn);
+            if (aliases.size > 0)
+                propAliases.set(name, aliases);
+        };
         for (const node of ast.body) {
             const statement = unwrapExport(node);
             if (isFunctionNode(statement)) {
-                components.push({
-                    name: statement.identifier?.value ?? 'default',
-                    node: statement,
-                });
+                addComponent(statement.identifier?.value ?? 'default', statement);
             }
             else if (statement?.type === 'CallExpression') {
                 const fn = componentFunctionOf(statement);
                 if (fn)
-                    components.push({ name: 'default', node: fn });
+                    addComponent('default', fn);
             }
             else if (utils_1.t.isVariableDeclaration(statement)) {
                 for (const decl of statement.declarations) {
@@ -256,7 +292,7 @@ async function loader(source) {
                         continue;
                     const fn = componentFunctionOf(decl.init);
                     if (fn)
-                        components.push({ name: decl.id.value, node: fn });
+                        addComponent(decl.id.value, fn);
                 }
             }
         }
@@ -481,14 +517,70 @@ async function loader(source) {
             }
         };
         const replacements = [];
+        const deferredSources = [];
+        const deferSource = (node, stripObject = false) => {
+            const token = `__plumeria_preserved_${deferredSources.length}__`;
+            deferredSources.push({
+                token,
+                start: node.span.start - baseByteOffset,
+                end: node.span.end - baseByteOffset,
+                stripObject,
+            });
+            return token;
+        };
         const dynamicFnCalls = [];
         const processedDecls = new Set();
+        const separatelyExported = new Set();
+        for (const statement of ast.body) {
+            if (statement.type !== 'ExportNamedDeclaration' || statement.source)
+                continue;
+            for (const specifier of statement.specifiers) {
+                if (specifier.type === 'ExportSpecifier' &&
+                    utils_1.t.isIdentifier(specifier.orig)) {
+                    separatelyExported.add(specifier.orig.value);
+                }
+            }
+        }
         const idSpans = new Set();
         const excludedSpans = new Set();
         const referenceIdents = (0, utils_1.collectReferenceIdentifiers)(ast);
+        const topLevelDeclarators = new Set();
+        for (const statement of ast.body) {
+            const declaration = unwrapExport(statement);
+            if (utils_1.t.isVariableDeclaration(declaration)) {
+                declaration.declarations.forEach((decl) => topLevelDeclarators.add(decl));
+            }
+        }
+        const unwrapStyleExpression = (node) => {
+            while (node &&
+                [
+                    'ParenthesisExpression',
+                    'TsAsExpression',
+                    'TsSatisfiesExpression',
+                    'TsNonNullExpression',
+                    'TsConstAssertion',
+                    'TsTypeAssertion',
+                ].includes(node.type))
+                node = node.expression;
+            return node;
+        };
+        const literalObjectArgument = (node, seen = new Set()) => {
+            node = unwrapStyleExpression(node);
+            if (utils_1.t.isObjectExpression(node))
+                return node;
+            if (!utils_1.t.isIdentifier(node) || seen.has(node.value))
+                return null;
+            seen.add(node.value);
+            const declaration = [...topLevelDeclarators].find((decl) => utils_1.t.isIdentifier(decl.id) &&
+                decl.id.value === node.value);
+            return declaration?.init
+                ? literalObjectArgument(declaration.init, seen)
+                : null;
+        };
+        const registeredStyleCalls = new Set();
         const registerStyle = (node, declSpan, isExported) => {
             let propName;
-            const init = node.init;
+            const init = unwrapStyleExpression(node.init);
             if (utils_1.t.isIdentifier(node.id) &&
                 init &&
                 utils_1.t.isCallExpression(init) &&
@@ -513,6 +605,19 @@ async function loader(source) {
                 }
             }
             if (propName && init && utils_1.t.isCallExpression(init)) {
+                if (['create', 'createTheme', 'createStatic'].includes(propName) &&
+                    !topLevelDeclarators.has(node)) {
+                    throwCompilationError(`Plumeria: css.${propName} must be assigned to a top-level variable so its styles can be resolved across files. Move this declaration outside the function or block.`, node);
+                }
+                if (['create', 'createTheme', 'createStatic'].includes(propName)) {
+                    const argumentIndex = propName === 'createTheme' ? 1 : 0;
+                    const argument = init.arguments[argumentIndex];
+                    const object = argument && literalObjectArgument(argument.expression);
+                    if (!object)
+                        throwCompilationError(`Plumeria: css.${propName} needs a style object it can read at build time. Pass an object literal or a top-level constant containing one.`, init);
+                    argument.expression = object;
+                    registeredStyleCalls.add(init.span.start);
+                }
                 if (propName === 'create' &&
                     utils_1.t.isObjectExpression(init.arguments[0].expression)) {
                     const obj = (0, utils_1.objectExpressionToObject)(init.arguments[0].expression, mergedStaticTable, mergedKeyframesTable, mergedViewTransitionTable, mergedCreateThemeHashTable, scannedTables.createThemeObjectTable, mergedCreateTable, mergedCreateStaticHashTable, scannedTables.createStaticObjectTable, mergedVariantsTable);
@@ -683,7 +788,9 @@ async function loader(source) {
                 if (processedDecls.has(node))
                     return;
                 node.declarations.forEach((decl) => {
-                    registerStyle(decl, node.span, false);
+                    registerStyle(decl, node.span, node.declarations.length > 1 ||
+                        (utils_1.t.isIdentifier(decl.id) &&
+                            separatelyExported.has(decl.id.value)));
                     checkStyleAliasAssignment(decl);
                 });
             },
@@ -708,6 +815,10 @@ async function loader(source) {
                     }
                 }
                 if (propName) {
+                    if (['create', 'createTheme', 'createStatic'].includes(propName) &&
+                        !registeredStyleCalls.has(node.span.start)) {
+                        throwCompilationError(`Plumeria: css.${propName} must be assigned to a named top-level variable. Destructuring, assignment statements, and default-exported calls cannot be compiled.`, node);
+                    }
                     const args = node.arguments;
                     if (propName === 'keyframes' && args.length > 0) {
                         const expr = args[0].expression;
@@ -773,12 +884,17 @@ async function loader(source) {
         const jsxOpeningElementMap = new Map();
         const componentParamNames = new Set();
         const addFirstParamName = (fn) => {
-            const p = fn.params[0];
+            const first = fn.params[0];
+            const p = unwrapPatternDefault(first?.pat ?? first);
             if (utils_1.t.isIdentifier(p)) {
                 componentParamNames.add(p.value);
             }
-            else if (p?.pat && utils_1.t.isIdentifier(p.pat)) {
-                componentParamNames.add(p.pat.value);
+            else if (p?.type === 'ObjectPattern') {
+                for (const item of p.properties) {
+                    if (item.type === 'RestElement' && utils_1.t.isIdentifier(item.argument)) {
+                        componentParamNames.add(item.argument.value);
+                    }
+                }
             }
         };
         for (const node of ast.body) {
@@ -814,7 +930,21 @@ async function loader(source) {
             const end = node.span.end - baseByteOffset;
             return sourceBuffer.subarray(start, end).toString('utf-8');
         };
+        const isVisibleReference = (expr) => {
+            if (utils_1.t.isIdentifier(expr))
+                return referenceIdents.references.has(expr.span.start);
+            if (utils_1.t.isMemberExpression(expr))
+                return isVisibleReference(expr.object);
+            if (utils_1.t.isCallExpression(expr) &&
+                expr.callee.type !== 'Super' &&
+                expr.callee.type !== 'Import')
+                return isVisibleReference(expr.callee);
+            return true;
+        };
         const resolveStyleObject = (expr) => {
+            expr = (0, utils_1.unwrapExpression)(expr);
+            if (!isVisibleReference(expr))
+                return null;
             if (utils_1.t.isObjectExpression(expr)) {
                 return (0, utils_1.objectExpressionToObject)(expr, mergedStaticTable, mergedKeyframesTable, mergedViewTransitionTable, mergedCreateThemeHashTable, scannedTables.createThemeObjectTable, mergedCreateTable, mergedCreateStaticHashTable, scannedTables.createStaticObjectTable, mergedVariantsTable);
             }
@@ -880,6 +1010,8 @@ async function loader(source) {
             const callee = expr.callee;
             if (!utils_1.t.isIdentifier(callee.object) || !utils_1.t.isIdentifier(callee.property))
                 return null;
+            if (!isVisibleReference(callee.object))
+                return null;
             const styleInfo = localCreateStyles[callee.object.value];
             const func = styleInfo?.functions?.[callee.property.value] ??
                 createFunctionImportMap[callee.object.value]?.[callee.property.value];
@@ -890,7 +1022,12 @@ async function loader(source) {
                 return null;
             const tempStaticTable = { ...mergedStaticTable };
             const runtime = [];
-            const resolveObjectArg = (argExpr) => (0, utils_1.objectExpressionToObject)(argExpr, mergedStaticTable, mergedKeyframesTable, mergedViewTransitionTable, mergedCreateThemeHashTable, scannedTables.createThemeObjectTable, mergedCreateTable, mergedCreateStaticHashTable, scannedTables.createStaticObjectTable, mergedVariantsTable);
+            const resolveObjectArg = (argExpr) => (0, utils_1.objectExpressionToObject)({
+                ...argExpr,
+                properties: argExpr.properties.filter((prop) => prop.type === 'Identifier' ||
+                    (prop.type === 'KeyValueProperty' &&
+                        isStaticArgValue(prop.value))),
+            }, mergedStaticTable, mergedKeyframesTable, mergedViewTransitionTable, mergedCreateThemeHashTable, scannedTables.createThemeObjectTable, mergedCreateTable, mergedCreateStaticHashTable, scannedTables.createStaticObjectTable, mergedVariantsTable);
             if (func.named) {
                 const argExpr = callArgs[0]?.expression;
                 if (callArgs.length > 1 ||
@@ -1012,6 +1149,8 @@ async function loader(source) {
                     utils_1.t.isStringLiteral(node.property.expression)) {
                     return null;
                 }
+                if (!isVisibleReference(node.object))
+                    return null;
                 const varName = node.object.value;
                 const obj = resolveCreateObject(varName);
                 return obj ? { varName, keyExpr: node.property.expression, obj } : null;
@@ -1105,6 +1244,14 @@ async function loader(source) {
                 return buildDecision(node, prefix, off, { n: 0 }, scoped);
             };
             const collectConditions = (node, currentTestStrings = [], argOrder) => {
+                node = (0, utils_1.unwrapExpression)(node);
+                if (isNoOpStyle(node))
+                    return true;
+                if (node.type === 'ArrayExpression') {
+                    return node.elements.every((element) => !element ||
+                        (!element.spread &&
+                            collectConditions(element.expression, currentTestStrings, argOrder)));
+                }
                 let branchStyle = resolveStyleObject(node);
                 if (!branchStyle) {
                     const dynamic = resolveDynamicCall(node);
@@ -1157,13 +1304,12 @@ async function loader(source) {
                             return true;
                         }
                     }
-                    collectConditions(node.consequent, [...currentTestStrings, `(${testSource})`], argOrder);
-                    collectConditions(node.alternate, [...currentTestStrings, `!(${testSource})`], argOrder);
-                    return true;
+                    const consequentHandled = collectConditions(node.consequent, [...currentTestStrings, `(${testSource})`], argOrder);
+                    const alternateHandled = collectConditions(node.alternate, [...currentTestStrings, `!(${testSource})`], argOrder);
+                    return consequentHandled && alternateHandled;
                 }
                 else if (node.type === 'BinaryExpression' && node.operator === '&&') {
-                    collectConditions(node.right, [...currentTestStrings, `(${getSource(node.left)})`], argOrder);
-                    return true;
+                    return collectConditions(node.right, [...currentTestStrings, `(${getSource(node.left)})`], argOrder);
                 }
                 else if (node.type === 'ParenthesisExpression') {
                     return collectConditions(node.expression, currentTestStrings, argOrder);
@@ -1184,17 +1330,20 @@ async function loader(source) {
                     ? expr.value
                     : expr.property.value;
                 const source = utils_1.t.isIdentifier(expr) ? varName : getSource(expr);
-                markStylePropApplied(varName, expr);
                 const owner = ownerComponentOf(expr);
+                const propName = (utils_1.t.isIdentifier(expr) && owner
+                    ? propAliases.get(owner)?.get(varName)
+                    : undefined) ?? varName;
+                markStylePropApplied(propName, expr);
                 let possibilities = owner
-                    ? scannedTables.componentPropsTable?.[`${resourcePath}-${owner}`]?.[varName]
+                    ? scannedTables.componentPropsTable?.[`${resourcePath}-${owner}`]?.[propName]
                     : undefined;
                 if (!possibilities) {
                     const candidates = [];
                     for (const key of Object.keys(scannedTables.componentPropsTable || {})) {
                         if (!key.startsWith(`${resourcePath}-`))
                             continue;
-                        const entries = scannedTables.componentPropsTable?.[key]?.[varName];
+                        const entries = scannedTables.componentPropsTable?.[key]?.[propName];
                         if (entries)
                             candidates.push(...entries);
                     }
@@ -1249,6 +1398,8 @@ async function loader(source) {
             };
             for (const arg of args) {
                 const expr = arg.expression;
+                if (isNoOpStyle(expr))
+                    continue;
                 if (pushPropPossibilities(expr, []))
                     continue;
                 if (utils_1.t.isCallExpression(expr) && utils_1.t.isIdentifier(expr.callee)) {
@@ -1260,7 +1411,11 @@ async function loader(source) {
                         hash = mergedVariantsTable[varName];
                     if (hash && scannedTables.variantsObjectTable[hash])
                         variantObj = scannedTables.variantsObjectTable[hash];
-                    if (!variantObj && localCreateStyles[varName]?.obj)
+                    if (!isVisibleReference(expr))
+                        variantObj = undefined;
+                    if (isVisibleReference(expr) &&
+                        !variantObj &&
+                        localCreateStyles[varName]?.obj)
                         variantObj = localCreateStyles[varName].obj;
                     if (variantObj) {
                         const callArgs = expr.arguments;
@@ -1371,7 +1526,11 @@ async function loader(source) {
                         hash = mergedVariantsTable[varName];
                     if (hash && scannedTables.variantsObjectTable[hash])
                         variantObj = scannedTables.variantsObjectTable[hash];
-                    if (!variantObj && localCreateStyles[varName]?.obj)
+                    if (!isVisibleReference(expr))
+                        variantObj = undefined;
+                    if (isVisibleReference(expr) &&
+                        !variantObj &&
+                        localCreateStyles[varName]?.obj)
                         variantObj = localCreateStyles[varName].obj;
                     if (variantObj) {
                         Object.entries(variantObj).forEach(([groupName, groupVariants]) => {
@@ -1401,7 +1560,9 @@ async function loader(source) {
                     utils_1.t.isIdentifier(expr.object) &&
                     expr.property.type === 'Computed') {
                     const varName = expr.object.value;
-                    const styleObj = resolveCreateObject(varName);
+                    const styleObj = isVisibleReference(expr)
+                        ? resolveCreateObject(varName)
+                        : null;
                     if (styleObj) {
                         const dynExpr = expr.property.expression;
                         const dynSource = getSource(dynExpr);
@@ -1730,6 +1891,8 @@ async function loader(source) {
                 });
             },
             MemberExpression({ node }) {
+                if (!isVisibleReference(node))
+                    return;
                 if (utils_1.t.isIdentifier(node.object) &&
                     (utils_1.t.isIdentifier(node.property) || node.property.type === 'Computed')) {
                     const varName = node.object.value;
@@ -1921,45 +2084,54 @@ async function loader(source) {
                             node.value &&
                             node.value.type === 'JSXExpressionContainer') {
                             const expr = node.value.expression;
-                            const carrierFor = (subNode) => {
+                            const carrierFor = (subNode, calls) => {
                                 const vars = [];
                                 let unresolved = false;
-                                (0, utils_1.traverse)(subNode, {
-                                    CallExpression({ node: call }) {
-                                        if (!isStyleFunctionCall(call))
-                                            return;
-                                        const resolved = resolveDynamicCall(call, true);
-                                        if (!resolved) {
-                                            unresolved = true;
-                                            return;
-                                        }
-                                        vars.push(...resolved.vars);
-                                    },
-                                });
+                                for (const expression of calls ?? [subNode])
+                                    (0, utils_1.traverse)(expression, {
+                                        CallExpression({ node: call }) {
+                                            if (!isStyleFunctionCall(call))
+                                                return;
+                                            const resolved = resolveDynamicCall(call, true);
+                                            if (!resolved) {
+                                                unresolved = true;
+                                                return;
+                                            }
+                                            vars.push(...resolved.vars);
+                                        },
+                                    });
                                 if (unresolved)
                                     return null;
                                 return `{ ${foldDynamicVars(vars).join(', ')} }`;
                             };
                             const replaceWithKey = (subNode) => {
-                                const entry = list.find((x) => x.spanStart === subNode.span.start &&
-                                    x.filePath === resourcePath);
-                                if (entry) {
-                                    let content = JSON.stringify(entry.key);
+                                const entries = list.filter((entry) => entry.spanStart === subNode.span.start &&
+                                    entry.filePath === resourcePath);
+                                if (!entries.length)
+                                    return false;
+                                let content = '""';
+                                for (const entry of [...entries].reverse()) {
+                                    let value = JSON.stringify(entry.key);
                                     if (entry.hasVars) {
-                                        const carrier = carrierFor(subNode);
+                                        const carrier = carrierFor(subNode, entry.dynamicCalls);
                                         if (!carrier)
                                             return false;
-                                        content = `{ key: ${content}, vars: ${carrier} }`;
+                                        value = `{ key: ${value}, vars: ${carrier} }`;
                                     }
-                                    replacements.push({
-                                        start: subNode.span.start - baseByteOffset,
-                                        end: subNode.span.end - baseByteOffset,
-                                        content,
-                                    });
+                                    const condition = entry.conditions
+                                        ?.map(({ test, truthy }) => `${truthy ? '' : '!'}(${getSource(test)})`)
+                                        .join(' && ');
+                                    content = condition
+                                        ? `((${condition}) ? ${value} : ${content})`
+                                        : value;
                                     processStyleRecords(entry.styleObj);
-                                    return true;
                                 }
-                                return false;
+                                replacements.push({
+                                    start: subNode.span.start - baseByteOffset,
+                                    end: subNode.span.end - baseByteOffset,
+                                    content,
+                                });
+                                return true;
                             };
                             (0, utils_1.traverse)(expr, {
                                 MemberExpression({ node: subNode }) {
@@ -1987,7 +2159,7 @@ async function loader(source) {
                 const expr = node.value.expression;
                 const args = expr.type === 'ArrayExpression'
                     ? expr.elements
-                        .filter((el) => el !== undefined)
+                        .filter((el) => el != null)
                         .map((el) => ({ expression: el.expression }))
                     : [{ expression: expr }];
                 const dynamicClassParts = [];
@@ -2016,13 +2188,7 @@ async function loader(source) {
                         existingClassExpr = JSON.stringify(classNameAttr.value.value);
                     }
                     else if (classNameAttr.value?.type === 'JSXExpressionContainer') {
-                        const start = classNameAttr.value.expression.span.start -
-                            baseByteOffset;
-                        const end = classNameAttr.value.expression.span.end -
-                            baseByteOffset;
-                        existingClassExpr = `(${sourceBuffer
-                            .subarray(start, end)
-                            .toString('utf-8')})`;
+                        existingClassExpr = `(${deferSource(classNameAttr.value.expression)})`;
                     }
                 }
                 const styleAttrExisting = attributes.find((attr) => attr.type === 'JSXAttribute' &&
@@ -2037,22 +2203,19 @@ async function loader(source) {
                     });
                     if (styleAttrExisting.value?.type === 'JSXExpressionContainer') {
                         const innerExpr = styleAttrExisting.value?.expression;
-                        const start = innerExpr.span.start - baseByteOffset;
-                        const end = innerExpr.span.end - baseByteOffset;
-                        const innerSource = sourceBuffer
-                            .subarray(start, end)
-                            .toString('utf-8');
                         if (innerExpr.type === 'ObjectExpression') {
-                            const stripped = innerSource.slice(1, -1).trim();
-                            if (stripped)
-                                existingStyleParts.push(stripped);
+                            if (innerExpr.properties.length > 0)
+                                existingStyleParts.push(deferSource(innerExpr, true));
                         }
                         else {
-                            existingStyleExpr = `...(${innerSource})`;
+                            existingStyleExpr = `...(${deferSource(innerExpr)})`;
                         }
                     }
                 }
                 const { classParts, isOptimizable, baseStyle, dynamicVars, propVarSpreads, } = buildClassParts(args, dynamicClassParts, existingClassExpr, true);
+                if (!isOptimizable) {
+                    throwCompilationError(`Plumeria: Dynamic or unresolvable style object "${getSource(expr)}" is not supported.`, expr);
+                }
                 const styleParts = [
                     ...existingStyleParts,
                     ...foldDynamicVars(dynamicVars),
@@ -2073,10 +2236,13 @@ async function loader(source) {
                     });
                 }
                 else {
+                    const keptClass = existingClassExpr
+                        ? `className={${existingClassExpr}}`
+                        : '';
                     replacements.push({
                         start: node.span.start - baseByteOffset,
                         end: node.span.end - baseByteOffset,
-                        content: styleAttr || '',
+                        content: `${keptClass}${styleAttr}`,
                     });
                 }
             },
@@ -2188,6 +2354,22 @@ async function loader(source) {
                     `so it cannot be passed through another prop or read as a value.`, call);
             }
         });
+        for (const deferred of deferredSources) {
+            let cursor = deferred.start;
+            const pieces = [];
+            for (const replacement of [...replacements].sort((a, b) => a.start - b.start || b.end - a.end)) {
+                if (replacement.start < cursor || replacement.end > deferred.end)
+                    continue;
+                pieces.push(sourceBuffer.subarray(cursor, replacement.start).toString('utf-8'), replacement.content);
+                cursor = replacement.end;
+            }
+            pieces.push(sourceBuffer.subarray(cursor, deferred.end).toString('utf-8'));
+            let content = pieces.join('');
+            if (deferred.stripObject)
+                content = content.slice(1, -1).trim();
+            for (const replacement of replacements)
+                replacement.content = replacement.content.replaceAll(deferred.token, content);
+        }
         const buffer = Buffer.from(source);
         let offset = 0;
         const parts = [];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plumeria/turbopack-loader",
-  "version": "18.4.1",
+  "version": "18.5.0",
   "description": "Plumeria Turbopack-loader",
   "author": "Refirst 11",
   "license": "MIT",
@@ -29,8 +29,8 @@
     "zero-virtual.css"
   ],
   "dependencies": {
-    "@plumeria/compiler": "^18.4.1",
-    "@plumeria/utils": "^18.4.1"
+    "@plumeria/compiler": "^18.5.0",
+    "@plumeria/utils": "^18.5.0"
   },
   "devDependencies": {
     "@swc/core": "1.15.47",