@workday/canvas-kit-codemod 16.0.0-alpha.0494-next.0 → 16.0.0-alpha.0499-next.0

package/dist/es6/icon-migration/index.d.ts

@@ -0,0 +1,4 @@
+import { Transform } from 'jscodeshift';
+declare const transform: Transform;
+export default transform;
+//# sourceMappingURL=index.d.ts.map

package/dist/es6/icon-migration/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/icon-migration/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AAItC,QAAA,MAAM,SAAS,EAAE,SAIhB,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/es6/icon-migration/index.js

@@ -0,0 +1,7 @@
+import migrateIcons from './migrateIcons';
+const transform = (file, api, options) => {
+    // These will run in order. If your transform depends on others, place yours after dependent transforms
+    const fixes = [migrateIcons];
+    return fixes.reduce((source, fix) => fix({ ...file, source }, api, options), file.source);
+};
+export default transform;

package/dist/es6/icon-migration/migrateIcons.d.ts

@@ -0,0 +1,3 @@
+import { API, FileInfo, Options } from 'jscodeshift';
+export default function transformer(file: FileInfo, api: API, _options: Options): string;
+//# sourceMappingURL=migrateIcons.d.ts.map

package/dist/es6/icon-migration/migrateIcons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"migrateIcons.d.ts","sourceRoot":"","sources":["../../../lib/icon-migration/migrateIcons.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,GAAG,EAAE,QAAQ,EAAE,OAAO,EAAC,MAAM,aAAa,CAAC;AA2CnD,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,IAAI,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,OAAO,UA0I9E"}

package/dist/es6/icon-migration/migrateIcons.js

@@ -0,0 +1,135 @@
+import deprecatedIcons from '@workday/canvas-system-icons-web/dist/metadata/system.deprecated.metadata.json';
+import { getImportRenameMap } from './utils/getImportRenameMap';
+const iconPackage = '@workday/canvas-system-icons-web';
+const toCamelCase = (str) => str
+    .split('-')
+    .map((word, index) => (index === 0 ? word : word.charAt(0).toUpperCase() + word.slice(1)))
+    .join('');
+// `wd-icon-clipboard-user.svg` -> `clipboard-user`
+// `academicAppointmentTitleIcon` -> `clipboardUserIcon`
+const migrations = deprecatedIcons.reduce((acc, icon) => {
+    const oldIcon = toCamelCase(icon.name) + 'Icon';
+    // `wd-icon-clipboard-user.svg` -> `clipboardUserIcon`
+    const newIcon = icon.fallback
+        ? toCamelCase(icon.fallback.replace(/^wd-icon-|\.svg$/g, '')) + 'Icon'
+        : oldIcon;
+    if (oldIcon !== newIcon) {
+        acc[oldIcon] = newIcon;
+    }
+    return acc;
+}, {});
+// a fallback can itself be deprecated, so follow the chain until we land on a supported icon
+Object.keys(migrations).forEach(oldIcon => {
+    const seen = new Set([oldIcon]);
+    while (migrations[migrations[oldIcon]] && !seen.has(migrations[oldIcon])) {
+        seen.add(migrations[oldIcon]);
+        migrations[oldIcon] = migrations[migrations[oldIcon]];
+    }
+});
+export default function transformer(file, api, _options) {
+    const j = api.jscodeshift;
+    const root = j(file.source);
+    const { containsCanvasImports } = getImportRenameMap(j, root, iconPackage);
+    // exit if the icon package isn't imported
+    if (!containsCanvasImports) {
+        return file.source;
+    }
+    const namespaceImportNames = new Set();
+    // usages reference the local name, so renames are keyed off of it, i.e. `academicIcon` ->
+    // `clipboardIcon` when the deprecated icon's fallback is already imported as `clipboardIcon`
+    const usageRenameMap = {};
+    root
+        .find(j.ImportDeclaration, {
+        source: {
+            value: (value) => value === iconPackage,
+        },
+    })
+        .forEach(nodePath => {
+        if (nodePath.value.specifiers && nodePath.value.specifiers.length) {
+            // collect namespace imports, i.e. `import * as systemIcons from ...`, so we can rename the
+            // icons accessed off of them later
+            nodePath.value.specifiers.forEach(currentSpecifier => {
+                if (currentSpecifier.type === 'ImportNamespaceSpecifier' && currentSpecifier.local) {
+                    namespaceImportNames.add(currentSpecifier.local.name);
+                }
+            });
+            // the local name each imported icon is available under, so we can point usages of a
+            // deprecated icon at an existing import of its fallback instead of importing it twice
+            const localNamesByImport = {};
+            nodePath.value.specifiers.forEach(currentSpecifier => {
+                var _a;
+                if (currentSpecifier.type === 'ImportSpecifier' &&
+                    !migrations[currentSpecifier.imported.name]) {
+                    localNamesByImport[currentSpecifier.imported.name] =
+                        ((_a = currentSpecifier.local) === null || _a === void 0 ? void 0 : _a.name) || currentSpecifier.imported.name;
+                }
+            });
+            nodePath.value.specifiers = nodePath.value.specifiers.filter(currentSpecifier => {
+                var _a;
+                if (currentSpecifier.type !== 'ImportSpecifier') {
+                    return true;
+                }
+                const renamed = migrations[currentSpecifier.imported.name];
+                if (!renamed) {
+                    return true;
+                }
+                const localName = ((_a = currentSpecifier.local) === null || _a === void 0 ? void 0 : _a.name) || currentSpecifier.imported.name;
+                const existingLocalName = localNamesByImport[renamed];
+                // the fallback is already imported, so drop this specifier and send its usages to the
+                // existing local name
+                if (existingLocalName) {
+                    if (existingLocalName !== localName) {
+                        usageRenameMap[localName] = existingLocalName;
+                    }
+                    return false;
+                }
+                // if imported with an alias, retain the alias as the local so usages don't have to change
+                const alias = localName !== currentSpecifier.imported.name ? currentSpecifier.local : null;
+                if (!alias) {
+                    usageRenameMap[localName] = renamed;
+                }
+                localNamesByImport[renamed] = alias ? localName : renamed;
+                currentSpecifier.imported = j.identifier(renamed);
+                currentSpecifier.local = alias || j.identifier(renamed);
+                return true;
+            });
+        }
+    });
+    // rename usages of icons imported by name
+    root
+        .find(j.Identifier, { name: (name) => name in usageRenameMap })
+        .filter(nodePath => {
+        const parent = nodePath.parent.value;
+        // an identifier in a name position, i.e. `config.undoIcon` or `{undoIcon: true}`, only
+        // happens to match the icon's name and isn't a reference to the import
+        if ((parent.type === 'MemberExpression' || parent.type === 'OptionalMemberExpression') &&
+            !parent.computed) {
+            return parent.property !== nodePath.value;
+        }
+        if ((parent.type === 'Property' || parent.type === 'ObjectProperty') &&
+            !parent.computed &&
+            !parent.shorthand) {
+            return parent.key !== nodePath.value;
+        }
+        return true;
+    })
+        .replaceWith(nodePath => j.identifier(usageRenameMap[nodePath.value.name]));
+    // rename usages of icons accessed off a namespace import, i.e. `systemIcons.academicAppointmentTitleIcon`
+    root
+        .find(j.MemberExpression, {
+        computed: false,
+        object: { type: 'Identifier' },
+        property: { type: 'Identifier' },
+    })
+        .replaceWith(nodePath => {
+        const { object, property } = nodePath.value;
+        if (object.type === 'Identifier' &&
+            property.type === 'Identifier' &&
+            namespaceImportNames.has(object.name) &&
+            migrations[property.name]) {
+            return j.memberExpression(object, j.identifier(migrations[property.name]), false);
+        }
+        return nodePath.value;
+    });
+    return root.toSource({ objectCurlySpacing: false });
+}

package/dist/es6/icon-migration/utils/getImportRenameMap.d.ts

@@ -0,0 +1,7 @@
+import { Collection, JSCodeshift } from 'jscodeshift';
+export declare function getImportRenameMap(j: JSCodeshift, root: Collection<any>, mainPackage?: string, packageName?: string): {
+    containsCanvasImports: boolean;
+    importMap: Record<string, string>;
+    styledMap: Record<string, string>;
+};
+//# sourceMappingURL=getImportRenameMap.d.ts.map

package/dist/es6/icon-migration/utils/getImportRenameMap.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getImportRenameMap.d.ts","sourceRoot":"","sources":["../../../../lib/icon-migration/utils/getImportRenameMap.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,UAAU,EAAE,WAAW,EAAC,MAAM,aAAa,CAAC;AAEpE,wBAAgB,kBAAkB,CAChC,CAAC,EAAE,WAAW,EACd,IAAI,EAAE,UAAU,CAAC,GAAG,CAAC,EACrB,WAAW,SAAqC,EAChD,WAAW,SAAK;;;;EA2DjB"}

package/dist/es6/icon-migration/utils/getImportRenameMap.js

@@ -0,0 +1,46 @@
+export function getImportRenameMap(j, root, mainPackage = '@workday/canvas-system-icons-web', packageName = '') {
+    let containsCanvasImports = false;
+    // build import name remapping - in case someone renamed imports...
+    // i.e. `import { IconButton as StyledIconButton } ...`
+    const importMap = {};
+    const styledMap = {};
+    root.find(j.ImportDeclaration, node => {
+        // imports our module
+        const value = node.source.value;
+        if (typeof value === 'string' &&
+            (value === mainPackage || value.startsWith(mainPackage) || value === packageName)) {
+            containsCanvasImports = true;
+            (node.specifiers || []).forEach(specifier => {
+                if (specifier.type === 'ImportSpecifier') {
+                    if (!specifier.local || specifier.local.name === specifier.imported.name) {
+                        importMap[specifier.imported.name] = specifier.imported.name;
+                    }
+                    else {
+                        importMap[specifier.imported.name] = specifier.local.name;
+                    }
+                }
+            });
+        }
+        return false;
+    });
+    root
+        .find(j.CallExpression, (node) => node.callee.type === 'Identifier' &&
+        node.callee.name === 'styled' &&
+        node.arguments[0].type === 'Identifier')
+        .forEach(nodePath => {
+        // const StyledName = styled(OriginalName)({})
+        // const StyledName = styled(OriginalName)`` // Tagged template
+        if ((nodePath.parent.value.type === 'CallExpression' ||
+            nodePath.parent.value.type === 'TaggedTemplateExpression') &&
+            nodePath.parent.parent.value.type === 'VariableDeclarator' &&
+            nodePath.parent.parent.value.id.type === 'Identifier') {
+            const styledName = nodePath.parent.parent.value.id.name;
+            if (nodePath.value.arguments &&
+                nodePath.value.arguments.length &&
+                nodePath.value.arguments[0].type === 'Identifier') {
+                styledMap[nodePath.value.arguments[0].name] = styledName;
+            }
+        }
+    });
+    return { containsCanvasImports, importMap, styledMap };
+}

package/index.js

@@ -145,6 +145,17 @@ const {
       describe: chalk.gray('The path to execute the transform in (recursively).'),
     });
   })
+  .command(
+    'icon-migration [path]',
+    chalk.gray('Deprecated system icons migration transform'),
+    yargs => {
+      yargs.positional('path', {
+        type: 'string',
+        default: '.',
+        describe: chalk.gray('The path to execute the transform in (recursively).'),
+      });
+    }
+  )
   .demandCommand(1, chalk.red.bold('You must provide a transform to apply.'))
   .strictCommands()
   .fail((msg, err, yargs) => {

package/package.json

@@ -2,7 +2,7 @@
   "name": "@workday/canvas-kit-codemod",
   "author": "Workday, Inc. (https://www.workday.com)",
   "license": "Apache-2.0",
-  "version": "16.0.0-alpha.0494-next.0",
+  "version": "16.0.0-alpha.0499-next.0",
   "description": "A collection of codemods for use on Workday Canvas Kit packages.",
   "main": "dist/es6/index.js",
   "sideEffects": false,
@@ -29,13 +29,17 @@
     "url": "https://github.com/Workday/canvas-kit/issues"
   },
   "homepage": "https://github.com/Workday/canvas-kit#readme",
+  "peerDependencies": {
+    "@workday/canvas-system-icons-web": "^5.0.3"
+  },
   "dependencies": {
     "chalk": "4.1.2",
     "jscodeshift": "^17.1.0",
     "yargs": "^16.2.0"
   },
   "devDependencies": {
-    "@types/jscodeshift": "^0.11.3"
+    "@types/jscodeshift": "^0.11.3",
+    "@workday/canvas-system-icons-web": "^5.0.3"
   },
   "scripts": {
     "clean": "rimraf dist && rimraf .build-info && mkdirp dist",
@@ -46,5 +50,5 @@
   "resolutions": {
     "recast": "0.20.4"
   },
-  "gitHead": "7bde57a5a6d4e41fd4a2e08f9f035c609ff4a8f0"
+  "gitHead": "cd5cbb846495120a4bffea4ee17b3b0a482e68c0"
 }