@workday/canvas-kit-codemod 13.2.43 → 13.2.45

package/dist/es6/v13.2/mapping/index.d.ts

@@ -1,3 +1,4 @@
+export declare const paletteNames: string[];
 export declare const mapping: {
     readonly colors: {
         readonly type: "base";

package/dist/es6/v13.2/mapping/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../lib/v13.2/mapping/index.ts"],"names":[],"mappings":"AAqFA,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkFV,CAAC;AAEX,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DxB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../lib/v13.2/mapping/index.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY,UA6BxB,CAAC;AAqFF,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkFV,CAAC;AAEX,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DxB,CAAC"}

package/dist/es6/v13.2/mapping/index.js

@@ -1,4 +1,34 @@
 import { generateLevelTokens } from '../utils/generateLevelTokens';
+export const paletteNames = [
+    'cinnamon',
+    'peach',
+    'chiliMango',
+    'cantaloupe',
+    'sourLemon',
+    'juicyPear',
+    'kiwi',
+    'greenApple',
+    'watermelon',
+    'jewel',
+    'toothpaste',
+    'blueberry',
+    'plum',
+    'berrySmoothie',
+    'blackberry',
+    'islandPunch',
+    'grapeSoda',
+    'pomegranate',
+    'fruitPunch',
+    'rootBeer',
+    'toastedMarshmallow',
+    'licorice',
+    'soap',
+    'frenchVanilla',
+    'blackPepper',
+    'coconut',
+    'cappuccino',
+    'dragonFruit',
+];
 const typeLevelsMap = {
     subtext: {
         small: generateLevelTokens(['subtext', 'small']),

package/dist/es6/v13.2/migrateColorTokens.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"migrateColorTokens.d.ts","sourceRoot":"","sources":["../../../lib/v13.2/migrateColorTokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,SAAS,EAAC,MAAM,aAAa,CAAC;AAiBlD,QAAA,MAAM,SAAS,EAAE,SA0JhB,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"migrateColorTokens.d.ts","sourceRoot":"","sources":["../../../lib/v13.2/migrateColorTokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,SAAS,EAAC,MAAM,aAAa,CAAC;AAkBlD,QAAA,MAAM,SAAS,EAAE,SAsKhB,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/es6/v13.2/migrateColorTokens.js

@@ -1,5 +1,5 @@
-import { addMissingImports, filterOutImports, transformObjectPropertyRecursively, varToMemberExpression, } from './utils';
-import { mapping } from './mapping';
+import { addMissingImports, filterOutImports, getImports, transformObjectPropertyRecursively, varToMemberExpression, } from './utils';
+import { mapping, paletteNames } from './mapping';
 const canvasImportSources = [
     '@workday/canvas-kit-styling',
     '@workday/canvas-kit-react/tokens',
@@ -15,7 +15,7 @@ const transform = (file, api) => {
         source: { value: (value) => canvasImportSources.includes(value) },
     })
         .forEach(nodePath => {
-        importDeclaration = { ...importDeclaration, ...filterOutImports(nodePath, 'colors') };
+        importDeclaration = { ...importDeclaration, ...getImports(nodePath) };
     });
     if (!Object.values(importDeclaration).includes('colors')) {
         return root.toSource();
@@ -91,7 +91,9 @@ const transform = (file, api) => {
                     return j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, token)]);
                 }
             }
-            if ((map === null || map === void 0 ? void 0 : map.type) === 'base' && lowestProperty.type === 'Identifier') {
+            if ((map === null || map === void 0 ? void 0 : map.type) === 'base' &&
+                lowestProperty.type === 'Identifier' &&
+                paletteNames.some(name => lowestProperty.name.includes(name))) {
                 addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['base'] });
                 addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
                 return j.callExpression(j.identifier('cssVar'), [
@@ -101,6 +103,13 @@ const transform = (file, api) => {
         }
         return nodePath.value;
     });
+    root
+        .find(j.ImportDeclaration, {
+        source: { value: (value) => canvasImportSources.includes(value) },
+    })
+        .forEach(nodePath => {
+        filterOutImports({ root, j }, nodePath, 'colors');
+    });
     return root.toSource();
 };
 export default transform;

package/dist/es6/v13.2/migrateDepthTokens.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"migrateDepthTokens.d.ts","sourceRoot":"","sources":["../../../lib/v13.2/migrateDepthTokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AAWtC,QAAA,MAAM,SAAS,EAAE,SAoKhB,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"migrateDepthTokens.d.ts","sourceRoot":"","sources":["../../../lib/v13.2/migrateDepthTokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAC,MAAM,aAAa,CAAC;AAWtC,QAAA,MAAM,SAAS,EAAE,SA6KhB,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/es6/v13.2/migrateDepthTokens.js

@@ -1,4 +1,4 @@
-import { addMissingImports, filterOutImports } from './utils';
+import { addMissingImports, filterOutImports, getImports } from './utils';
 const canvasImportSources = [
     '@workday/canvas-kit-styling',
     '@workday/canvas-kit-react/tokens',
@@ -14,7 +14,7 @@ const transform = (file, api) => {
         source: { value: (value) => canvasImportSources.includes(value) },
     })
         .forEach(nodePath => {
-        importDeclaration = { ...importDeclaration, ...filterOutImports(nodePath, 'depth') };
+        importDeclaration = { ...importDeclaration, ...getImports(nodePath) };
     });
     if (!Object.values(importDeclaration).includes('depth')) {
         return root.toSource();
@@ -25,7 +25,7 @@ const transform = (file, api) => {
             type: 'MemberExpression',
             object: {
                 type: 'Identifier',
-                name: 'depth',
+                name: (name) => importDeclaration[name] === 'depth',
             },
             property: {
                 type: 'NumericLiteral',
@@ -36,17 +36,18 @@ const transform = (file, api) => {
         const argument = nodePath.value.argument;
         if (argument.type === 'MemberExpression' && argument.property.type === 'NumericLiteral') {
             const depthValue = argument.property.value;
+            const isDepthNotZero = depthValue > 0;
             addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
-            if (depthValue > 0) {
+            if (isDepthNotZero) {
                 addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
             }
-            return depthValue > 0
+            return isDepthNotZero
                 ? j.objectProperty(j.identifier('boxShadow'), j.callExpression(j.identifier('cssVar'), [
                     j.memberExpression(j.memberExpression(j.identifier('system'), j.identifier('depth')), j.numericLiteral(depthValue), true),
                 ]))
                 : j.objectProperty(j.identifier('boxShadow'), j.literal('none'));
         }
-        return nodePath;
+        return nodePath.value;
     });
     root
         .find(j.MemberExpression, (value) => {
@@ -69,7 +70,7 @@ const transform = (file, api) => {
                     j.memberExpression(j.memberExpression(j.identifier('system'), j.identifier('depth')), j.numericLiteral(value), true),
                 ]);
         }
-        return nodePath;
+        return nodePath.value;
     });
     root
         .find(j.MemberExpression, (value) => {
@@ -103,6 +104,13 @@ const transform = (file, api) => {
         }
         return nodePath.value;
     });
+    root
+        .find(j.ImportDeclaration, {
+        source: { value: (value) => canvasImportSources.includes(value) },
+    })
+        .forEach(nodePath => {
+        filterOutImports({ root, j }, nodePath, 'depth');
+    });
     return root.toSource();
 };
 export default transform;

package/dist/es6/v13.2/migrateOtherTokens.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"migrateOtherTokens.d.ts","sourceRoot":"","sources":["../../../lib/v13.2/migrateOtherTokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAA+B,SAAS,EAAC,MAAM,aAAa,CAAC;AAcpE,QAAA,MAAM,SAAS,EAAE,SAqLhB,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"migrateOtherTokens.d.ts","sourceRoot":"","sources":["../../../lib/v13.2/migrateOtherTokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,SAAS,EAAC,MAAM,aAAa,CAAC;AAmBlD,QAAA,MAAM,SAAS,EAAE,SAgHhB,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/es6/v13.2/migrateOtherTokens.js

@@ -1,5 +1,5 @@
-import { addMissingImports, filterOutImports, varToMemberExpression } from './utils';
-import { mapping, systemColors } from './mapping';
+import { addMissingImports, filterOutImports, getImports, transformObjectPropertyRecursively, } from './utils';
+import { mapping } from './mapping';
 const canvasImportSources = [
     '@workday/canvas-kit-styling',
     '@workday/canvas-kit-react/tokens',
@@ -18,7 +18,7 @@ const transform = (file, api) => {
         .forEach(nodePath => {
         importDeclaration = {
             ...importDeclaration,
-            ...filterOutImports(nodePath, tokens),
+            ...getImports(nodePath),
         };
     });
     if (!Object.values(importDeclaration).some(value => tokens.includes(value))) {
@@ -35,57 +35,7 @@ const transform = (file, api) => {
         const stylesDeclaration = nodePath.value.arguments[0];
         const isCanvasKitStyling = importDeclaration[name] === 'createStyles' || importDeclaration[name] === 'createStencil';
         if ((stylesDeclaration === null || stylesDeclaration === void 0 ? void 0 : stylesDeclaration.type) === 'ObjectExpression') {
-            const transformProperty = (property) => {
-                var _a;
-                if (property.type === 'ObjectProperty' &&
-                    property.key.type === 'Identifier' &&
-                    property.value.type === 'MemberExpression' &&
-                    property.value.object.type === 'Identifier' &&
-                    property.value.property.type === 'Identifier' &&
-                    tokens.includes(importDeclaration[property.value.object.name])) {
-                    const key = property.key.name;
-                    const tokens = (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === key))) === null || _a === void 0 ? void 0 : _a[1];
-                    const { property: value } = property.value;
-                    const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[value.name];
-                    if (colorToken) {
-                        if (!isCanvasKitStyling) {
-                            addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
-                        }
-                        addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
-                        return j.objectProperty(j.identifier(key), isCanvasKitStyling
-                            ? varToMemberExpression(j, colorToken)
-                            : j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, colorToken)]));
-                    }
-                }
-                if (property.type === 'ObjectProperty' && property.value.type === 'TemplateLiteral') {
-                    const templateLiteral = property.value;
-                    const transformedQuasis = templateLiteral.quasis.map((quasi) => quasi);
-                    const transformedExpressions = templateLiteral.expressions.map((expr) => {
-                        var _a;
-                        if (expr.type === 'MemberExpression' &&
-                            expr.object.type === 'Identifier' &&
-                            expr.property.type === 'Identifier' &&
-                            tokens.includes(importDeclaration[expr.object.name])) {
-                            const tokens = (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === property.key.name))) === null || _a === void 0 ? void 0 : _a[1];
-                            const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[expr.property.name];
-                            if (colorToken) {
-                                addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
-                                addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
-                                return j.callExpression(j.identifier('cssVar'), [
-                                    varToMemberExpression(j, colorToken),
-                                ]);
-                            }
-                        }
-                        return expr;
-                    });
-                    return j.objectProperty(property.key, j.templateLiteral(transformedQuasis, transformedExpressions));
-                }
-                if (property.type === 'ObjectProperty' && property.value.type === 'ObjectExpression') {
-                    return j.objectProperty(property.key, j.objectExpression(property.value.properties.map(transformProperty)));
-                }
-                return property;
-            };
-            stylesDeclaration.properties = stylesDeclaration.properties.map(transformProperty);
+            stylesDeclaration.properties = stylesDeclaration.properties.map((prop) => transformObjectPropertyRecursively({ j, root }, prop, importDeclaration, isCanvasKitStyling, [...tokens]));
         }
     });
     root
@@ -107,6 +57,10 @@ const transform = (file, api) => {
             if (['space', 'borderRadius'].includes(importedName) &&
                 (map === null || map === void 0 ? void 0 : map.type) === 'system' &&
                 lowestProperty.type === 'Identifier') {
+                const newValue = map.keys[lowestProperty.name];
+                if (!newValue) {
+                    return nodePath.value;
+                }
                 addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
                 addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
                 return j.callExpression(j.identifier('cssVar'), [
@@ -116,6 +70,13 @@ const transform = (file, api) => {
         }
         return nodePath.value;
     });
+    root
+        .find(j.ImportDeclaration, {
+        source: { value: (value) => canvasImportSources.includes(value) },
+    })
+        .forEach(nodePath => {
+        filterOutImports({ root, j }, nodePath, tokens);
+    });
     return root.toSource();
 };
 export default transform;

package/dist/es6/v13.2/migrateTypeTokens.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"migrateTypeTokens.d.ts","sourceRoot":"","sources":["../../../lib/v13.2/migrateTypeTokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAA+B,SAAS,EAAC,MAAM,aAAa,CAAC;AASpE,QAAA,MAAM,SAAS,EAAE,SAiOhB,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"migrateTypeTokens.d.ts","sourceRoot":"","sources":["../../../lib/v13.2/migrateTypeTokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAA+B,SAAS,EAAC,MAAM,aAAa,CAAC;AASpE,QAAA,MAAM,SAAS,EAAE,SA6OhB,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/es6/v13.2/migrateTypeTokens.js

@@ -1,4 +1,4 @@
-import { addMissingImports, filterOutImports, varToMemberExpression } from './utils';
+import { addMissingImports, filterOutImports, getImports, varToMemberExpression } from './utils';
 import { typeProps } from './mapping/typeProps';
 import { mapping } from './mapping';
 const canvasImportSources = ['@workday/canvas-kit-styling', '@workday/canvas-kit-react/tokens'];
@@ -12,7 +12,7 @@ const transform = (file, api) => {
         source: { value: (value) => canvasImportSources.includes(value) },
     })
         .forEach(nodePath => {
-        importDeclaration = { ...importDeclaration, ...filterOutImports(nodePath, 'type') };
+        importDeclaration = { ...importDeclaration, ...getImports(nodePath) };
     });
     if (!Object.values(importDeclaration).includes('type')) {
         return root.toSource();
@@ -40,14 +40,26 @@ const transform = (file, api) => {
         const object = argument.object;
         const level = object.property.name;
         const size = argument.property.name;
-        addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
-        addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
-        nodePath.insertAfter(j.objectProperty(j.identifier('color'), j.callExpression(j.identifier('cssVar'), [
-            j.memberExpression(j.memberExpression(j.memberExpression(j.identifier('system'), j.identifier('color')), j.identifier('fg')), j.identifier(['heading', 'title'].includes(level) ? 'strong' : 'default')),
-        ])));
-        return [
-            j.spreadElement(j.memberExpression(j.memberExpression(j.memberExpression(j.identifier('system'), j.identifier('type')), j.identifier(level)), j.identifier(size))),
-        ];
+        const mapKeys = mapping.type.keys.levels.values;
+        const levelKeys = mapKeys[level] || {};
+        const tokens = levelKeys[size];
+        if (tokens) {
+            addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
+            addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
+            const properties = typeProps
+                .filter(prop => tokens[prop])
+                .map((key) => {
+                const tokenValue = tokens[key];
+                if (!tokenValue) {
+                    return null;
+                }
+                return j.objectProperty(j.identifier(key), j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, tokenValue)]));
+            })
+                .filter((prop) => prop !== null);
+            // Replace the spread element with individual properties
+            return properties;
+        }
+        return nodePath.value;
     });
     root
         .find(j.MemberExpression, (value) => {
@@ -80,7 +92,7 @@ const transform = (file, api) => {
                 return j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, value)]);
             }
         }
-        return nodePath;
+        return nodePath.value;
     });
     root
         .find(j.MemberExpression, (value) => {
@@ -104,7 +116,10 @@ const transform = (file, api) => {
                 const lowestPropertyValue = lowestProperty.type === 'Identifier' ? lowestProperty.name : lowestProperty.value;
                 const innerKey = innerProperty.name;
                 if (mainProperty.name === 'properties') {
-                    const { name, values } = mapping.type.keys[innerKey];
+                    const { name, values } = mapping.type.keys[innerKey] || {};
+                    if (!name || !values) {
+                        return nodePath.value;
+                    }
                     const newValue = values[lowestPropertyValue];
                     addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
                     if (newValue.includes('.')) {
@@ -123,17 +138,26 @@ const transform = (file, api) => {
                     const { values } = mapping.type.keys.levels;
                     const levels = values[innerKey];
                     const lowestKey = lowestPropertyValue;
-                    const tokens = levels[lowestKey];
-                    const props = Object.entries(tokens).map(([key, value]) => {
-                        addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
-                        return j.property('init', j.identifier(key), j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, value)]));
-                    });
-                    return j.objectExpression(props);
+                    const tokens = levels === null || levels === void 0 ? void 0 : levels[lowestKey];
+                    if (tokens) {
+                        const props = Object.entries(tokens).map(([key, value]) => {
+                            addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
+                            return j.property('init', j.identifier(key), j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, value)]));
+                        });
+                        return j.objectExpression(props);
+                    }
                 }
             }
         }
         return nodePath.value;
     });
+    root
+        .find(j.ImportDeclaration, {
+        source: { value: (value) => canvasImportSources.includes(value) },
+    })
+        .forEach(nodePath => {
+        filterOutImports({ root, j }, nodePath, 'type');
+    });
     return root.toSource();
 };
 export default transform;

package/dist/es6/v13.2/utils/filterOutImports.d.ts

@@ -1,5 +1,8 @@
 import { ASTPath, ImportDeclaration } from 'jscodeshift';
 type ImportType = 'colors' | 'depth' | 'space' | 'type' | 'borderRadius';
-export declare const filterOutImports: (nodePath: ASTPath<ImportDeclaration>, type: ImportType | ImportType[]) => Record<string, string>;
+export declare const filterOutImports: ({ root, j }: {
+    root: any;
+    j: any;
+}, nodePath: ASTPath<ImportDeclaration>, type: ImportType | ImportType[]) => Record<string, string>;
 export {};
 //# sourceMappingURL=filterOutImports.d.ts.map

package/dist/es6/v13.2/utils/filterOutImports.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"filterOutImports.d.ts","sourceRoot":"","sources":["../../../../lib/v13.2/utils/filterOutImports.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,EAAE,iBAAiB,EAAC,MAAM,aAAa,CAAC;AAEvD,KAAK,UAAU,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,GAAG,cAAc,CAAC;AASzE,eAAO,MAAM,gBAAgB,aACjB,QAAQ,iBAAiB,CAAC,QAC9B,UAAU,GAAG,UAAU,EAAE,2BA2BhC,CAAC"}
+{"version":3,"file":"filterOutImports.d.ts","sourceRoot":"","sources":["../../../../lib/v13.2/utils/filterOutImports.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,EAAE,iBAAiB,EAAC,MAAM,aAAa,CAAC;AAEvD,KAAK,UAAU,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,GAAG,cAAc,CAAC;AASzE,eAAO,MAAM,gBAAgB;UACT,GAAG;OAAK,GAAG;aACnB,QAAQ,iBAAiB,CAAC,QAC9B,UAAU,GAAG,UAAU,EAAE,2BA0ChC,CAAC"}

package/dist/es6/v13.2/utils/filterOutImports.js

@@ -4,18 +4,29 @@ const canvasImportSources = [
     '@workday/canvas-space-web',
     '@workday/canvas-depth-web',
 ];
-export const filterOutImports = (nodePath, type) => {
+export const filterOutImports = ({ root, j }, nodePath, type) => {
     var _a, _b;
     const importName = {};
     nodePath.value.specifiers = (_a = nodePath.value.specifiers) === null || _a === void 0 ? void 0 : _a.filter(specifier => {
         if (specifier.type === 'ImportSpecifier' && specifier.local) {
+            let isInstanceExist = false;
             const localName = specifier.local.name.toString();
             const importedName = specifier.imported.name.toString();
             importName[localName] = importedName;
-            return !(((typeof type === 'string' && importedName.toLowerCase().includes(type)) ||
-                type.includes(importedName)) &&
-                typeof nodePath.value.source.value === 'string' &&
-                canvasImportSources.includes(nodePath.value.source.value));
+            root
+                .find(j.MemberExpression, {
+                object: {
+                    name: importedName,
+                },
+            })
+                .forEach(() => {
+                isInstanceExist = true;
+            });
+            return (isInstanceExist ||
+                !(((typeof type === 'string' && importedName.toLowerCase().includes(type)) ||
+                    type.includes(importedName)) &&
+                    typeof nodePath.value.source.value === 'string' &&
+                    canvasImportSources.includes(nodePath.value.source.value)));
         }
         return true;
     });

package/dist/es6/v13.2/utils/getImports.d.ts

@@ -0,0 +1,3 @@
+import { ASTPath, ImportDeclaration } from 'jscodeshift';
+export declare const getImports: (nodePath: ASTPath<ImportDeclaration>) => Record<string, string>;
+//# sourceMappingURL=getImports.d.ts.map

package/dist/es6/v13.2/utils/getImports.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"getImports.d.ts","sourceRoot":"","sources":["../../../../lib/v13.2/utils/getImports.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,EAAE,iBAAiB,EAAC,MAAM,aAAa,CAAC;AAEvD,eAAO,MAAM,UAAU,aAAc,QAAQ,iBAAiB,CAAC,2BAa9D,CAAC"}

package/dist/es6/v13.2/utils/getImports.js

@@ -0,0 +1,12 @@
+export const getImports = (nodePath) => {
+    var _a;
+    const importName = {};
+    (_a = nodePath.value.specifiers) === null || _a === void 0 ? void 0 : _a.forEach(specifier => {
+        if (specifier.type === 'ImportSpecifier' && specifier.local) {
+            const localName = specifier.local.name.toString();
+            const importedName = specifier.imported.name.toString();
+            importName[localName] = importedName;
+        }
+    });
+    return importName;
+};

package/dist/es6/v13.2/utils/index.d.ts

@@ -1,5 +1,6 @@
 export * from './addMissingImports';
 export * from './filterOutImports';
+export * from './getImports';
 export * from './generateLevelTokens';
 export * from './expectTransformFactory';
 export * from './varToMemberExpression';

package/dist/es6/v13.2/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../lib/v13.2/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,sCAAsC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../lib/v13.2/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,sCAAsC,CAAC"}

package/dist/es6/v13.2/utils/index.js

@@ -1,5 +1,6 @@
 export * from './addMissingImports';
 export * from './filterOutImports';
+export * from './getImports';
 export * from './generateLevelTokens';
 export * from './expectTransformFactory';
 export * from './varToMemberExpression';

package/dist/es6/v13.2/utils/transformObjectPropertyRecursively.d.ts

@@ -1,4 +1,4 @@
 export declare const transformObjectPropertyRecursively: ({ j, root }: any, property: any, importDeclaration: {
     [key: string]: any;
-}, isCanvasKitStyling?: boolean) => any;
+}, isCanvasKitStyling?: boolean, tokenTypes?: string[]) => any;
 //# sourceMappingURL=transformObjectPropertyRecursively.d.ts.map

package/dist/es6/v13.2/utils/transformObjectPropertyRecursively.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"transformObjectPropertyRecursively.d.ts","sourceRoot":"","sources":["../../../../lib/v13.2/utils/transformObjectPropertyRecursively.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,kCAAkC,gBAClC,GAAG,YACJ,GAAG;;wBAEQ,OAAO,KAC3B,GAgJF,CAAC"}
+{"version":3,"file":"transformObjectPropertyRecursively.d.ts","sourceRoot":"","sources":["../../../../lib/v13.2/utils/transformObjectPropertyRecursively.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,kCAAkC,gBAClC,GAAG,YACJ,GAAG;;wBAEQ,OAAO,eACf,MAAM,EAAE,KACpB,GA2UF,CAAC"}

package/dist/es6/v13.2/utils/transformObjectPropertyRecursively.js

@@ -1,26 +1,60 @@
-import { systemColors } from '../mapping';
+import { mapping, paletteNames, systemColors } from '../mapping';
 import { addMissingImports } from './addMissingImports';
 import { varToMemberExpression } from './varToMemberExpression';
-export const transformObjectPropertyRecursively = ({ j, root }, property, importDeclaration, isCanvasKitStyling) => {
+export const transformObjectPropertyRecursively = ({ j, root }, property, importDeclaration, isCanvasKitStyling, tokenTypes) => {
     var _a, _b, _c;
+    // Helper to create object property preserving computed flag
+    const createObjectProperty = (key, value) => {
+        var _a, _b, _c;
+        const prop = j.objectProperty(key, value);
+        // Preserve computed flag: if explicitly true, or if key is not a simple literal/identifier
+        if (property.computed === true ||
+            (((_a = property.key) === null || _a === void 0 ? void 0 : _a.type) !== 'Identifier' &&
+                ((_b = property.key) === null || _b === void 0 ? void 0 : _b.type) !== 'StringLiteral' &&
+                ((_c = property.key) === null || _c === void 0 ? void 0 : _c.type) !== 'NumericLiteral')) {
+            prop.computed = true;
+        }
+        return prop;
+    };
     if (property.type === 'ObjectProperty' &&
         property.key.type === 'Identifier' &&
         property.value.type === 'MemberExpression' &&
         property.value.object.type === 'Identifier' &&
-        property.value.property.type === 'Identifier' &&
-        importDeclaration[property.value.object.name] === 'colors') {
-        const key = property.key.name;
-        const tokens = (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === key))) === null || _a === void 0 ? void 0 : _a[1];
-        const { property: value } = property.value;
-        const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[value.name];
-        if (colorToken) {
-            if (!isCanvasKitStyling) {
-                addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
+        property.value.property.type === 'Identifier') {
+        const importedTokenName = importDeclaration[property.value.object.name];
+        // Handle colors tokens
+        if (importedTokenName === 'colors' && (!tokenTypes || tokenTypes.includes('colors'))) {
+            const key = property.key.name;
+            const tokens = (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === key))) === null || _a === void 0 ? void 0 : _a[1];
+            const { property: value } = property.value;
+            const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[value.name];
+            if (colorToken) {
+                if (!isCanvasKitStyling) {
+                    addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
+                }
+                addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
+                return createObjectProperty(property.key, isCanvasKitStyling
+                    ? varToMemberExpression(j, colorToken)
+                    : j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, colorToken)]));
+            }
+        }
+        // Handle space and borderRadius tokens
+        if (tokenTypes &&
+            tokenTypes.includes(importedTokenName) &&
+            ['space', 'borderRadius'].includes(importedTokenName)) {
+            const map = mapping[importedTokenName];
+            const propertyName = property.value.property.name;
+            if ((map === null || map === void 0 ? void 0 : map.type) === 'system' && map.keys) {
+                const newValue = map.keys[propertyName];
+                if (newValue) {
+                    if (!isCanvasKitStyling) {
+                        addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
+                    }
+                    addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
+                    const tokenPath = j.memberExpression(j.memberExpression(j.identifier(map.type), j.identifier(map.name)), j.identifier(newValue));
+                    return createObjectProperty(property.key, isCanvasKitStyling ? tokenPath : j.callExpression(j.identifier('cssVar'), [tokenPath]));
+                }
             }
-            addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
-            return j.objectProperty(j.identifier(key), isCanvasKitStyling
-                ? varToMemberExpression(j, colorToken)
-                : j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, colorToken)]));
         }
     }
     if (property.type === 'ObjectProperty' && property.value.type === 'TemplateLiteral') {
@@ -28,21 +62,72 @@ export const transformObjectPropertyRecursively = ({ j, root }, property, import
         const transformedQuasis = templateLiteral.quasis.map((quasi) => quasi);
         const transformedExpressions = templateLiteral.expressions.map((expr) => {
             var _a;
+            if (expr.type === 'CallExpression') {
+                expr.arguments = expr.arguments.map((arg) => {
+                    var _a;
+                    if (arg.type === 'MemberExpression' &&
+                        arg.object.type === 'Identifier' &&
+                        arg.object.name === 'colors' &&
+                        arg.property.type === 'Identifier') {
+                        const keyName = property.key.type === 'Identifier' ? property.key.name : null;
+                        const tokens = keyName
+                            ? (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === keyName))) === null || _a === void 0 ? void 0 : _a[1]
+                            : {};
+                        const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[arg.property.name];
+                        if (colorToken) {
+                            return isCanvasKitStyling
+                                ? varToMemberExpression(j, colorToken)
+                                : j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, colorToken)]);
+                        }
+                    }
+                    return arg;
+                });
+            }
             if (expr.type === 'MemberExpression' &&
                 expr.object.type === 'Identifier' &&
-                expr.property.type === 'Identifier' &&
-                importDeclaration[expr.object.name] === 'colors') {
-                const tokens = (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === property.key.name))) === null || _a === void 0 ? void 0 : _a[1];
-                const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[expr.property.name];
-                if (colorToken) {
-                    addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
-                    addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
-                    return j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, colorToken)]);
+                expr.property.type === 'Identifier') {
+                const importedTokenName = importDeclaration[expr.object.name];
+                // Handle colors tokens
+                if (importedTokenName === 'colors' && (!tokenTypes || tokenTypes.includes('colors'))) {
+                    const keyName = property.key.type === 'Identifier' ? property.key.name : null;
+                    const tokens = keyName
+                        ? (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === keyName))) === null || _a === void 0 ? void 0 : _a[1]
+                        : null;
+                    const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[expr.property.name];
+                    if (colorToken) {
+                        if (!isCanvasKitStyling) {
+                            addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
+                        }
+                        addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
+                        return isCanvasKitStyling
+                            ? varToMemberExpression(j, colorToken)
+                            : j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, colorToken)]);
+                    }
+                }
+                // Handle space and borderRadius tokens
+                if (tokenTypes &&
+                    tokenTypes.includes(importedTokenName) &&
+                    ['space', 'borderRadius'].includes(importedTokenName)) {
+                    const map = mapping[importedTokenName];
+                    const propertyName = expr.property.name;
+                    if ((map === null || map === void 0 ? void 0 : map.type) === 'system' && map.keys) {
+                        const newValue = map.keys[propertyName];
+                        if (newValue) {
+                            if (!isCanvasKitStyling) {
+                                addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
+                            }
+                            addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
+                            const tokenPath = j.memberExpression(j.memberExpression(j.identifier(map.type), j.identifier(map.name)), j.identifier(newValue));
+                            return isCanvasKitStyling
+                                ? tokenPath
+                                : j.callExpression(j.identifier('cssVar'), [tokenPath]);
+                        }
+                    }
                 }
             }
             return expr;
         });
-        return j.objectProperty(property.key, j.templateLiteral(transformedQuasis, transformedExpressions));
+        return createObjectProperty(property.key, j.templateLiteral(transformedQuasis, transformedExpressions));
     }
     if (property.type === 'ObjectProperty' && property.value.type === 'ConditionalExpression') {
         const { test, consequent, alternate } = property.value;
@@ -54,23 +139,56 @@ export const transformObjectPropertyRecursively = ({ j, root }, property, import
             alternate.object.type === 'Identifier' &&
             alternate.property.type === 'Identifier' &&
             importDeclaration[alternate.object.name] === 'colors') {
-            const consequentTokens = (_b = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === property.key.name))) === null || _b === void 0 ? void 0 : _b[1];
-            const alternateTokens = (_c = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === property.key.name))) === null || _c === void 0 ? void 0 : _c[1];
+            const keyName = property.key.type === 'Identifier' ? property.key.name : null;
+            const consequentTokens = keyName
+                ? (_b = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === keyName))) === null || _b === void 0 ? void 0 : _b[1]
+                : null;
+            const alternateTokens = keyName
+                ? (_c = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === keyName))) === null || _c === void 0 ? void 0 : _c[1]
+                : null;
             const consequentColorToken = consequentTokens === null || consequentTokens === void 0 ? void 0 : consequentTokens[consequent.property.name];
             const alternateColorToken = alternateTokens === null || alternateTokens === void 0 ? void 0 : alternateTokens[alternate.property.name];
             if (consequentColorToken && alternateColorToken) {
-                addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
+                if (!isCanvasKitStyling) {
+                    addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
+                }
                 addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
-                return j.objectProperty(property.key, j.conditionalExpression(test, j.callExpression(j.identifier('cssVar'), [
-                    varToMemberExpression(j, consequentColorToken),
-                ]), j.callExpression(j.identifier('cssVar'), [
-                    varToMemberExpression(j, alternateColorToken),
-                ])));
+                return createObjectProperty(property.key, j.conditionalExpression(test, isCanvasKitStyling
+                    ? varToMemberExpression(j, consequentColorToken)
+                    : j.callExpression(j.identifier('cssVar'), [
+                        varToMemberExpression(j, consequentColorToken),
+                    ]), isCanvasKitStyling
+                    ? varToMemberExpression(j, alternateColorToken)
+                    : j.callExpression(j.identifier('cssVar'), [
+                        varToMemberExpression(j, alternateColorToken),
+                    ])));
             }
         }
     }
     if (property.type === 'ObjectProperty' && property.value.type === 'ObjectExpression') {
-        return j.objectProperty(property.key, j.objectExpression(property.value.properties.map((prop) => transformObjectPropertyRecursively({ j, root }, prop, importDeclaration, isCanvasKitStyling))));
+        return createObjectProperty(property.key, j.objectExpression(property.value.properties.map((prop) => transformObjectPropertyRecursively({ j, root }, prop, importDeclaration, isCanvasKitStyling, tokenTypes))));
+    }
+    if (property.type === 'ObjectProperty' &&
+        property.key.type === 'Identifier' &&
+        property.value.type === 'MemberExpression' &&
+        property.value.object.type === 'Identifier' &&
+        property.value.property.type === 'Identifier') {
+        const importedTokenName = importDeclaration[property.value.object.name];
+        // Handle colors tokens
+        if (importedTokenName === 'colors' && (!tokenTypes || tokenTypes.includes('colors'))) {
+            const { property: value } = property.value;
+            if (paletteNames.some(name => value.name.includes(name))) {
+                if (!isCanvasKitStyling) {
+                    addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
+                }
+                addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['base'] });
+                return createObjectProperty(property.key, isCanvasKitStyling
+                    ? j.memberExpression(j.identifier('base'), j.identifier(value.name))
+                    : j.callExpression(j.identifier('cssVar'), [
+                        j.memberExpression(j.identifier('base'), j.identifier(value.name)),
+                    ]));
+            }
+        }
     }
     return property;
 };

package/package.json

@@ -2,7 +2,7 @@
   "name": "@workday/canvas-kit-codemod",
   "author": "Workday, Inc. (https://www.workday.com)",
   "license": "Apache-2.0",
-  "version": "13.2.43",
+  "version": "13.2.45",
   "description": "A collection of codemods for use on Workday Canvas Kit packages.",
   "main": "dist/es6/index.js",
   "sideEffects": false,
@@ -46,5 +46,5 @@
   "resolutions": {
     "recast": "0.20.4"
   },
-  "gitHead": "90bc7321a9d24b04f2e816ab8d7d33cb81f2edb0"
+  "gitHead": "1d32cb999f95570395e24e89c7a739e5a4e18cee"
 }