Support core 1.16.0

index.js

@@ -10,6 +10,11 @@ import { Project } from "ts-morph";
 import { css100RenameMap, react100 } from "./migration/core100.js";
 import { react110 } from "./migration/core110.js";
 import { react1110 } from "./migration/core1110.js";
+import { css1120RenameMap, react1120 } from "./migration/core1120.js";
+import { react1130 } from "./migration/core1130.js";
+import { react1140 } from "./migration/core1140.js";
+import { react1150 } from "./migration/core1150.js";
+import { react1160 } from "./migration/core1160.js";
 import { react120 } from "./migration/core120.js";
 import { css130RenameMap, react130 } from "./migration/core130.js";
 import { css140RenameMap } from "./migration/core140.js";
@@ -24,7 +29,6 @@ import {
 } from "./migration/utils.js";
 import { latestSupportedVersion, parsedArgs } from "./utils/args.js";
 import { verboseOnlyDimLog } from "./utils/log.js";
-import { css1120RenameMap, react1120 } from "./migration/core1120.js";
 
 const {
   tsconfig,
@@ -52,6 +56,10 @@ const v182 = parse("1.8.2");
 // nothing needed for 1.10.0
 const v1110 = parse("1.11.0");
 const v1120 = parse("1.12.0");
+const v1130 = parse("1.13.0");
+const v1140 = parse("1.14.0");
+const v1150 = parse("1.15.0");
+const v1160 = parse("1.16.0");
 // NOTE: don't forget to modify `latestSupportedVersion`
 
 const fromVersion = parse(fromInput) || parse("1.0.0");
@@ -103,10 +111,8 @@ if (mode === undefined || mode === "ts") {
 
     verboseOnlyDimLog("Processing", filePath);
 
-    let saltProviderRenamed = false;
-
     if (gt(v100, fromVersion) && lte(v100, toVersion)) {
-      saltProviderRenamed = react100(file, saltProviderRenamed);
+      react100(file);
     }
 
     if (gt(v110, fromVersion) && lte(v110, toVersion)) {
@@ -141,6 +147,22 @@ if (mode === undefined || mode === "ts") {
       react1120(file);
     }
 
+    if (gt(v1130, fromVersion) && lte(v1130, toVersion)) {
+      react1130(file);
+    }
+
+    if (gt(v1140, fromVersion) && lte(v1140, toVersion)) {
+      react1140(file);
+    }
+
+    if (gt(v1150, fromVersion) && lte(v1150, toVersion)) {
+      react1150(file);
+    }
+
+    if (gt(v1160, fromVersion) && lte(v1160, toVersion)) {
+      react1160(file);
+    }
+
     if (organizeImports) {
       file.organizeImports();
     }
@@ -233,11 +255,10 @@ if (mode === undefined || mode === "css") {
       .map((line, lineIndex) => {
         let newLine = line;
 
-        const saltPrefixed = line.replace(/--uitk/g, "--salt");
-
         if (cssMigrationMap.size > 0) {
           newLine = migrateCssVar(
-            saltPrefixed,
+            // Replace uitk prefix with salt prefix for pre-1.0.0 migration
+            gt(v100, fromVersion) ? line : line.replace(/--uitk/g, "--salt"),
             knownCssRenameCheckRegex,
             cssMigrationMap
           );

migration/core100.js

@@ -11,7 +11,7 @@ import {
  *
  * @param {import("ts-morph").SourceFile} file
  */
-export function react100(file, saltProviderRenamed) {
+export function react100(file) {
   // Imports
   for (const declaration of file.getImportDeclarations()) {
     // Rename import declaration first
@@ -38,13 +38,11 @@ export function react100(file, saltProviderRenamed) {
     });
 
     // Rename named imports with new declaration
-    saltProviderRenamed =
-      saltProviderRenamed ||
-      renameNamedImports(declaration, {
-        moduleSpecifier: "@salt-ds/core",
-        from: "ToolkitProvider",
-        to: "SaltProvider",
-      });
+    renameNamedImports(declaration, {
+      moduleSpecifier: "@salt-ds/core",
+      from: "ToolkitProvider",
+      to: "SaltProvider",
+    });
   }
 
   // Components / Types moved from core to lab
@@ -154,7 +152,6 @@ export function react100(file, saltProviderRenamed) {
     attributeTo: "position",
     valueTo: `"east"`,
   });
-  return saltProviderRenamed;
 }
 
 // Everything here is salt prefixed, assuming uitk prefix rename is performed first

migration/core1110.js

@@ -1,6 +1,6 @@
 // Release note: https://github.com/jpmorganchase/salt-ds/releases/tag/%40salt-ds%2Fcore%401.11.0
 
-import { moveNamedImports } from "./utils.js";
+import { moveNamedImports, replaceReactAttribute } from "./utils.js";
 
 /**
  *

migration/core1130.js

@@ -0,0 +1,37 @@
+import { warnRemovedReactAttribute } from "./utils.js";
+
+export function react1130(file) {
+  // https://github.com/jpmorganchase/salt-ds/releases/tag/%40salt-ds%2Flab%401.0.0-alpha.25
+  // FileDropZone
+  warnRemovedReactAttribute(file, {
+    elementName: "FileDropZone",
+    allAttributesRemoved: new Set([
+      "onFilesAccepted",
+      "onFilesRejected",
+      "validate",
+    ]),
+  });
+
+  // https://github.com/jpmorganchase/salt-ds/releases/tag/%40salt-ds%2Flab%401.0.0-alpha.26
+  // PillNext
+  warnRemovedReactAttribute(file, {
+    elementName: "PillNext",
+    allAttributesRemoved: new Set(["onClose", "icon"]),
+  });
+
+  // Pagination
+  warnRemovedReactAttribute(file, {
+    elementName: "Pagination",
+    allAttributesRemoved: new Set([
+      "compact",
+      "showPreviousNext",
+      "FormFieldProps",
+    ]),
+  });
+
+  // GoToInput
+  warnRemovedReactAttribute(file, {
+    elementName: "GoToInput",
+    allAttributesRemoved: new Set(["FormFieldProps"]),
+  });
+}

migration/core1140.js

@@ -0,0 +1,30 @@
+import { warnRemovedReactAttribute, moveNamedImports } from "./utils.js";
+
+export function react1140(file) {
+  // https://github.com/jpmorganchase/salt-ds/releases/tag/%40salt-ds%2Flab%401.0.0-alpha.27
+  // Scrim
+  warnRemovedReactAttribute(file, {
+    elementName: "Scrim",
+    allAttributesRemoved: new Set([
+      "autoFocusRef",
+      "disableAutoFocus",
+      "disableReturnFocus",
+      "fallbackFocusRef",
+      "returnFocusOptions",
+      "tabEnabledSelectors",
+      "onBackDropClick",
+      "closeWithEscape",
+      "onClose",
+      "enableContainerMode",
+      "containerRef",
+      "zIndex",
+    ]),
+  });
+
+  moveNamedImports(file, {
+    namedImportText: "PillNext",
+    newName: "Pill",
+    from: "@salt-ds/lab",
+    to: "@salt-ds/core",
+  });
+}

migration/core1150.js

@@ -0,0 +1,11 @@
+import { moveNamedImports } from "./utils.js";
+
+export function react1150(file) {
+  ["Scrim", "NavigationItem", "Pagination"].forEach((x) => {
+    moveNamedImports(file, {
+      namedImportText: x,
+      from: "@salt-ds/lab",
+      to: "@salt-ds/core",
+    });
+  });
+}

migration/core1160.js

@@ -0,0 +1,9 @@
+import { moveNamedImports } from "./utils.js";
+
+export function react1160(file) {
+  moveNamedImports(file, {
+    namedImportText: "FileDropZone",
+    from: "@salt-ds/lab",
+    to: "@salt-ds/core",
+  });
+}

migration/utils.js

@@ -1,5 +1,5 @@
-import { SyntaxKind } from "ts-morph";
-import { verboseOnlyLog } from "../utils/log.js";
+import { SyntaxKind, Node } from "ts-morph";
+import { verboseOnlyDimLog, verboseOnlyLog } from "../utils/log.js";
 
 /**
  *
@@ -29,16 +29,17 @@ export function renameImportModuleSpecifier(
 }
 
 /**
- * Used when a component is renamed from A -> B
+ * Used when a component is renamed from A -> B.
+ *
  * @param {import("ts-morph").ImportDeclaration} declaration
  */
 export function renameNamedImports(declaration, { moduleSpecifier, from, to }) {
   const specifier = declaration.getModuleSpecifierValue();
   let renamed = false;
   if (specifier === moduleSpecifier) {
     const allNamedImports = declaration.getNamedImports();
-    for (const namedImports of allNamedImports) {
-      if (namedImports.getName() === from) {
+    for (const namedImport of allNamedImports) {
+      if (namedImport.getName() === from) {
         verboseOnlyDimLog(
           "Rename named imports from",
           from,
@@ -48,7 +49,10 @@ export function renameNamedImports(declaration, { moduleSpecifier, from, to }) {
           specifier
         );
         renamed = true;
-        namedImports.setName(to);
+
+        namedImport.renameAlias(from + "Renamed");
+        namedImport.setName(to);
+        namedImport.removeAliasWithRename();
       }
     }
   }
@@ -57,32 +61,44 @@ export function renameNamedImports(declaration, { moduleSpecifier, from, to }) {
 
 /**
  * Move a named import from one package to another.
+ *
+ * Optional `newName` in option, in case a component gets renamed at the same time.
  * @param {import("ts-morph").SourceFile} file
  */
-export function moveNamedImports(file, { namedImportText, from, to }) {
+export function moveNamedImports(file, { namedImportText, from, to, newName }) {
   const allDeclarations = file.getImportDeclarations();
 
   let importRemovedFromFrom = false;
   const declarationMap = new Map();
 
   for (const declaration of allDeclarations) {
-    const specifier = declaration.getModuleSpecifierValue();
-    declarationMap.set(specifier, declaration);
+    const moduleSpecifier = declaration.getModuleSpecifierValue();
+    declarationMap.set(moduleSpecifier, declaration);
 
-    if (specifier === from) {
+    if (moduleSpecifier === from) {
       for (const namedImport of declaration.getNamedImports()) {
         if (namedImport.getText() === namedImportText) {
           verboseOnlyLog(
             "Removed named import",
             namedImportText,
             "from declaration",
-            specifier
+            moduleSpecifier
           );
           importRemovedFromFrom = true;
+          if (newName && newName !== namedImportText) {
+            renameNamedImports(declaration, {
+              moduleSpecifier,
+              from: namedImportText,
+              to: newName,
+            });
+          }
           namedImport.remove();
 
           if (declaration.getNamedImports().length === 0) {
-            verboseOnlyLog("Removed remained empty import line", specifier);
+            verboseOnlyLog(
+              "Removed remained empty import line",
+              moduleSpecifier
+            );
             declaration.remove();
           }
           break;
@@ -91,24 +107,20 @@ export function moveNamedImports(file, { namedImportText, from, to }) {
     }
   }
   if (importRemovedFromFrom) {
+    const newImportName = newName ?? namedImportText;
     if (declarationMap.has(to)) {
-      verboseOnlyLog(
-        "Added named import",
-        namedImportText,
-        "to declaration",
-        to
-      );
-      declarationMap.get(to).addNamedImport(namedImportText);
+      verboseOnlyLog("Added named import", newImportName, "to declaration", to);
+      declarationMap.get(to).addNamedImport(newImportName);
     } else {
       verboseOnlyLog(
         "New named import",
-        namedImportText,
-        "to new declaration",
+        newImportName,
+        "added to new declaration",
         to
       );
       file.addImportDeclarations([
         {
-          namedImports: [namedImportText],
+          namedImports: [newImportName],
           moduleSpecifier: to,
         },
       ]);
@@ -202,6 +214,37 @@ export function replaceReactAttribute(
   return renamed;
 }
 
+/**
+ * Warn when detected removed props of a component.
+ *
+ * @param {import("ts-morph").SourceFile} file
+ */
+export function warnRemovedReactAttribute(
+  file,
+  { elementName, allAttributesRemoved }
+) {
+  for (const syntaxKind of [
+    SyntaxKind.JsxOpeningElement,
+    SyntaxKind.JsxSelfClosingElement,
+  ]) {
+    for (const descendant of file.getDescendantsOfKind(syntaxKind)) {
+      if (descendant.getTagNameNode().getText() === elementName) {
+        for (const attribute of descendant.getAttributes()) {
+          const attributeText = attribute.getFirstDescendant().getText();
+          if (allAttributesRemoved.has(attributeText)) {
+            console.error(
+              `Error: removed prop \`${attributeText}\` of`,
+              elementName,
+              "component detected at",
+              `${file.getFilePath()}:${attribute.getStartLineNumber()}`
+            );
+          }
+        }
+      }
+    }
+  }
+}
+
 /**
  *
  * @param {Set<string>} validCssVarsSet

utils/args.js

@@ -2,7 +2,7 @@ import _yargs from "yargs";
 import { hideBin } from "yargs/helpers";
 const yargs = _yargs(hideBin(process.argv));
 
-export const latestSupportedVersion = "1.12.0";
+export const latestSupportedVersion = "1.16.0";
 
 export const parsedArgs = await yargs
   .scriptName("salt-ts-morph")
@@ -44,10 +44,10 @@ export const parsedArgs = await yargs
   })
   .option("from", {
     type: "string",
-    description: `Semver of salt-ds you're currently on`,
+    description: `Semver of @salt-ds/core package you're currently on`,
   })
   .option("to", {
     type: "string",
-    description: `Semver of salt-ds you're migrating to. Latest supported is ${latestSupportedVersion}`,
+    description: `Semver of @salt-ds/core package you're migrating to. Latest supported is ${latestSupportedVersion}`,
   })
   .help().argv;