@workday/canvas-kit-codemod 13.2.43 → 13.2.44

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,3 +1,4 @@
1
+ export declare const paletteNames: string[];
1
2
  export declare const mapping: {
2
3
  readonly colors: {
3
4
  readonly type: "base";
@@ -1 +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"}
1
+ {"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"}
@@ -1,4 +1,34 @@
1
1
  import { generateLevelTokens } from '../utils/generateLevelTokens';
2
+ export const paletteNames = [
3
+ 'cinnamon',
4
+ 'peach',
5
+ 'chiliMango',
6
+ 'cantaloupe',
7
+ 'sourLemon',
8
+ 'juicyPear',
9
+ 'kiwi',
10
+ 'greenApple',
11
+ 'watermelon',
12
+ 'jewel',
13
+ 'toothpaste',
14
+ 'blueberry',
15
+ 'plum',
16
+ 'berrySmoothie',
17
+ 'blackberry',
18
+ 'islandPunch',
19
+ 'grapeSoda',
20
+ 'pomegranate',
21
+ 'fruitPunch',
22
+ 'rootBeer',
23
+ 'toastedMarshmallow',
24
+ 'licorice',
25
+ 'soap',
26
+ 'frenchVanilla',
27
+ 'blackPepper',
28
+ 'coconut',
29
+ 'cappuccino',
30
+ 'dragonFruit',
31
+ ];
2
32
  const typeLevelsMap = {
3
33
  subtext: {
4
34
  small: generateLevelTokens(['subtext', 'small']),
@@ -1 +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"}
1
+ {"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"}
@@ -1,5 +1,5 @@
1
- import { addMissingImports, filterOutImports, transformObjectPropertyRecursively, varToMemberExpression, } from './utils';
2
- import { mapping } from './mapping';
1
+ import { addMissingImports, filterOutImports, getImports, transformObjectPropertyRecursively, varToMemberExpression, } from './utils';
2
+ import { mapping, paletteNames } from './mapping';
3
3
  const canvasImportSources = [
4
4
  '@workday/canvas-kit-styling',
5
5
  '@workday/canvas-kit-react/tokens',
@@ -15,7 +15,7 @@ const transform = (file, api) => {
15
15
  source: { value: (value) => canvasImportSources.includes(value) },
16
16
  })
17
17
  .forEach(nodePath => {
18
- importDeclaration = { ...importDeclaration, ...filterOutImports(nodePath, 'colors') };
18
+ importDeclaration = { ...importDeclaration, ...getImports(nodePath) };
19
19
  });
20
20
  if (!Object.values(importDeclaration).includes('colors')) {
21
21
  return root.toSource();
@@ -91,7 +91,9 @@ const transform = (file, api) => {
91
91
  return j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, token)]);
92
92
  }
93
93
  }
94
- if ((map === null || map === void 0 ? void 0 : map.type) === 'base' && lowestProperty.type === 'Identifier') {
94
+ if ((map === null || map === void 0 ? void 0 : map.type) === 'base' &&
95
+ lowestProperty.type === 'Identifier' &&
96
+ paletteNames.some(name => lowestProperty.name.includes(name))) {
95
97
  addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['base'] });
96
98
  addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
97
99
  return j.callExpression(j.identifier('cssVar'), [
@@ -101,6 +103,13 @@ const transform = (file, api) => {
101
103
  }
102
104
  return nodePath.value;
103
105
  });
106
+ root
107
+ .find(j.ImportDeclaration, {
108
+ source: { value: (value) => canvasImportSources.includes(value) },
109
+ })
110
+ .forEach(nodePath => {
111
+ filterOutImports({ root, j }, nodePath, 'colors');
112
+ });
104
113
  return root.toSource();
105
114
  };
106
115
  export default transform;
@@ -1 +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"}
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,SA6KhB,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -1,4 +1,4 @@
1
- import { addMissingImports, filterOutImports } from './utils';
1
+ import { addMissingImports, filterOutImports, getImports } from './utils';
2
2
  const canvasImportSources = [
3
3
  '@workday/canvas-kit-styling',
4
4
  '@workday/canvas-kit-react/tokens',
@@ -14,7 +14,7 @@ const transform = (file, api) => {
14
14
  source: { value: (value) => canvasImportSources.includes(value) },
15
15
  })
16
16
  .forEach(nodePath => {
17
- importDeclaration = { ...importDeclaration, ...filterOutImports(nodePath, 'depth') };
17
+ importDeclaration = { ...importDeclaration, ...getImports(nodePath) };
18
18
  });
19
19
  if (!Object.values(importDeclaration).includes('depth')) {
20
20
  return root.toSource();
@@ -25,7 +25,7 @@ const transform = (file, api) => {
25
25
  type: 'MemberExpression',
26
26
  object: {
27
27
  type: 'Identifier',
28
- name: 'depth',
28
+ name: (name) => importDeclaration[name] === 'depth',
29
29
  },
30
30
  property: {
31
31
  type: 'NumericLiteral',
@@ -36,17 +36,18 @@ const transform = (file, api) => {
36
36
  const argument = nodePath.value.argument;
37
37
  if (argument.type === 'MemberExpression' && argument.property.type === 'NumericLiteral') {
38
38
  const depthValue = argument.property.value;
39
+ const isDepthNotZero = depthValue > 0;
39
40
  addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
40
- if (depthValue > 0) {
41
+ if (isDepthNotZero) {
41
42
  addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
42
43
  }
43
- return depthValue > 0
44
+ return isDepthNotZero
44
45
  ? j.objectProperty(j.identifier('boxShadow'), j.callExpression(j.identifier('cssVar'), [
45
46
  j.memberExpression(j.memberExpression(j.identifier('system'), j.identifier('depth')), j.numericLiteral(depthValue), true),
46
47
  ]))
47
48
  : j.objectProperty(j.identifier('boxShadow'), j.literal('none'));
48
49
  }
49
- return nodePath;
50
+ return nodePath.value;
50
51
  });
51
52
  root
52
53
  .find(j.MemberExpression, (value) => {
@@ -69,7 +70,7 @@ const transform = (file, api) => {
69
70
  j.memberExpression(j.memberExpression(j.identifier('system'), j.identifier('depth')), j.numericLiteral(value), true),
70
71
  ]);
71
72
  }
72
- return nodePath;
73
+ return nodePath.value;
73
74
  });
74
75
  root
75
76
  .find(j.MemberExpression, (value) => {
@@ -103,6 +104,13 @@ const transform = (file, api) => {
103
104
  }
104
105
  return nodePath.value;
105
106
  });
107
+ root
108
+ .find(j.ImportDeclaration, {
109
+ source: { value: (value) => canvasImportSources.includes(value) },
110
+ })
111
+ .forEach(nodePath => {
112
+ filterOutImports({ root, j }, nodePath, 'depth');
113
+ });
106
114
  return root.toSource();
107
115
  };
108
116
  export default transform;
@@ -1 +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"}
1
+ {"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"}
@@ -1,5 +1,5 @@
1
- import { addMissingImports, filterOutImports, varToMemberExpression } from './utils';
2
- import { mapping, systemColors } from './mapping';
1
+ import { addMissingImports, filterOutImports, getImports, transformObjectPropertyRecursively, } from './utils';
2
+ import { mapping } from './mapping';
3
3
  const canvasImportSources = [
4
4
  '@workday/canvas-kit-styling',
5
5
  '@workday/canvas-kit-react/tokens',
@@ -18,7 +18,7 @@ const transform = (file, api) => {
18
18
  .forEach(nodePath => {
19
19
  importDeclaration = {
20
20
  ...importDeclaration,
21
- ...filterOutImports(nodePath, tokens),
21
+ ...getImports(nodePath),
22
22
  };
23
23
  });
24
24
  if (!Object.values(importDeclaration).some(value => tokens.includes(value))) {
@@ -35,57 +35,7 @@ const transform = (file, api) => {
35
35
  const stylesDeclaration = nodePath.value.arguments[0];
36
36
  const isCanvasKitStyling = importDeclaration[name] === 'createStyles' || importDeclaration[name] === 'createStencil';
37
37
  if ((stylesDeclaration === null || stylesDeclaration === void 0 ? void 0 : stylesDeclaration.type) === 'ObjectExpression') {
38
- const transformProperty = (property) => {
39
- var _a;
40
- if (property.type === 'ObjectProperty' &&
41
- property.key.type === 'Identifier' &&
42
- property.value.type === 'MemberExpression' &&
43
- property.value.object.type === 'Identifier' &&
44
- property.value.property.type === 'Identifier' &&
45
- tokens.includes(importDeclaration[property.value.object.name])) {
46
- const key = property.key.name;
47
- const tokens = (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === key))) === null || _a === void 0 ? void 0 : _a[1];
48
- const { property: value } = property.value;
49
- const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[value.name];
50
- if (colorToken) {
51
- if (!isCanvasKitStyling) {
52
- addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
53
- }
54
- addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
55
- return j.objectProperty(j.identifier(key), isCanvasKitStyling
56
- ? varToMemberExpression(j, colorToken)
57
- : j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, colorToken)]));
58
- }
59
- }
60
- if (property.type === 'ObjectProperty' && property.value.type === 'TemplateLiteral') {
61
- const templateLiteral = property.value;
62
- const transformedQuasis = templateLiteral.quasis.map((quasi) => quasi);
63
- const transformedExpressions = templateLiteral.expressions.map((expr) => {
64
- var _a;
65
- if (expr.type === 'MemberExpression' &&
66
- expr.object.type === 'Identifier' &&
67
- expr.property.type === 'Identifier' &&
68
- tokens.includes(importDeclaration[expr.object.name])) {
69
- const tokens = (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === property.key.name))) === null || _a === void 0 ? void 0 : _a[1];
70
- const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[expr.property.name];
71
- if (colorToken) {
72
- addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
73
- addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
74
- return j.callExpression(j.identifier('cssVar'), [
75
- varToMemberExpression(j, colorToken),
76
- ]);
77
- }
78
- }
79
- return expr;
80
- });
81
- return j.objectProperty(property.key, j.templateLiteral(transformedQuasis, transformedExpressions));
82
- }
83
- if (property.type === 'ObjectProperty' && property.value.type === 'ObjectExpression') {
84
- return j.objectProperty(property.key, j.objectExpression(property.value.properties.map(transformProperty)));
85
- }
86
- return property;
87
- };
88
- stylesDeclaration.properties = stylesDeclaration.properties.map(transformProperty);
38
+ stylesDeclaration.properties = stylesDeclaration.properties.map((prop) => transformObjectPropertyRecursively({ j, root }, prop, importDeclaration, isCanvasKitStyling, [...tokens]));
89
39
  }
90
40
  });
91
41
  root
@@ -107,6 +57,10 @@ const transform = (file, api) => {
107
57
  if (['space', 'borderRadius'].includes(importedName) &&
108
58
  (map === null || map === void 0 ? void 0 : map.type) === 'system' &&
109
59
  lowestProperty.type === 'Identifier') {
60
+ const newValue = map.keys[lowestProperty.name];
61
+ if (!newValue) {
62
+ return nodePath.value;
63
+ }
110
64
  addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
111
65
  addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
112
66
  return j.callExpression(j.identifier('cssVar'), [
@@ -116,6 +70,13 @@ const transform = (file, api) => {
116
70
  }
117
71
  return nodePath.value;
118
72
  });
73
+ root
74
+ .find(j.ImportDeclaration, {
75
+ source: { value: (value) => canvasImportSources.includes(value) },
76
+ })
77
+ .forEach(nodePath => {
78
+ filterOutImports({ root, j }, nodePath, tokens);
79
+ });
119
80
  return root.toSource();
120
81
  };
121
82
  export default transform;
@@ -1 +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"}
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,SA2OhB,CAAC;AAEF,eAAe,SAAS,CAAC"}
@@ -1,4 +1,4 @@
1
- import { addMissingImports, filterOutImports, varToMemberExpression } from './utils';
1
+ import { addMissingImports, filterOutImports, getImports, varToMemberExpression } from './utils';
2
2
  import { typeProps } from './mapping/typeProps';
3
3
  import { mapping } from './mapping';
4
4
  const canvasImportSources = ['@workday/canvas-kit-styling', '@workday/canvas-kit-react/tokens'];
@@ -12,7 +12,7 @@ const transform = (file, api) => {
12
12
  source: { value: (value) => canvasImportSources.includes(value) },
13
13
  })
14
14
  .forEach(nodePath => {
15
- importDeclaration = { ...importDeclaration, ...filterOutImports(nodePath, 'type') };
15
+ importDeclaration = { ...importDeclaration, ...getImports(nodePath) };
16
16
  });
17
17
  if (!Object.values(importDeclaration).includes('type')) {
18
18
  return root.toSource();
@@ -40,14 +40,26 @@ const transform = (file, api) => {
40
40
  const object = argument.object;
41
41
  const level = object.property.name;
42
42
  const size = argument.property.name;
43
- addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
44
- addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
45
- nodePath.insertAfter(j.objectProperty(j.identifier('color'), j.callExpression(j.identifier('cssVar'), [
46
- j.memberExpression(j.memberExpression(j.memberExpression(j.identifier('system'), j.identifier('color')), j.identifier('fg')), j.identifier(['heading', 'title'].includes(level) ? 'strong' : 'default')),
47
- ])));
48
- return [
49
- j.spreadElement(j.memberExpression(j.memberExpression(j.memberExpression(j.identifier('system'), j.identifier('type')), j.identifier(level)), j.identifier(size))),
50
- ];
43
+ const mapKeys = mapping.type.keys.levels.values;
44
+ const levelKeys = mapKeys[level] || {};
45
+ const tokens = levelKeys[size];
46
+ if (tokens) {
47
+ addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
48
+ addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
49
+ const properties = typeProps
50
+ .filter(prop => tokens[prop])
51
+ .map((key) => {
52
+ const tokenValue = tokens[key];
53
+ if (!tokenValue) {
54
+ return null;
55
+ }
56
+ return j.objectProperty(j.identifier(key), j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, tokenValue)]));
57
+ })
58
+ .filter((prop) => prop !== null);
59
+ // Replace the spread element with individual properties
60
+ return properties;
61
+ }
62
+ return nodePath.value;
51
63
  });
52
64
  root
53
65
  .find(j.MemberExpression, (value) => {
@@ -104,7 +116,10 @@ const transform = (file, api) => {
104
116
  const lowestPropertyValue = lowestProperty.type === 'Identifier' ? lowestProperty.name : lowestProperty.value;
105
117
  const innerKey = innerProperty.name;
106
118
  if (mainProperty.name === 'properties') {
107
- const { name, values } = mapping.type.keys[innerKey];
119
+ const { name, values } = mapping.type.keys[innerKey] || {};
120
+ if (!name || !values) {
121
+ return nodePath.value;
122
+ }
108
123
  const newValue = values[lowestPropertyValue];
109
124
  addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
110
125
  if (newValue.includes('.')) {
@@ -134,6 +149,13 @@ const transform = (file, api) => {
134
149
  }
135
150
  return nodePath.value;
136
151
  });
152
+ root
153
+ .find(j.ImportDeclaration, {
154
+ source: { value: (value) => canvasImportSources.includes(value) },
155
+ })
156
+ .forEach(nodePath => {
157
+ filterOutImports({ root, j }, nodePath, 'type');
158
+ });
137
159
  return root.toSource();
138
160
  };
139
161
  export default transform;
@@ -1,5 +1,8 @@
1
1
  import { ASTPath, ImportDeclaration } from 'jscodeshift';
2
2
  type ImportType = 'colors' | 'depth' | 'space' | 'type' | 'borderRadius';
3
- export declare const filterOutImports: (nodePath: ASTPath<ImportDeclaration>, type: ImportType | ImportType[]) => Record<string, string>;
3
+ export declare const filterOutImports: ({ root, j }: {
4
+ root: any;
5
+ j: any;
6
+ }, nodePath: ASTPath<ImportDeclaration>, type: ImportType | ImportType[]) => Record<string, string>;
4
7
  export {};
5
8
  //# sourceMappingURL=filterOutImports.d.ts.map
@@ -1 +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"}
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;UACT,GAAG;OAAK,GAAG;aACnB,QAAQ,iBAAiB,CAAC,QAC9B,UAAU,GAAG,UAAU,EAAE,2BA0ChC,CAAC"}
@@ -4,18 +4,29 @@ const canvasImportSources = [
4
4
  '@workday/canvas-space-web',
5
5
  '@workday/canvas-depth-web',
6
6
  ];
7
- export const filterOutImports = (nodePath, type) => {
7
+ export const filterOutImports = ({ root, j }, nodePath, type) => {
8
8
  var _a, _b;
9
9
  const importName = {};
10
10
  nodePath.value.specifiers = (_a = nodePath.value.specifiers) === null || _a === void 0 ? void 0 : _a.filter(specifier => {
11
11
  if (specifier.type === 'ImportSpecifier' && specifier.local) {
12
+ let isInstanceExist = false;
12
13
  const localName = specifier.local.name.toString();
13
14
  const importedName = specifier.imported.name.toString();
14
15
  importName[localName] = importedName;
15
- return !(((typeof type === 'string' && importedName.toLowerCase().includes(type)) ||
16
- type.includes(importedName)) &&
17
- typeof nodePath.value.source.value === 'string' &&
18
- canvasImportSources.includes(nodePath.value.source.value));
16
+ root
17
+ .find(j.MemberExpression, {
18
+ object: {
19
+ name: importedName,
20
+ },
21
+ })
22
+ .forEach(() => {
23
+ isInstanceExist = true;
24
+ });
25
+ return (isInstanceExist ||
26
+ !(((typeof type === 'string' && importedName.toLowerCase().includes(type)) ||
27
+ type.includes(importedName)) &&
28
+ typeof nodePath.value.source.value === 'string' &&
29
+ canvasImportSources.includes(nodePath.value.source.value)));
19
30
  }
20
31
  return true;
21
32
  });
@@ -0,0 +1,3 @@
1
+ import { ASTPath, ImportDeclaration } from 'jscodeshift';
2
+ export declare const getImports: (nodePath: ASTPath<ImportDeclaration>) => Record<string, string>;
3
+ //# sourceMappingURL=getImports.d.ts.map
@@ -0,0 +1 @@
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"}
@@ -0,0 +1,12 @@
1
+ export const getImports = (nodePath) => {
2
+ var _a;
3
+ const importName = {};
4
+ (_a = nodePath.value.specifiers) === null || _a === void 0 ? void 0 : _a.forEach(specifier => {
5
+ if (specifier.type === 'ImportSpecifier' && specifier.local) {
6
+ const localName = specifier.local.name.toString();
7
+ const importedName = specifier.imported.name.toString();
8
+ importName[localName] = importedName;
9
+ }
10
+ });
11
+ return importName;
12
+ };
@@ -1,5 +1,6 @@
1
1
  export * from './addMissingImports';
2
2
  export * from './filterOutImports';
3
+ export * from './getImports';
3
4
  export * from './generateLevelTokens';
4
5
  export * from './expectTransformFactory';
5
6
  export * from './varToMemberExpression';
@@ -1 +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"}
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,cAAc,CAAC;AAC7B,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,sCAAsC,CAAC"}
@@ -1,5 +1,6 @@
1
1
  export * from './addMissingImports';
2
2
  export * from './filterOutImports';
3
+ export * from './getImports';
3
4
  export * from './generateLevelTokens';
4
5
  export * from './expectTransformFactory';
5
6
  export * from './varToMemberExpression';
@@ -1,4 +1,4 @@
1
1
  export declare const transformObjectPropertyRecursively: ({ j, root }: any, property: any, importDeclaration: {
2
2
  [key: string]: any;
3
- }, isCanvasKitStyling?: boolean) => any;
3
+ }, isCanvasKitStyling?: boolean, tokenTypes?: string[]) => any;
4
4
  //# sourceMappingURL=transformObjectPropertyRecursively.d.ts.map
@@ -1 +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"}
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,eACf,MAAM,EAAE,KACpB,GA2PF,CAAC"}
@@ -1,26 +1,60 @@
1
- import { systemColors } from '../mapping';
1
+ import { mapping, systemColors } from '../mapping';
2
2
  import { addMissingImports } from './addMissingImports';
3
3
  import { varToMemberExpression } from './varToMemberExpression';
4
- export const transformObjectPropertyRecursively = ({ j, root }, property, importDeclaration, isCanvasKitStyling) => {
4
+ export const transformObjectPropertyRecursively = ({ j, root }, property, importDeclaration, isCanvasKitStyling, tokenTypes) => {
5
5
  var _a, _b, _c;
6
+ // Helper to create object property preserving computed flag
7
+ const createObjectProperty = (key, value) => {
8
+ var _a, _b, _c;
9
+ const prop = j.objectProperty(key, value);
10
+ // Preserve computed flag: if explicitly true, or if key is not a simple literal/identifier
11
+ if (property.computed === true ||
12
+ (((_a = property.key) === null || _a === void 0 ? void 0 : _a.type) !== 'Identifier' &&
13
+ ((_b = property.key) === null || _b === void 0 ? void 0 : _b.type) !== 'StringLiteral' &&
14
+ ((_c = property.key) === null || _c === void 0 ? void 0 : _c.type) !== 'NumericLiteral')) {
15
+ prop.computed = true;
16
+ }
17
+ return prop;
18
+ };
6
19
  if (property.type === 'ObjectProperty' &&
7
20
  property.key.type === 'Identifier' &&
8
21
  property.value.type === 'MemberExpression' &&
9
22
  property.value.object.type === 'Identifier' &&
10
- property.value.property.type === 'Identifier' &&
11
- importDeclaration[property.value.object.name] === 'colors') {
12
- const key = property.key.name;
13
- const tokens = (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === key))) === null || _a === void 0 ? void 0 : _a[1];
14
- const { property: value } = property.value;
15
- const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[value.name];
16
- if (colorToken) {
17
- if (!isCanvasKitStyling) {
18
- addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
23
+ property.value.property.type === 'Identifier') {
24
+ const importedTokenName = importDeclaration[property.value.object.name];
25
+ // Handle colors tokens
26
+ if (importedTokenName === 'colors' && (!tokenTypes || tokenTypes.includes('colors'))) {
27
+ const key = property.key.name;
28
+ const tokens = (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === key))) === null || _a === void 0 ? void 0 : _a[1];
29
+ const { property: value } = property.value;
30
+ const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[value.name];
31
+ if (colorToken) {
32
+ if (!isCanvasKitStyling) {
33
+ addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
34
+ }
35
+ addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
36
+ return createObjectProperty(property.key, isCanvasKitStyling
37
+ ? varToMemberExpression(j, colorToken)
38
+ : j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, colorToken)]));
39
+ }
40
+ }
41
+ // Handle space and borderRadius tokens
42
+ if (tokenTypes &&
43
+ tokenTypes.includes(importedTokenName) &&
44
+ ['space', 'borderRadius'].includes(importedTokenName)) {
45
+ const map = mapping[importedTokenName];
46
+ const propertyName = property.value.property.name;
47
+ if ((map === null || map === void 0 ? void 0 : map.type) === 'system' && map.keys) {
48
+ const newValue = map.keys[propertyName];
49
+ if (newValue) {
50
+ if (!isCanvasKitStyling) {
51
+ addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
52
+ }
53
+ addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
54
+ const tokenPath = j.memberExpression(j.memberExpression(j.identifier(map.type), j.identifier(map.name)), j.identifier(newValue));
55
+ return createObjectProperty(property.key, isCanvasKitStyling ? tokenPath : j.callExpression(j.identifier('cssVar'), [tokenPath]));
56
+ }
19
57
  }
20
- addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
21
- return j.objectProperty(j.identifier(key), isCanvasKitStyling
22
- ? varToMemberExpression(j, colorToken)
23
- : j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, colorToken)]));
24
58
  }
25
59
  }
26
60
  if (property.type === 'ObjectProperty' && property.value.type === 'TemplateLiteral') {
@@ -30,19 +64,41 @@ export const transformObjectPropertyRecursively = ({ j, root }, property, import
30
64
  var _a;
31
65
  if (expr.type === 'MemberExpression' &&
32
66
  expr.object.type === 'Identifier' &&
33
- expr.property.type === 'Identifier' &&
34
- importDeclaration[expr.object.name] === 'colors') {
35
- const tokens = (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === property.key.name))) === null || _a === void 0 ? void 0 : _a[1];
36
- const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[expr.property.name];
37
- if (colorToken) {
38
- addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
39
- addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
40
- return j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, colorToken)]);
67
+ expr.property.type === 'Identifier') {
68
+ const importedTokenName = importDeclaration[expr.object.name];
69
+ // Handle colors tokens
70
+ if (importedTokenName === 'colors' && (!tokenTypes || tokenTypes.includes('colors'))) {
71
+ const keyName = property.key.type === 'Identifier' ? property.key.name : null;
72
+ const tokens = keyName
73
+ ? (_a = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === keyName))) === null || _a === void 0 ? void 0 : _a[1]
74
+ : null;
75
+ const colorToken = tokens === null || tokens === void 0 ? void 0 : tokens[expr.property.name];
76
+ if (colorToken) {
77
+ addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
78
+ addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
79
+ return j.callExpression(j.identifier('cssVar'), [varToMemberExpression(j, colorToken)]);
80
+ }
81
+ }
82
+ // Handle space and borderRadius tokens
83
+ if (tokenTypes &&
84
+ tokenTypes.includes(importedTokenName) &&
85
+ ['space', 'borderRadius'].includes(importedTokenName)) {
86
+ const map = mapping[importedTokenName];
87
+ const propertyName = expr.property.name;
88
+ if ((map === null || map === void 0 ? void 0 : map.type) === 'system' && map.keys) {
89
+ const newValue = map.keys[propertyName];
90
+ if (newValue) {
91
+ addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
92
+ addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
93
+ const tokenPath = j.memberExpression(j.memberExpression(j.identifier(map.type), j.identifier(map.name)), j.identifier(newValue));
94
+ return j.callExpression(j.identifier('cssVar'), [tokenPath]);
95
+ }
96
+ }
41
97
  }
42
98
  }
43
99
  return expr;
44
100
  });
45
- return j.objectProperty(property.key, j.templateLiteral(transformedQuasis, transformedExpressions));
101
+ return createObjectProperty(property.key, j.templateLiteral(transformedQuasis, transformedExpressions));
46
102
  }
47
103
  if (property.type === 'ObjectProperty' && property.value.type === 'ConditionalExpression') {
48
104
  const { test, consequent, alternate } = property.value;
@@ -54,14 +110,19 @@ export const transformObjectPropertyRecursively = ({ j, root }, property, import
54
110
  alternate.object.type === 'Identifier' &&
55
111
  alternate.property.type === 'Identifier' &&
56
112
  importDeclaration[alternate.object.name] === 'colors') {
57
- const consequentTokens = (_b = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === property.key.name))) === null || _b === void 0 ? void 0 : _b[1];
58
- const alternateTokens = (_c = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === property.key.name))) === null || _c === void 0 ? void 0 : _c[1];
113
+ const keyName = property.key.type === 'Identifier' ? property.key.name : null;
114
+ const consequentTokens = keyName
115
+ ? (_b = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === keyName))) === null || _b === void 0 ? void 0 : _b[1]
116
+ : null;
117
+ const alternateTokens = keyName
118
+ ? (_c = Object.entries(systemColors).find(([blockKey]) => blockKey.split(',').some(prop => prop === keyName))) === null || _c === void 0 ? void 0 : _c[1]
119
+ : null;
59
120
  const consequentColorToken = consequentTokens === null || consequentTokens === void 0 ? void 0 : consequentTokens[consequent.property.name];
60
121
  const alternateColorToken = alternateTokens === null || alternateTokens === void 0 ? void 0 : alternateTokens[alternate.property.name];
61
122
  if (consequentColorToken && alternateColorToken) {
62
123
  addMissingImports({ j, root }, { importPath: '@workday/canvas-kit-styling', specifiers: ['cssVar'] });
63
124
  addMissingImports({ j, root }, { importPath: '@workday/canvas-tokens-web', specifiers: ['system'] });
64
- return j.objectProperty(property.key, j.conditionalExpression(test, j.callExpression(j.identifier('cssVar'), [
125
+ return createObjectProperty(property.key, j.conditionalExpression(test, j.callExpression(j.identifier('cssVar'), [
65
126
  varToMemberExpression(j, consequentColorToken),
66
127
  ]), j.callExpression(j.identifier('cssVar'), [
67
128
  varToMemberExpression(j, alternateColorToken),
@@ -70,7 +131,7 @@ export const transformObjectPropertyRecursively = ({ j, root }, property, import
70
131
  }
71
132
  }
72
133
  if (property.type === 'ObjectProperty' && property.value.type === 'ObjectExpression') {
73
- return j.objectProperty(property.key, j.objectExpression(property.value.properties.map((prop) => transformObjectPropertyRecursively({ j, root }, prop, importDeclaration, isCanvasKitStyling))));
134
+ return createObjectProperty(property.key, j.objectExpression(property.value.properties.map((prop) => transformObjectPropertyRecursively({ j, root }, prop, importDeclaration, isCanvasKitStyling, tokenTypes))));
74
135
  }
75
136
  return property;
76
137
  };
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@workday/canvas-kit-codemod",
3
3
  "author": "Workday, Inc. (https://www.workday.com)",
4
4
  "license": "Apache-2.0",
5
- "version": "13.2.43",
5
+ "version": "13.2.44",
6
6
  "description": "A collection of codemods for use on Workday Canvas Kit packages.",
7
7
  "main": "dist/es6/index.js",
8
8
  "sideEffects": false,
@@ -46,5 +46,5 @@
46
46
  "resolutions": {
47
47
  "recast": "0.20.4"
48
48
  },
49
- "gitHead": "90bc7321a9d24b04f2e816ab8d7d33cb81f2edb0"
49
+ "gitHead": "c263cac94c8e7fe150a96f133a6fd436ec64798b"
50
50
  }