@plumeria/turbopack-loader 18.2.25 → 18.2.26

package/dist/index.js

@@ -85,7 +85,7 @@ const isStaticArgValue = (node) => node.type === 'StringLiteral' ||
     (node.type === 'TemplateLiteral' && node.expressions.length === 0) ||
     utils_1.t.isIdentifier(node) ||
     utils_1.t.isMemberExpression(node);
-const namedParamsOf = (params) => {
+const namedParamsOf = (params, defaults) => {
     if (params.length !== 1)
         return undefined;
     const first = params[0];
@@ -94,16 +94,24 @@ const namedParamsOf = (params) => {
         return undefined;
     const named = [];
     for (const prop of pattern.properties ?? []) {
-        if (prop.type === 'AssignmentPatternProperty' &&
-            utils_1.t.isIdentifier(prop.key) &&
-            !prop.value) {
+        if (prop.type === 'AssignmentPatternProperty' && utils_1.t.isIdentifier(prop.key)) {
             named.push({ key: prop.key.value, local: prop.key.value });
+            if (prop.value)
+                defaults[prop.key.value] = prop.value;
         }
         else if (prop.type === 'KeyValuePatternProperty' &&
             utils_1.t.isIdentifier(prop.key) &&
             utils_1.t.isIdentifier(prop.value)) {
             named.push({ key: prop.key.value, local: prop.value.value });
         }
+        else if (prop.type === 'KeyValuePatternProperty' &&
+            utils_1.t.isIdentifier(prop.key) &&
+            prop.value?.type === 'AssignmentPattern' &&
+            utils_1.t.isIdentifier(prop.value.left)) {
+            const pattern = prop.value;
+            named.push({ key: String(prop.key.value), local: pattern.left.value });
+            defaults[pattern.left.value] = pattern.right;
+        }
         else {
             return undefined;
         }
@@ -119,14 +127,16 @@ const styleFunctionsOf = (objExpr) => {
         if (func.type !== 'ArrowFunctionExpression' &&
             func.type !== 'FunctionExpression')
             return;
+        const defaults = {};
         const params = func.params.map((p) => {
-            if (utils_1.t.isIdentifier(p))
-                return p.value;
-            if (typeof p === 'object' &&
-                p !== null &&
-                'pat' in p &&
-                utils_1.t.isIdentifier(p.pat))
-                return p.pat.value;
+            const pattern = typeof p === 'object' && p !== null && 'pat' in p ? p.pat : p;
+            if (utils_1.t.isIdentifier(pattern))
+                return pattern.value;
+            if (pattern?.type === 'AssignmentPattern' &&
+                utils_1.t.isIdentifier(pattern.left)) {
+                defaults[pattern.left.value] = pattern.right;
+                return pattern.left.value;
+            }
             return 'arg';
         });
         let actualBody = func.body;
@@ -142,7 +152,8 @@ const styleFunctionsOf = (objExpr) => {
         if (actualBody && actualBody.type === 'ObjectExpression') {
             styleFunctions[prop.key.value] = {
                 params,
-                named: namedParamsOf(func.params),
+                named: namedParamsOf(func.params, defaults),
+                defaults,
                 body: actualBody,
             };
         }
@@ -182,6 +193,19 @@ const findVarProp = (style, cssVar) => {
     }
     return undefined;
 };
+const replaceVarValue = (style, cssVar, next) => {
+    for (const [prop, value] of Object.entries(style)) {
+        if (typeof value === 'string' && value.includes(cssVar)) {
+            style[prop] = next;
+            return true;
+        }
+        if (value !== null && typeof value === 'object') {
+            if (replaceVarValue(value, cssVar, next))
+                return true;
+        }
+    }
+    return false;
+};
 async function loader(source) {
     const callback = this.async();
     const loaderOptions = this.getOptions?.() ??
@@ -294,11 +318,12 @@ async function loader(source) {
             }
         }
         const appliedStyleProps = new Set();
+        const ownerComponentOf = (at) => components.find((c) => at.span.start >= c.node.span.start &&
+            at.span.start <= c.node.span.end)?.name;
         const markStylePropApplied = (name, at) => {
-            const owner = components.find((c) => at.span.start >= c.node.span.start &&
-                at.span.start <= c.node.span.end);
+            const owner = ownerComponentOf(at);
             if (owner) {
-                appliedStyleProps.add(`${owner.name}:${name}`);
+                appliedStyleProps.add(`${owner}:${name}`);
             }
         };
         const extractedSheets = [];
@@ -730,7 +755,7 @@ async function loader(source) {
                 }
                 if (propName) {
                     const args = node.arguments;
-                    if (propName === 'keyframes') {
+                    if (propName === 'keyframes' && args.length > 0) {
                         const expr = args[0].expression;
                         if (utils_1.t.isObjectExpression(expr)) {
                             const obj = (0, utils_1.objectExpressionToObject)(expr, mergedStaticTable, mergedKeyframesTable, mergedViewTransitionTable, mergedCreateThemeHashTable, scannedTables.createThemeObjectTable, mergedCreateTable, mergedCreateStaticHashTable, scannedTables.createStaticObjectTable, mergedVariantsTable);
@@ -895,18 +920,19 @@ async function loader(source) {
             if (!func)
                 return null;
             const callArgs = expr.arguments;
-            if (callArgs.some((a) => a.spread) || callArgs.length === 0)
+            if (callArgs.some((a) => a.spread))
                 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);
             if (func.named) {
-                const argExpr = callArgs[0].expression;
-                if (callArgs.length !== 1 || argExpr.type !== 'ObjectExpression') {
+                const argExpr = callArgs[0]?.expression;
+                if (callArgs.length > 1 ||
+                    (argExpr && argExpr.type !== 'ObjectExpression')) {
                     throwCompilationError(`Plumeria: ${getSource(expr)} takes one object argument, because ${callee.property.value} destructures its parameter.`, expr);
                 }
                 const given = new Map();
-                argExpr.properties.forEach((prop) => {
+                (argExpr?.properties ?? []).forEach((prop) => {
                     if (prop.type === 'Identifier') {
                         given.set(prop.value, prop);
                     }
@@ -915,10 +941,14 @@ async function loader(source) {
                         given.set(String(prop.key.value), prop.value);
                     }
                 });
-                const argObj = resolveObjectArg(argExpr) ?? {};
+                const argObj = argExpr
+                    ? (resolveObjectArg(argExpr) ?? {})
+                    : {};
                 func.named.forEach(({ key, local }) => {
                     const source = given.get(key);
                     if (!source) {
+                        if (func.defaults?.[local])
+                            return;
                         throwCompilationError(`Plumeria: ${getSource(expr)} leaves "${key}" unset, and a dynamic style function has no value to fall back on.`, expr);
                         return;
                     }
@@ -944,12 +974,17 @@ async function loader(source) {
                     runtime.push({ param: p, source: callArg.expression });
                 });
             }
+            const withDefault = Object.entries(func.defaults ?? {}).filter(([param]) => tempStaticTable[param] === undefined);
             const cssVars = {};
-            if (runtime.length > 0) {
-                runtime.forEach(({ param }) => (tempStaticTable[param] = param));
+            const varParams = Array.from(new Set([
+                ...runtime.map(({ param }) => param),
+                ...withDefault.map(([param]) => param),
+            ]));
+            if (varParams.length > 0) {
+                varParams.forEach((param) => (tempStaticTable[param] = param));
                 const probe = (0, utils_1.objectExpressionToObject)(func.body, tempStaticTable, mergedKeyframesTable, mergedViewTransitionTable, mergedCreateThemeHashTable, scannedTables.createThemeObjectTable, mergedCreateTable, mergedCreateStaticHashTable, scannedTables.createStaticObjectTable, mergedVariantsTable);
                 const hash = (0, zss_engine_1.genBase36Hash)(probe ?? {}, 1, 8);
-                runtime.forEach(({ param }) => {
+                varParams.forEach((param) => {
                     const cssVar = `--${hash}-${param}`;
                     tempStaticTable[param] = `var(${cssVar})`;
                     cssVars[param] = cssVar;
@@ -958,6 +993,18 @@ async function loader(source) {
             const style = (0, utils_1.objectExpressionToObject)(func.body, tempStaticTable, mergedKeyframesTable, mergedViewTransitionTable, mergedCreateThemeHashTable, scannedTables.createThemeObjectTable, mergedCreateTable, mergedCreateStaticHashTable, scannedTables.createStaticObjectTable, mergedVariantsTable);
             if (!style)
                 return null;
+            withDefault.forEach(([param, expr]) => {
+                const cssVar = cssVars[param];
+                const targetProp = cssVar ? findVarProp(style, cssVar) : undefined;
+                if (!targetProp)
+                    return;
+                const literal = expr.type === 'StringLiteral' || expr.type === 'NumericLiteral'
+                    ? expr.value
+                    : undefined;
+                if (literal === undefined)
+                    return;
+                replaceVarValue(style, cssVar, `var(${cssVar}, ${(0, zss_engine_1.applyCssValue)(literal, (0, zss_engine_1.camelToKebabCase)(targetProp))})`);
+            });
             const vars = [];
             runtime.forEach(({ param, source }) => {
                 const cssVar = cssVars[param];
@@ -1195,13 +1242,18 @@ async function loader(source) {
                     : expr.property.value;
                 const source = utils_1.t.isIdentifier(expr) ? varName : getSource(expr);
                 markStylePropApplied(varName, expr);
-                let possibilities;
-                for (const key of Object.keys(scannedTables.componentPropsTable || {})) {
-                    if (!key.startsWith(`${resourcePath}-`))
-                        continue;
-                    if (scannedTables.componentPropsTable?.[key]?.[varName]) {
-                        possibilities = scannedTables.componentPropsTable[key][varName];
-                        break;
+                const owner = ownerComponentOf(expr);
+                let possibilities = owner
+                    ? scannedTables.componentPropsTable?.[`${resourcePath}-${owner}`]?.[varName]
+                    : undefined;
+                if (!possibilities) {
+                    for (const key of Object.keys(scannedTables.componentPropsTable || {})) {
+                        if (!key.startsWith(`${resourcePath}-`))
+                            continue;
+                        if (scannedTables.componentPropsTable?.[key]?.[varName]) {
+                            possibilities = scannedTables.componentPropsTable[key][varName];
+                            break;
+                        }
                     }
                 }
                 if (!possibilities || possibilities.length === 0)
@@ -1584,7 +1636,7 @@ async function loader(source) {
                 });
                 if (Object.keys(lookupMap).length > 0) {
                     const entries = Object.entries(lookupMap)
-                        .map(([k, v]) => `"${k}":"${v}"`)
+                        .map(([k, v]) => `${JSON.stringify(k)}:${JSON.stringify(v)}`)
                         .join(',');
                     classParts.push(`({${entries}}[${commonTestExpr}] || "")`);
                 }
@@ -2072,9 +2124,8 @@ async function loader(source) {
                         throwCompilationError(`Plumeria: css.use(${getSource(expr)}) does not support dynamic function keys.`, expr);
                     }
                 }
-                const { classParts, isOptimizable, baseStyle } = buildClassParts(args);
-                if (isOptimizable &&
-                    (args.length > 0 || Object.keys(baseStyle).length > 0)) {
+                const { classParts, isOptimizable } = buildClassParts(args);
+                if (isOptimizable) {
                     const replacement = classParts.length > 0 ? classParts.join(' + " " + ') : '""';
                     replacements.push({
                         start: node.span.start - baseByteOffset,
@@ -2082,6 +2133,9 @@ async function loader(source) {
                         content: replacement,
                     });
                 }
+                else {
+                    throwCompilationError(`Plumeria: Dynamic or unresolvable style object "${getSource(node)}" is not supported.`, node);
+                }
             },
         });
         for (const { name, node } of components) {

package/package.json

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