@plumeria/codemod 18.2.22 → 18.2.24

package/dist/cli.js

@@ -302,8 +302,11 @@ async function migrateFromCssModules(options) {
         return 0;
     }
     for (const sheet of stylesheets) {
+        if (!modules[sheet.source])
+            continue;
         console.log(`  ${relative(sheet.source)}  ->  ${relative(sheet.target)}`);
     }
+    const converting = Object.keys(modules).length;
     const config = {
         overrideConfigFile: true,
         overrideConfig: migrateConfig(modules),
@@ -312,7 +315,7 @@ async function migrateFromCssModules(options) {
     if (dryRun) {
         const results = await new eslint_1.ESLint(config).lintFiles(targets);
         const touched = results.filter((r) => r.messages.length > 0);
-        console.log(`\n${stylesheets.length} stylesheet(s) would be converted, ${touched.length} consumer(s) rewritten.`);
+        console.log(`\n${converting} stylesheet(s) would be converted, ${touched.length} consumer(s) rewritten.`);
         console.log('Run without --dry-run to apply.');
     }
     else {
@@ -321,7 +324,7 @@ async function migrateFromCssModules(options) {
         const applied = await new eslint_1.ESLint({ ...config, fix: true }).lintFiles(targets);
         await eslint_1.ESLint.outputFixes(applied);
         const touched = applied.filter((r) => r.output !== undefined);
-        console.log(`\n✔ converted ${stylesheets.length} stylesheet(s) and rewrote ${touched.length} consumer(s).`);
+        console.log(`\n✔ converted ${converting} stylesheet(s) and rewrote ${touched.length} consumer(s).`);
     }
     const lines = (0, migrate_1.formatReports)(stylesheets, cwd);
     if (lines.length === 0)

package/dist/migrate.js

@@ -82,6 +82,23 @@ function plan(targets) {
     for (const source of findStylesheets(targets)) {
         const converted = (0, css_modules_1.convertStylesheet)(fs.readFileSync(source, 'utf-8'));
         const target = (0, exports.targetPath)(source);
+        if (fs.existsSync(target)) {
+            stylesheets.push({
+                source,
+                target,
+                reports: [
+                    ...converted.reports,
+                    {
+                        line: 0,
+                        column: 0,
+                        kind: 'target-exists',
+                        source: '',
+                        hint: `${path.basename(target)} already exists and was not overwritten.`,
+                    },
+                ],
+            });
+            continue;
+        }
         stylesheets.push({ source, target, reports: converted.reports });
         modules[source] = {
             source: `./${path.basename(target, '.ts')}`,
@@ -96,6 +113,8 @@ function plan(targets) {
 function write(targets) {
     const result = plan(targets);
     for (const sheet of result.stylesheets) {
+        if (!result.modules[sheet.source])
+            continue;
         const converted = (0, css_modules_1.convertStylesheet)(fs.readFileSync(sheet.source, 'utf-8'));
         fs.writeFileSync(sheet.target, converted.code, 'utf-8');
     }
@@ -108,7 +127,7 @@ function formatReports(sheets, cwd) {
             continue;
         lines.push(path.relative(cwd, sheet.source) || sheet.source);
         for (const report of sheet.reports) {
-            lines.push(`  ${report.line}:${report.column}  ${report.kind}  ${report.source}`);
+            lines.push(`  ${report.line}:${report.column}  ${report.kind}${report.source ? `  ${report.source}` : ''}`);
             lines.push(`        ${report.hint}`);
         }
     }

package/dist/transforms/adopt-styles.js

@@ -55,6 +55,7 @@ exports.adoptStyles = {
             source: 'Import the generated styles from "{{source}}" instead of the stylesheet.',
             core: `Add \`import '${CORE}';\` — the compiler collects a file only when it imports the package.`,
             key: 'The generated key for "{{from}}" is "{{to}}".',
+            binding: 'The stylesheet import is now "{{local}}".',
             prop: 'Styles are carried by the "{{prop}}" prop.',
             composes: '"{{key}}" composed other classes; pass them as an array.',
             value: 'A style read as a value goes back through `css.use`.',
@@ -138,9 +139,9 @@ exports.adoptStyles = {
                 : !read.computed && read.property.type === 'Identifier'
                     ? read.property.name
                     : undefined;
-            if (written === undefined)
-                return context.sourceCode.getText(element);
-            const access = `${binding.local}.${binding.entry.names[written] ?? written}`;
+            const access = written === undefined
+                ? `${binding.local}${context.sourceCode.text.slice(read.object.range[1], read.range[1])}`
+                : `${binding.local}.${binding.entry.names[written] ?? written}`;
             return element.type === 'LogicalExpression'
                 ? `${context.sourceCode.getText(element.left)} ${element.operator} ${access}`
                 : access;
@@ -150,6 +151,26 @@ exports.adoptStyles = {
             : node?.type === 'MemberExpression'
                 ? node
                 : undefined;
+        const unguarded = (node) => {
+            if (node?.type !== 'ConditionalExpression')
+                return node;
+            const { test, consequent, alternate } = node;
+            if (test.type !== 'BinaryExpression' ||
+                test.operator !== '===' ||
+                test.left.type !== 'UnaryExpression' ||
+                test.left.operator !== 'typeof' ||
+                test.right.type !== 'Literal' ||
+                test.right.value !== 'number' ||
+                consequent.type !== 'TemplateLiteral' ||
+                consequent.expressions.length !== 1 ||
+                consequent.quasis.at(-1)?.value.raw !== 'px')
+                return node;
+            const written = context.sourceCode.getText(alternate);
+            return context.sourceCode.getText(test.left.argument) === written &&
+                context.sourceCode.getText(consequent.expressions[0]) === written
+                ? alternate
+                : node;
+        };
         const insideUse = (node) => {
             let current = node;
             while (current.parent &&
@@ -291,15 +312,23 @@ exports.adoptStyles = {
                     : undefined;
                 if (!binding)
                     return;
+                const local = binding.local;
                 const written = node.computed && node.property.type === 'Literal'
                     ? String(node.property.value)
                     : !node.computed && node.property.type === 'Identifier'
                         ? node.property.name
                         : null;
-                if (written === null)
+                if (written === null) {
+                    if (local !== node.object.name)
+                        context.report({
+                            node: node.object,
+                            messageId: 'binding',
+                            data: { local },
+                            fix: (fixer) => fixer.replaceText(node.object, local),
+                        });
                     return;
+                }
                 const key = binding.entry.names[written] ?? written;
-                const local = binding.local;
                 if (coreLocal && !stylingPosition(node) && !insideUse(node)) {
                     context.report({
                         node,
@@ -359,7 +388,7 @@ exports.adoptStyles = {
                     for (const variable of variables)
                         consumed.add(named.get(variable));
                     return `${binding.local}.${key}(${variables
-                        .map((variable) => context.sourceCode.getText(named.get(variable).value))
+                        .map((variable) => context.sourceCode.getText(unguarded(named.get(variable).value)))
                         .join(', ')})`;
                 };
                 const expression = node.value.expression;

package/dist/transforms/release-styles.js

@@ -100,6 +100,7 @@ exports.releaseStyles = {
             token: 'Inline the value this token resolved to.',
             styleType: 'A released style is a class name.',
             folded: 'This only named a style key, which the export has resolved.',
+            read: 'Read this style by the name the export gave it.',
             functionStyle: 'Use the CSS Module class and pass function arguments as custom properties.',
             unsupportedFunctionStyle: 'This function style call cannot be converted without changing its behavior.',
         },
@@ -269,13 +270,16 @@ exports.releaseStyles = {
             }
             return undefined;
         };
+        const moduleVariable = (local) => {
+            const scope = sourceCode.getScope(sourceCode.ast);
+            const moduleScope = scope.type === 'global' ? (scope.childScopes[0] ?? scope) : scope;
+            return moduleScope.variables.find((candidate) => candidate.name === local);
+        };
         const onlyUsedByReleasedStyles = (local) => {
             const range = releasedRange();
             if (!range)
                 return false;
-            const scope = sourceCode.getScope(sourceCode.ast);
-            const moduleScope = scope.type === 'global' ? (scope.childScopes[0] ?? scope) : scope;
-            const variable = moduleScope.variables.find((candidate) => candidate.name === local);
+            const variable = moduleVariable(local);
             if (!variable || variable.references.length === 0)
                 return false;
             return variable.references.every((reference) => reference.identifier.range[0] >= range[0] &&
@@ -291,12 +295,20 @@ exports.releaseStyles = {
             if (removed.length === 0)
                 return false;
             const retained = node.specifiers.filter((specifier) => !removed.includes(specifier));
+            const named = node.specifiers.every((specifier) => specifier.type === 'ImportSpecifier');
             context.report({
                 node,
                 messageId,
                 fix: (fixer) => retained.length === 0
                     ? removeStatement(fixer, node)
-                    : fixer.replaceText(node, importOf(retained, node.source)),
+                    : named
+                        ? fixer.replaceTextRange([
+                            node.specifiers[0].range[0],
+                            node.specifiers[node.specifiers.length - 1].range[1],
+                        ], retained
+                            .map((specifier) => sourceCode.getText(specifier))
+                            .join(', '))
+                        : fixer.replaceText(node, importOf(retained, node.source)),
             });
             return true;
         };
@@ -321,6 +333,19 @@ exports.releaseStyles = {
             const key = alias ? alias[written] : written;
             return key === undefined ? undefined : { module, key };
         };
+        const onlyNamesStyleKeys = (variable) => {
+            if (!variable || variable.references.length === 0)
+                return false;
+            return variable.references.every((reference) => {
+                if (reference.init)
+                    return true;
+                const parent = reference.identifier.parent;
+                return (parent?.type === 'MemberExpression' &&
+                    parent.computed &&
+                    parent.property === reference.identifier &&
+                    Boolean(moduleOf(parent)));
+            });
+        };
         const accessOf = (module, key) => `${module.binding}${IDENTIFIER.test(key) ? `.${key}` : `['${key}']`}`;
         const classText = (node) => {
             const resolved = styleKey(node);
@@ -526,6 +551,19 @@ exports.releaseStyles = {
                     if (removeImportedBindings(node, importedStatics, 'staticImport', (specifier) => onlyUsedByReleasedStyles(specifier.local.name)))
                         return;
                 }
+                const foldedKeys = node.specifiers
+                    .filter((specifier) => specifier.type === 'ImportSpecifier' &&
+                    constants[specifier.local.name] !== undefined)
+                    .map((specifier) => specifier.imported.name ?? specifier.imported.value);
+                if (active && foldedKeys.length > 0) {
+                    if (removeImportedBindings(node, foldedKeys, 'folded', (specifier) => {
+                        const variable = moduleVariable(specifier.local.name);
+                        return Boolean(variable &&
+                            (variable.references.length === 0 ||
+                                onlyNamesStyleKeys(variable)));
+                    }))
+                        return;
+                }
                 const importedModule = importedReleasedModule(String(node.source.value));
                 if (importedModule) {
                     const importedBinding = node.specifiers.find((specifier) => specifier.type === 'ImportSpecifier' &&
@@ -634,19 +672,7 @@ exports.releaseStyles = {
                     node.parent.parent?.type === 'ExportNamedDeclaration')
                     return;
                 const scope = sourceCode.getScope(node);
-                const variable = scope.variables.find((candidate) => candidate.name === node.id.name);
-                if (!variable || variable.references.length === 0)
-                    return;
-                const onlyNamesKeys = variable.references.every((reference) => {
-                    if (reference.init)
-                        return true;
-                    const parent = reference.identifier.parent;
-                    return (parent?.type === 'MemberExpression' &&
-                        parent.computed &&
-                        parent.property === reference.identifier &&
-                        Boolean(moduleOf(parent)));
-                });
-                if (!onlyNamesKeys)
+                if (!onlyNamesStyleKeys(scope.variables.find((candidate) => candidate.name === node.id.name)))
                     return;
                 const target = node.parent;
                 context.report({
@@ -894,8 +920,26 @@ exports.releaseStyles = {
                     takeProp();
                     return;
                 }
-                if (!complete && expression && resolveText(expression) === undefined)
+                const text = expression ? resolveText(expression) : undefined;
+                if (!complete && expression && text === undefined)
                     return;
+                const foldsKey = expression?.type === 'MemberExpression' &&
+                    expression.computed &&
+                    expression.property.type === 'Identifier' &&
+                    constants[expression.property.name] !== undefined;
+                if (foldsKey &&
+                    text !== undefined &&
+                    text !== sourceCode.getText(expression)) {
+                    if (carried) {
+                        takeProp(text);
+                        return;
+                    }
+                    context.report({
+                        node: expression,
+                        messageId: 'read',
+                        fix: (fixer) => fixer.replaceText(expression, text),
+                    });
+                }
                 takeProp();
             },
         };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plumeria/codemod",
-  "version": "18.2.22",
+  "version": "18.2.24",
   "description": "Codemods for migrating Plumeria APIs",
   "author": "Refirst 11",
   "license": "MIT",