@workday/canvas-kit-codemod 14.0.0-alpha.1239-next.0 → 14.0.0-alpha.1251-next.0

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

@@ -201,7 +201,7 @@ export declare const systemColors: {
         soap400: string;
         soap500: string;
     };
-    'color,fill,colorFocus,colorHover,colorActive,icon,iconColor': {
+    'color,fill,colorFocus,colorHover,colorActive,icon,iconColor,textShadow': {
         blackPepper300: string;
         blackPepper400: string;
         blackPepper500: string;
@@ -215,7 +215,7 @@ export declare const systemColors: {
         licorice400: string;
         licorice500: string;
     };
-    'border,borderColor,borderTopColor,borderRightColor,borderBottomColor,borderLeftColor,borderInlineColor,borderBlockColor,borderInlineStartColor,borderInlineEndColor,borderBlockStartColor,borderBlockEndColor,borderColorFocus,borderColorHover,borderColorActive': {
+    'border,borderColor,borderTopColor,borderRightColor,borderBottomColor,borderLeftColor,borderInline,borderInlineStart,borderInlineEnd,borderBlock,borderBlockStart,borderBlockEnd,borderInlineColor,borderBlockColor,borderInlineStartColor,borderInlineEndColor,borderBlockStartColor,borderBlockEndColor,borderColorFocus,borderColorHover,borderColorActive': {
         blackPepper400: string;
         blackPepper500: string;
         blueberry400: string;

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

@@ -134,7 +134,7 @@ export const systemColors = {
         soap400: 'system.color.bg.alt.strong',
         soap500: 'system.color.bg.alt.stronger',
     },
-    'color,fill,colorFocus,colorHover,colorActive,icon,iconColor': {
+    'color,fill,colorFocus,colorHover,colorActive,icon,iconColor,textShadow': {
         blackPepper300: 'system.color.fg.default',
         blackPepper400: 'system.color.fg.strong',
         blackPepper500: 'system.color.fg.stronger',
@@ -148,7 +148,7 @@ export const systemColors = {
         licorice400: 'system.color.fg.muted.strong',
         licorice500: 'system.color.fg.muted.stronger',
     },
-    'border,borderColor,borderTopColor,borderRightColor,borderBottomColor,borderLeftColor,borderInlineColor,borderBlockColor,borderInlineStartColor,borderInlineEndColor,borderBlockStartColor,borderBlockEndColor,borderColorFocus,borderColorHover,borderColorActive': {
+    'border,borderColor,borderTopColor,borderRightColor,borderBottomColor,borderLeftColor,borderInline,borderInlineStart,borderInlineEnd,borderBlock,borderBlockStart,borderBlockEnd,borderInlineColor,borderBlockColor,borderInlineStartColor,borderInlineEndColor,borderBlockStartColor,borderBlockEndColor,borderColorFocus,borderColorHover,borderColorActive': {
         blackPepper400: 'system.color.border.contrast.default',
         blackPepper500: 'system.color.border.contrast.strong',
         blueberry400: 'system.color.border.primary.default',

package/dist/es6/v14-tokens/baseMapping.d.ts

@@ -0,0 +1,160 @@
+declare const baseMapping: {
+    cinnamon100: string;
+    cinnamon200: string;
+    cinnamon300: string;
+    cinnamon400: string;
+    cinnamon500: string;
+    cinnamon600: string;
+    peach100: string;
+    peach200: string;
+    peach300: string;
+    peach400: string;
+    peach500: string;
+    peach600: string;
+    chiliMango100: string;
+    chiliMango200: string;
+    chiliMango300: string;
+    chiliMango400: string;
+    chiliMango500: string;
+    chiliMango600: string;
+    cantaloupe100: string;
+    cantaloupe200: string;
+    cantaloupe300: string;
+    cantaloupe400: string;
+    cantaloupe500: string;
+    cantaloupe600: string;
+    sourLemon100: string;
+    sourLemon200: string;
+    sourLemon300: string;
+    sourLemon400: string;
+    sourLemon500: string;
+    sourLemon600: string;
+    juicyPear100: string;
+    juicyPear200: string;
+    juicyPear300: string;
+    juicyPear400: string;
+    juicyPear500: string;
+    juicyPear600: string;
+    kiwi100: string;
+    kiwi200: string;
+    kiwi300: string;
+    kiwi400: string;
+    kiwi500: string;
+    kiwi600: string;
+    greenApple100: string;
+    greenApple200: string;
+    greenApple300: string;
+    greenApple400: string;
+    greenApple500: string;
+    greenApple600: string;
+    watermelon100: string;
+    watermelon200: string;
+    watermelon300: string;
+    watermelon400: string;
+    watermelon500: string;
+    watermelon600: string;
+    jewel100: string;
+    jewel200: string;
+    jewel300: string;
+    jewel400: string;
+    jewel500: string;
+    jewel600: string;
+    toothpaste100: string;
+    toothpaste200: string;
+    toothpaste300: string;
+    toothpaste400: string;
+    toothpaste500: string;
+    toothpaste600: string;
+    blueberry100: string;
+    blueberry200: string;
+    blueberry300: string;
+    blueberry400: string;
+    blueberry500: string;
+    blueberry600: string;
+    plum100: string;
+    plum200: string;
+    plum300: string;
+    plum400: string;
+    plum500: string;
+    plum600: string;
+    berrySmoothie100: string;
+    berrySmoothie200: string;
+    berrySmoothie300: string;
+    berrySmoothie400: string;
+    berrySmoothie500: string;
+    berrySmoothie600: string;
+    blackberry100: string;
+    blackberry200: string;
+    blackberry300: string;
+    blackberry400: string;
+    blackberry500: string;
+    blackberry600: string;
+    islandPunch100: string;
+    islandPunch200: string;
+    islandPunch300: string;
+    islandPunch400: string;
+    islandPunch500: string;
+    islandPunch600: string;
+    grapeSoda100: string;
+    grapeSoda200: string;
+    grapeSoda300: string;
+    grapeSoda400: string;
+    grapeSoda500: string;
+    grapeSoda600: string;
+    pomegranate100: string;
+    pomegranate200: string;
+    pomegranate300: string;
+    pomegranate400: string;
+    pomegranate500: string;
+    pomegranate600: string;
+    fruitPunch100: string;
+    fruitPunch200: string;
+    fruitPunch300: string;
+    fruitPunch400: string;
+    fruitPunch500: string;
+    fruitPunch600: string;
+    rootBeer100: string;
+    rootBeer200: string;
+    rootBeer300: string;
+    rootBeer400: string;
+    rootBeer500: string;
+    rootBeer600: string;
+    toastedMarshmallow100: string;
+    toastedMarshmallow200: string;
+    toastedMarshmallow300: string;
+    toastedMarshmallow400: string;
+    toastedMarshmallow500: string;
+    toastedMarshmallow600: string;
+    licorice100: string;
+    licorice200: string;
+    licorice300: string;
+    licorice400: string;
+    licorice500: string;
+    licorice600: string;
+    soap100: string;
+    soap200: string;
+    soap300: string;
+    soap400: string;
+    soap500: string;
+    soap600: string;
+    frenchVanilla100: string;
+    frenchVanilla200: string;
+    frenchVanilla300: string;
+    frenchVanilla400: string;
+    frenchVanilla500: string;
+    frenchVanilla600: string;
+    blackPepper100: string;
+    blackPepper200: string;
+    blackPepper300: string;
+    blackPepper400: string;
+    blackPepper500: string;
+    blackPepper600: string;
+    dragonFruit100: string;
+    dragonFruit200: string;
+    dragonFruit300: string;
+    dragonFruit400: string;
+    dragonFruit500: string;
+    dragonFruit600: string;
+};
+export default baseMapping;
+//# sourceMappingURL=baseMapping.d.ts.map

package/dist/es6/v14-tokens/baseMapping.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"baseMapping.d.ts","sourceRoot":"","sources":["../../../lib/v14-tokens/baseMapping.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsLhB,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/es6/v14-tokens/baseMapping.js

@@ -0,0 +1,159 @@
+const baseMapping = {
+    cinnamon100: 'red50',
+    cinnamon200: 'red100',
+    cinnamon300: 'red300',
+    cinnamon400: 'red400',
+    cinnamon500: 'red600',
+    cinnamon600: 'red700',
+    peach100: 'coral50',
+    peach200: 'coral200',
+    peach300: 'coral300',
+    peach400: 'red400',
+    peach500: 'coral600',
+    peach600: 'coral700',
+    chiliMango100: 'coral100',
+    chiliMango200: 'coral200',
+    chiliMango300: 'coral300',
+    chiliMango400: 'orange500',
+    chiliMango500: 'orange500',
+    chiliMango600: 'orange700',
+    cantaloupe100: 'amber50',
+    cantaloupe200: 'amber200',
+    cantaloupe300: 'amber300',
+    cantaloupe400: 'amber400',
+    cantaloupe500: 'amber500',
+    cantaloupe600: 'amber600',
+    sourLemon100: 'amber25',
+    sourLemon200: 'amber100',
+    sourLemon300: 'amber200',
+    sourLemon400: 'amber300',
+    sourLemon500: 'amber300',
+    sourLemon600: 'amber500',
+    juicyPear100: 'amber25',
+    juicyPear200: 'amber100',
+    juicyPear300: 'amber200',
+    juicyPear400: 'amber200',
+    juicyPear500: 'green500',
+    juicyPear600: 'green700',
+    kiwi100: 'green50',
+    kiwi200: 'green100',
+    kiwi300: 'green200',
+    kiwi400: 'green500',
+    kiwi500: 'green500',
+    kiwi600: 'green700',
+    greenApple100: 'green50',
+    greenApple200: 'green100',
+    greenApple300: 'green200',
+    greenApple400: 'green600',
+    greenApple500: 'green700',
+    greenApple600: 'green800',
+    watermelon100: 'teal25',
+    watermelon200: 'teal100',
+    watermelon300: 'green100',
+    watermelon400: 'green600',
+    watermelon500: 'green700',
+    watermelon600: 'green900',
+    jewel100: 'teal25',
+    jewel200: 'teal200',
+    jewel300: 'teal400',
+    jewel400: 'teal500',
+    jewel500: 'teal600',
+    jewel600: 'teal700',
+    toothpaste100: 'azure50',
+    toothpaste200: 'azure200',
+    toothpaste300: 'azure300',
+    toothpaste400: 'azure500',
+    toothpaste500: 'azure700',
+    toothpaste600: 'azure800',
+    blueberry100: 'blue100',
+    blueberry200: 'blue100',
+    blueberry300: 'blue400',
+    blueberry400: 'blue600',
+    blueberry500: 'blue700',
+    blueberry600: 'blue900',
+    plum100: 'blue100',
+    plum200: 'blue200',
+    plum300: 'blue400',
+    plum400: 'blue600',
+    plum500: 'blue700',
+    plum600: 'blue800',
+    berrySmoothie100: 'indigo50',
+    berrySmoothie200: 'indigo200',
+    berrySmoothie300: 'indigo400',
+    berrySmoothie400: 'indigo500',
+    berrySmoothie500: 'indigo700',
+    berrySmoothie600: 'indigo800',
+    blackberry100: 'indigo25',
+    blackberry200: 'indigo200',
+    blackberry300: 'indigo400',
+    blackberry400: 'indigo500',
+    blackberry500: 'indigo700',
+    blackberry600: 'indigo900',
+    islandPunch100: 'purple25',
+    islandPunch200: 'purple200',
+    islandPunch300: 'purple500',
+    islandPunch400: 'purple500',
+    islandPunch500: 'purple700',
+    islandPunch600: 'purple800',
+    grapeSoda100: 'magenta50',
+    grapeSoda200: 'magenta200',
+    grapeSoda300: 'purple400',
+    grapeSoda400: 'purple500',
+    grapeSoda500: 'purple600',
+    grapeSoda600: 'purple800',
+    pomegranate100: 'magenta50',
+    pomegranate200: 'magenta100',
+    pomegranate300: 'magenta500',
+    pomegranate400: 'magenta500',
+    pomegranate500: 'red700',
+    pomegranate600: 'red800',
+    fruitPunch100: 'red25',
+    fruitPunch200: 'red200',
+    fruitPunch300: 'red300',
+    fruitPunch400: 'red400',
+    fruitPunch500: 'red500',
+    fruitPunch600: 'red700',
+    rootBeer100: 'coral25',
+    rootBeer200: 'coral100',
+    rootBeer300: 'coral200',
+    rootBeer400: 'coral200',
+    rootBeer500: 'amber900',
+    rootBeer600: 'amber950',
+    toastedMarshmallow100: 'amber25',
+    toastedMarshmallow200: 'orange100',
+    toastedMarshmallow300: 'orange200',
+    toastedMarshmallow400: 'orange300',
+    toastedMarshmallow500: 'amber500',
+    toastedMarshmallow600: 'amber600',
+    licorice100: 'slate400',
+    licorice200: 'slate500',
+    licorice300: 'slate600',
+    licorice400: 'slate700',
+    licorice500: 'slate800',
+    licorice600: 'slate900',
+    soap100: 'slate25',
+    soap200: 'slate50',
+    soap300: 'slate100',
+    soap400: 'slate200',
+    soap500: 'slate300',
+    soap600: 'slate300',
+    frenchVanilla100: 'neutral0',
+    frenchVanilla200: 'neutral100',
+    frenchVanilla300: 'neutral200',
+    frenchVanilla400: 'neutral300',
+    frenchVanilla500: 'neutral400',
+    frenchVanilla600: 'neutral500',
+    blackPepper100: 'neutral500',
+    blackPepper200: 'neutral700',
+    blackPepper300: 'neutral900',
+    blackPepper400: 'neutral950',
+    blackPepper500: 'neutral975',
+    blackPepper600: 'neutral1000',
+    dragonFruit100: 'purple25',
+    dragonFruit200: 'purple100',
+    dragonFruit300: 'indigo500',
+    dragonFruit400: 'indigo600',
+    dragonFruit500: 'indigo700',
+    dragonFruit600: 'indigo800',
+};
+export default baseMapping;

package/dist/es6/v14-tokens/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/v14-tokens/index.d.ts.map

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

package/dist/es6/v14-tokens/index.js

@@ -0,0 +1,9 @@
+import migrateColorTokens from './migrateColorTokens';
+import migrateDepthTokens from '../v13.2/migrateDepthTokens';
+import migrateOtherTokens from '../v13.2/migrateOtherTokens';
+import migrateTypeTokens from '../v13.2/migrateTypeTokens';
+const transform = (file, api, options) => {
+    const fixes = [migrateColorTokens, migrateDepthTokens, migrateTypeTokens, migrateOtherTokens];
+    return fixes.reduce((source, fix) => fix({ ...file, source }, api, options), file.source);
+};
+export default transform;

package/dist/es6/v14-tokens/migrateColorTokens.d.ts

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

package/dist/es6/v14-tokens/migrateColorTokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"migrateColorTokens.d.ts","sourceRoot":"","sources":["../../../lib/v14-tokens/migrateColorTokens.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,SAAS,EAAC,MAAM,aAAa,CAAC;AAclD,QAAA,MAAM,SAAS,EAAE,SAsIhB,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/dist/es6/v14-tokens/migrateColorTokens.js

@@ -0,0 +1,101 @@
+import { addMissingImports, filterOutImports } from '../v13.2/utils';
+import { transformObjectPropertyRecursively } from './utils/transformObjectPropertyRecursively';
+import { mapping } from '../v13.2/mapping';
+import baseMapping from './baseMapping';
+const canvasImportSources = [
+    '@workday/canvas-kit-styling',
+    '@workday/canvas-kit-react/tokens',
+    '@workday/canvas-tokens-web',
+];
+const transform = (file, api) => {
+    const j = api.jscodeshift;
+    const root = j(file.source);
+    let importDeclaration = {};
+    const checkImport = (value) => Object.keys(importDeclaration).includes(value);
+    root
+        .find(j.ImportDeclaration, {
+        source: { value: (value) => canvasImportSources.includes(value) },
+    })
+        .forEach(nodePath => {
+        importDeclaration = { ...importDeclaration, ...filterOutImports(nodePath) };
+    });
+    if (!Object.values(importDeclaration).some(importedValue => importedValue === 'colors' || importedValue === 'base')) {
+        return root.toSource();
+    }
+    root
+        .find(j.CallExpression, {
+        callee: {
+            type: 'Identifier',
+        },
+    })
+        .forEach(nodePath => {
+        const name = nodePath.value.callee.name;
+        const stylesDeclaration = nodePath.value.arguments[0];
+        const isCanvasKitStyling = importDeclaration[name] === 'createStyles' || importDeclaration[name] === 'createStencil';
+        if (stylesDeclaration.type === 'ObjectExpression') {
+            stylesDeclaration.properties = stylesDeclaration.properties.map((prop) => transformObjectPropertyRecursively({ j, root }, prop, importDeclaration, isCanvasKitStyling));
+        }
+    });
+    root.find(j.ObjectExpression).forEach(nodePath => {
+        nodePath.value.properties = nodePath.value.properties.map((prop) => transformObjectPropertyRecursively({ j, root }, prop, importDeclaration));
+    });
+    root
+        .find(j.MemberExpression, (value) => {
+        return (value.type === 'MemberExpression' &&
+            checkImport(value.object.name) &&
+            Object.keys(baseMapping).includes(value.property.name));
+    })
+        .replaceWith(nodePath => {
+        const mainWrapper = nodePath.value.object;
+        if (mainWrapper.type === 'Identifier' && importDeclaration[mainWrapper.name] !== 'type') {
+            const mainObject = mainWrapper;
+            const mainName = mainObject.name;
+            const lowestProperty = nodePath.value.property;
+            const importedName = importDeclaration[mainName];
+            const map = importedName === 'base' ? { type: 'base' } : mapping[importedName];
+            if (map.type === 'base' && lowestProperty.type === 'Identifier') {
+                const colorName = baseMapping[lowestProperty.name];
+                if (mainName === 'colors') {
+                    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'), [
+                        j.memberExpression(j.identifier(map.type), j.identifier(colorName || lowestProperty.name)),
+                    ]);
+                }
+                if (mainName === 'base') {
+                    addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['base'] });
+                    return j.memberExpression(j.identifier(map.type), j.identifier(colorName));
+                }
+            }
+        }
+        return nodePath;
+    });
+    // Filter out base imports if no base tokens are used
+    root
+        .find(j.ImportDeclaration, {
+        source: { value: (value) => canvasImportSources.includes(value) },
+    })
+        .forEach(nodePath => {
+        var _a;
+        nodePath.value.specifiers = (_a = nodePath.value.specifiers) === null || _a === void 0 ? void 0 : _a.filter(specifier => {
+            if (specifier.type === 'ImportSpecifier' && specifier.local) {
+                const localName = specifier.local.name.toString();
+                const importedName = specifier.imported.name.toString();
+                if (importedName === 'base') {
+                    const nodes = root
+                        .find(j.MemberExpression, {
+                        object: {
+                            type: 'Identifier',
+                            name: localName,
+                        },
+                    })
+                        .nodes();
+                    return nodes.length;
+                }
+            }
+            return true;
+        });
+    });
+    return root.toSource();
+};
+export default transform;

package/dist/es6/v14-tokens/utils/transformObjectPropertyRecursively.d.ts

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

package/dist/es6/v14-tokens/utils/transformObjectPropertyRecursively.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"transformObjectPropertyRecursively.d.ts","sourceRoot":"","sources":["../../../../lib/v14-tokens/utils/transformObjectPropertyRecursively.ts"],"names":[],"mappings":"AAiDA,eAAO,MAAM,kCAAkC,gBAClC,GAAG,YACJ,GAAG;;wBAEQ,OAAO,KAC3B,GAuNF,CAAC"}

package/dist/es6/v14-tokens/utils/transformObjectPropertyRecursively.js

@@ -0,0 +1,141 @@
+import { systemColors } from '../../v13.2/mapping';
+import { addMissingImports } from '../../v13.2/utils/addMissingImports';
+import { varToMemberExpression } from '../../v13.2/utils/varToMemberExpression';
+import baseMapping from '../baseMapping';
+const checkSystemColors = (property) => {
+    var _a;
+    return (_a = Object.entries(systemColors).find(([blockKey]) => blockKey
+        .split(',')
+        .some(prop => property.key.type === 'Identifier' && prop === property.key.name))) === null || _a === void 0 ? void 0 : _a[1];
+};
+const updateArguments = ({ j, root }, expr, property, importDeclaration) => {
+    return expr.arguments.map((arg) => {
+        var _a;
+        if (arg.type === 'MemberExpression' &&
+            arg.object.type === 'Identifier' &&
+            arg.property.type === 'Identifier') {
+            const tokens = (_a = Object.entries(systemColors).find(([blockKey]) => blockKey
+                .split(',')
+                .some(prop => property.key.type === 'Identifier' && prop === property.key.name))) === null || _a === void 0 ? void 0 : _a[1];
+            const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[arg.property.name];
+            if (colorToken &&
+                (importDeclaration[arg.object.name] === 'colors' ||
+                    importDeclaration[arg.object.name] === 'base')) {
+                addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
+                return varToMemberExpression(j, colorToken);
+            }
+        }
+        return arg;
+    });
+};
+export const transformObjectPropertyRecursively = ({ j, root }, property, importDeclaration, isCanvasKitStyling) => {
+    var _a;
+    if (property.type === 'ObjectProperty' &&
+        property.key.type === 'Identifier' &&
+        property.value.type === 'MemberExpression' &&
+        property.value.object.type === 'Identifier' &&
+        property.value.property.type === 'Identifier') {
+        const cssProperty = property.key.name;
+        const tokens = (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === cssProperty))) === null || _a === void 0 ? void 0 : _a[1];
+        const { property: value, object: { name }, } = property.value;
+        const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[value.name];
+        if (colorToken) {
+            if (importDeclaration[name] === 'colors') {
+                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(cssProperty), isCanvasKitStyling
+                    ? varToMemberExpression(j, colorToken)
+                    : j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, colorToken)]));
+            }
+            if (importDeclaration[property.value.object.name] === 'base') {
+                addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
+                return j.objectProperty(j.identifier(cssProperty), varToMemberExpression(j, colorToken));
+            }
+        }
+        else {
+            const baseToken = baseMapping[property.value.property.name];
+            if (baseToken) {
+                addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['base'] });
+                return j.objectProperty(j.identifier(cssProperty), j.memberExpression(j.identifier('base'), j.identifier(baseToken)));
+            }
+        }
+        return property;
+    }
+    if (property.value.type === 'CallExpression') {
+        property.value.arguments = updateArguments({ j, root }, property.value, property, importDeclaration);
+    }
+    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') {
+                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) {
+                    if (importDeclaration[expr.object.name] === 'colors') {
+                        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),
+                        ]);
+                    }
+                    if (importDeclaration[expr.object.name] === 'base') {
+                        addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
+                        return j.memberExpression(j.identifier('base'), j.identifier(colorToken));
+                    }
+                }
+            }
+            if (expr.type === 'CallExpression') {
+                expr.arguments = updateArguments({ j, root }, expr, property, importDeclaration);
+            }
+            return expr;
+        });
+        return j.objectProperty(property.key, j.templateLiteral(transformedQuasis, transformedExpressions));
+    }
+    if (property.type === 'ObjectProperty' && property.value.type === 'ConditionalExpression') {
+        const { test, consequent, alternate } = property.value;
+        const tokens = checkSystemColors(property);
+        let consequentNode = consequent;
+        let alternateNode = alternate;
+        if (consequent.type === 'MemberExpression' &&
+            consequent.object.type === 'Identifier' &&
+            consequent.property.type === 'Identifier') {
+            const consequentColorToken = tokens === null || tokens === void 0 ? void 0 : tokens[consequent.property.name];
+            if (consequentColorToken) {
+                addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
+                addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
+                consequentNode = j.callExpression(j.identifier('cssVar'), [
+                    varToMemberExpression(j, consequentColorToken),
+                ]);
+            }
+        }
+        if (consequent.type === 'CallExpression') {
+            consequent.arguments = updateArguments({ j, root }, consequent, property, importDeclaration);
+        }
+        if (alternate.type === 'MemberExpression' &&
+            alternate.object.type === 'Identifier' &&
+            alternate.property.type === 'Identifier') {
+            const alternateColorToken = tokens === null || tokens === void 0 ? void 0 : tokens[alternate.property.name];
+            if (alternateColorToken) {
+                addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
+                addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
+                alternateNode = j.callExpression(j.identifier('cssVar'), [
+                    varToMemberExpression(j, alternateColorToken),
+                ]);
+            }
+        }
+        if (alternate.type === 'CallExpression') {
+            alternate.arguments = updateArguments({ j, root }, alternate, property, importDeclaration);
+        }
+        return j.objectProperty(property.key, j.conditionalExpression(test, consequentNode, alternateNode));
+    }
+    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 property;
+};

package/index.js

@@ -102,6 +102,13 @@ const {
       describe: chalk.gray('The path to execute the transform in (recursively).'),
     });
   })
+  .command('v14-tokens [path]', chalk.gray('Canvas Kit v13 > v14 upgrade 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": "14.0.0-alpha.1239-next.0",
+  "version": "14.0.0-alpha.1251-next.0",
   "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": "fdb8b845a09a86de1fb0a383fb3c5def6016e064"
+  "gitHead": "74f6a6aa07c8b1689b37208aed829b22b162acf0"
 }