@compiled/react 0.6.12 → 0.9.0

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.
Files changed (219) hide show
  1. package/CHANGELOG.md +26 -0
  2. package/dist/browser/class-names/index.d.ts +2 -2
  3. package/dist/browser/class-names/index.js.flow +45 -0
  4. package/dist/browser/css/index.d.ts +17 -3
  5. package/dist/browser/css/index.js +4 -12
  6. package/dist/browser/css/index.js.flow +35 -0
  7. package/dist/browser/css/index.js.map +1 -1
  8. package/dist/browser/index.d.ts +4 -1
  9. package/dist/browser/index.js +1 -0
  10. package/dist/browser/index.js.flow +40 -0
  11. package/dist/browser/index.js.map +1 -1
  12. package/dist/browser/keyframes/__fixtures__/index.d.ts +3 -0
  13. package/dist/browser/keyframes/__fixtures__/index.js +12 -0
  14. package/dist/browser/keyframes/__fixtures__/index.js.map +1 -0
  15. package/dist/browser/keyframes/index.d.ts +47 -0
  16. package/dist/browser/keyframes/index.js +9 -0
  17. package/dist/browser/keyframes/index.js.flow +54 -0
  18. package/dist/browser/keyframes/index.js.map +1 -0
  19. package/dist/browser/runtime/ax.js.flow +27 -0
  20. package/dist/browser/runtime/css-custom-property.js.flow +19 -0
  21. package/dist/browser/runtime/dev-warnings.d.ts +0 -1
  22. package/dist/browser/runtime/dev-warnings.js +1 -1
  23. package/dist/browser/runtime/dev-warnings.js.flow +7 -0
  24. package/dist/browser/runtime/dev-warnings.js.map +1 -1
  25. package/dist/browser/runtime/index.js.flow +10 -0
  26. package/dist/browser/runtime/is-node.js.flow +19 -0
  27. package/dist/browser/runtime/sheet.d.ts +1 -1
  28. package/dist/browser/runtime/sheet.js.flow +36 -0
  29. package/dist/browser/runtime/style-cache.d.ts +1 -1
  30. package/dist/browser/runtime/style-cache.js.flow +19 -0
  31. package/dist/browser/runtime/style.d.ts +1 -1
  32. package/dist/browser/runtime/style.js.flow +17 -0
  33. package/dist/browser/runtime/types.js.flow +23 -0
  34. package/dist/browser/runtime.js.flow +7 -0
  35. package/dist/browser/styled/index.d.ts +6 -9
  36. package/dist/browser/styled/index.js.flow +69 -0
  37. package/dist/browser/styled/index.js.map +1 -1
  38. package/dist/browser/types.d.ts +6 -3
  39. package/dist/browser/types.js.flow +29 -0
  40. package/dist/browser/utils/error.js.flow +7 -0
  41. package/dist/cjs/class-names/index.d.ts +2 -2
  42. package/dist/cjs/class-names/index.js.flow +45 -0
  43. package/dist/cjs/css/index.d.ts +17 -3
  44. package/dist/cjs/css/index.js +4 -12
  45. package/dist/cjs/css/index.js.flow +35 -0
  46. package/dist/cjs/css/index.js.map +1 -1
  47. package/dist/cjs/index.d.ts +4 -1
  48. package/dist/cjs/index.js +3 -1
  49. package/dist/cjs/index.js.flow +40 -0
  50. package/dist/cjs/index.js.map +1 -1
  51. package/dist/cjs/keyframes/__fixtures__/index.d.ts +3 -0
  52. package/dist/cjs/keyframes/__fixtures__/index.js +15 -0
  53. package/dist/cjs/keyframes/__fixtures__/index.js.map +1 -0
  54. package/dist/cjs/keyframes/index.d.ts +47 -0
  55. package/dist/cjs/keyframes/index.js +13 -0
  56. package/dist/cjs/keyframes/index.js.flow +54 -0
  57. package/dist/cjs/keyframes/index.js.map +1 -0
  58. package/dist/cjs/runtime/ax.js.flow +27 -0
  59. package/dist/cjs/runtime/css-custom-property.js.flow +19 -0
  60. package/dist/cjs/runtime/dev-warnings.d.ts +0 -1
  61. package/dist/cjs/runtime/dev-warnings.js +2 -3
  62. package/dist/cjs/runtime/dev-warnings.js.flow +7 -0
  63. package/dist/cjs/runtime/dev-warnings.js.map +1 -1
  64. package/dist/cjs/runtime/index.js.flow +10 -0
  65. package/dist/cjs/runtime/is-node.js.flow +19 -0
  66. package/dist/cjs/runtime/sheet.d.ts +1 -1
  67. package/dist/cjs/runtime/sheet.js.flow +36 -0
  68. package/dist/cjs/runtime/style-cache.d.ts +1 -1
  69. package/dist/cjs/runtime/style-cache.js.flow +19 -0
  70. package/dist/cjs/runtime/style.d.ts +1 -1
  71. package/dist/cjs/runtime/style.js.flow +17 -0
  72. package/dist/cjs/runtime/types.js.flow +23 -0
  73. package/dist/cjs/runtime.js.flow +7 -0
  74. package/dist/cjs/styled/index.d.ts +6 -9
  75. package/dist/cjs/styled/index.js.flow +69 -0
  76. package/dist/cjs/styled/index.js.map +1 -1
  77. package/dist/cjs/types.d.ts +6 -3
  78. package/dist/cjs/types.js.flow +29 -0
  79. package/dist/cjs/utils/error.js.flow +7 -0
  80. package/dist/esm/class-names/index.d.ts +2 -2
  81. package/dist/esm/class-names/index.js.flow +45 -0
  82. package/dist/esm/css/index.d.ts +17 -3
  83. package/dist/esm/css/index.js +4 -12
  84. package/dist/esm/css/index.js.flow +35 -0
  85. package/dist/esm/css/index.js.map +1 -1
  86. package/dist/esm/index.d.ts +4 -1
  87. package/dist/esm/index.js +1 -0
  88. package/dist/esm/index.js.flow +40 -0
  89. package/dist/esm/index.js.map +1 -1
  90. package/dist/esm/keyframes/__fixtures__/index.d.ts +3 -0
  91. package/dist/esm/keyframes/__fixtures__/index.js +12 -0
  92. package/dist/esm/keyframes/__fixtures__/index.js.map +1 -0
  93. package/dist/esm/keyframes/index.d.ts +47 -0
  94. package/dist/esm/keyframes/index.js +9 -0
  95. package/dist/esm/keyframes/index.js.flow +54 -0
  96. package/dist/esm/keyframes/index.js.map +1 -0
  97. package/dist/esm/runtime/ax.js.flow +27 -0
  98. package/dist/esm/runtime/css-custom-property.js.flow +19 -0
  99. package/dist/esm/runtime/dev-warnings.d.ts +0 -1
  100. package/dist/esm/runtime/dev-warnings.js +1 -1
  101. package/dist/esm/runtime/dev-warnings.js.flow +7 -0
  102. package/dist/esm/runtime/dev-warnings.js.map +1 -1
  103. package/dist/esm/runtime/index.js.flow +10 -0
  104. package/dist/esm/runtime/is-node.js.flow +19 -0
  105. package/dist/esm/runtime/sheet.d.ts +1 -1
  106. package/dist/esm/runtime/sheet.js.flow +36 -0
  107. package/dist/esm/runtime/style-cache.d.ts +1 -1
  108. package/dist/esm/runtime/style-cache.js.flow +19 -0
  109. package/dist/esm/runtime/style.d.ts +1 -1
  110. package/dist/esm/runtime/style.js.flow +17 -0
  111. package/dist/esm/runtime/types.js.flow +23 -0
  112. package/dist/esm/runtime.js.flow +7 -0
  113. package/dist/esm/styled/index.d.ts +6 -9
  114. package/dist/esm/styled/index.js.flow +69 -0
  115. package/dist/esm/styled/index.js.map +1 -1
  116. package/dist/esm/types.d.ts +6 -3
  117. package/dist/esm/types.js.flow +29 -0
  118. package/dist/esm/utils/error.js.flow +7 -0
  119. package/package.json +18 -20
  120. package/src/class-names/__tests__/types.test.js.flow +28 -0
  121. package/src/class-names/index.js.flow +45 -0
  122. package/src/class-names/index.tsx +2 -2
  123. package/src/css/__tests__/index.test.tsx +41 -0
  124. package/src/css/__tests__/types.test.js.flow +17 -0
  125. package/src/css/index.js.flow +35 -0
  126. package/src/css/index.tsx +26 -3
  127. package/src/index.js.flow +40 -0
  128. package/src/index.tsx +5 -2
  129. package/src/keyframes/__fixtures__/index.tsx +14 -0
  130. package/src/keyframes/__tests__/index.test.tsx +324 -0
  131. package/src/keyframes/__tests__/types.test.js.flow +31 -0
  132. package/src/keyframes/index.js.flow +54 -0
  133. package/src/keyframes/index.tsx +61 -0
  134. package/src/runtime/__tests__/style.test.tsx +91 -57
  135. package/src/runtime/ax.js.flow +27 -0
  136. package/src/runtime/css-custom-property.js.flow +19 -0
  137. package/src/runtime/dev-warnings.js.flow +7 -0
  138. package/src/runtime/dev-warnings.tsx +1 -1
  139. package/src/runtime/index.js.flow +10 -0
  140. package/src/runtime/is-node.js.flow +19 -0
  141. package/src/runtime/sheet.js.flow +36 -0
  142. package/src/runtime/sheet.tsx +1 -1
  143. package/src/runtime/style-cache.js.flow +19 -0
  144. package/src/runtime/style-cache.tsx +1 -1
  145. package/src/runtime/style.js.flow +17 -0
  146. package/src/runtime/style.tsx +1 -1
  147. package/src/runtime/types.js.flow +23 -0
  148. package/src/runtime.js.flow +7 -0
  149. package/src/styled/__tests__/types.test.js.flow +30 -0
  150. package/src/styled/index.js.flow +69 -0
  151. package/src/styled/index.tsx +6 -10
  152. package/src/types.js.flow +29 -0
  153. package/src/types.tsx +7 -3
  154. package/src/utils/error.js.flow +7 -0
  155. package/dist/browser/codemods/codemods-helpers.d.ts +0 -60
  156. package/dist/browser/codemods/codemods-helpers.js +0 -201
  157. package/dist/browser/codemods/codemods-helpers.js.map +0 -1
  158. package/dist/browser/codemods/constants.d.ts +0 -3
  159. package/dist/browser/codemods/constants.js +0 -4
  160. package/dist/browser/codemods/constants.js.map +0 -1
  161. package/dist/browser/codemods/emotion-to-compiled/emotion-to-compiled.d.ts +0 -3
  162. package/dist/browser/codemods/emotion-to-compiled/emotion-to-compiled.js +0 -178
  163. package/dist/browser/codemods/emotion-to-compiled/emotion-to-compiled.js.map +0 -1
  164. package/dist/browser/codemods/emotion-to-compiled/index.d.ts +0 -1
  165. package/dist/browser/codemods/emotion-to-compiled/index.js +0 -2
  166. package/dist/browser/codemods/emotion-to-compiled/index.js.map +0 -1
  167. package/dist/browser/codemods/styled-components-to-compiled/index.d.ts +0 -1
  168. package/dist/browser/codemods/styled-components-to-compiled/index.js +0 -2
  169. package/dist/browser/codemods/styled-components-to-compiled/index.js.map +0 -1
  170. package/dist/browser/codemods/styled-components-to-compiled/styled-components-to-compiled.d.ts +0 -3
  171. package/dist/browser/codemods/styled-components-to-compiled/styled-components-to-compiled.js +0 -33
  172. package/dist/browser/codemods/styled-components-to-compiled/styled-components-to-compiled.js.map +0 -1
  173. package/dist/cjs/codemods/codemods-helpers.d.ts +0 -60
  174. package/dist/cjs/codemods/codemods-helpers.js +0 -217
  175. package/dist/cjs/codemods/codemods-helpers.js.map +0 -1
  176. package/dist/cjs/codemods/constants.d.ts +0 -3
  177. package/dist/cjs/codemods/constants.js +0 -7
  178. package/dist/cjs/codemods/constants.js.map +0 -1
  179. package/dist/cjs/codemods/emotion-to-compiled/emotion-to-compiled.d.ts +0 -3
  180. package/dist/cjs/codemods/emotion-to-compiled/emotion-to-compiled.js +0 -180
  181. package/dist/cjs/codemods/emotion-to-compiled/emotion-to-compiled.js.map +0 -1
  182. package/dist/cjs/codemods/emotion-to-compiled/index.d.ts +0 -1
  183. package/dist/cjs/codemods/emotion-to-compiled/index.js +0 -9
  184. package/dist/cjs/codemods/emotion-to-compiled/index.js.map +0 -1
  185. package/dist/cjs/codemods/styled-components-to-compiled/index.d.ts +0 -1
  186. package/dist/cjs/codemods/styled-components-to-compiled/index.js +0 -9
  187. package/dist/cjs/codemods/styled-components-to-compiled/index.js.map +0 -1
  188. package/dist/cjs/codemods/styled-components-to-compiled/styled-components-to-compiled.d.ts +0 -3
  189. package/dist/cjs/codemods/styled-components-to-compiled/styled-components-to-compiled.js +0 -35
  190. package/dist/cjs/codemods/styled-components-to-compiled/styled-components-to-compiled.js.map +0 -1
  191. package/dist/esm/codemods/codemods-helpers.d.ts +0 -60
  192. package/dist/esm/codemods/codemods-helpers.js +0 -201
  193. package/dist/esm/codemods/codemods-helpers.js.map +0 -1
  194. package/dist/esm/codemods/constants.d.ts +0 -3
  195. package/dist/esm/codemods/constants.js +0 -4
  196. package/dist/esm/codemods/constants.js.map +0 -1
  197. package/dist/esm/codemods/emotion-to-compiled/emotion-to-compiled.d.ts +0 -3
  198. package/dist/esm/codemods/emotion-to-compiled/emotion-to-compiled.js +0 -178
  199. package/dist/esm/codemods/emotion-to-compiled/emotion-to-compiled.js.map +0 -1
  200. package/dist/esm/codemods/emotion-to-compiled/index.d.ts +0 -1
  201. package/dist/esm/codemods/emotion-to-compiled/index.js +0 -2
  202. package/dist/esm/codemods/emotion-to-compiled/index.js.map +0 -1
  203. package/dist/esm/codemods/styled-components-to-compiled/index.d.ts +0 -1
  204. package/dist/esm/codemods/styled-components-to-compiled/index.js +0 -2
  205. package/dist/esm/codemods/styled-components-to-compiled/index.js.map +0 -1
  206. package/dist/esm/codemods/styled-components-to-compiled/styled-components-to-compiled.d.ts +0 -3
  207. package/dist/esm/codemods/styled-components-to-compiled/styled-components-to-compiled.js +0 -33
  208. package/dist/esm/codemods/styled-components-to-compiled/styled-components-to-compiled.js.map +0 -1
  209. package/src/codemods/README.md +0 -8
  210. package/src/codemods/codemods-helpers.tsx +0 -369
  211. package/src/codemods/constants.tsx +0 -3
  212. package/src/codemods/emotion-to-compiled/README.md +0 -71
  213. package/src/codemods/emotion-to-compiled/__tests__/emotion-to-compiled.test.tsx +0 -526
  214. package/src/codemods/emotion-to-compiled/emotion-to-compiled.tsx +0 -249
  215. package/src/codemods/emotion-to-compiled/index.tsx +0 -1
  216. package/src/codemods/styled-components-to-compiled/README.md +0 -37
  217. package/src/codemods/styled-components-to-compiled/__tests__/styled-components-to-compiled.test.tsx +0 -109
  218. package/src/codemods/styled-components-to-compiled/index.tsx +0 -1
  219. package/src/codemods/styled-components-to-compiled/styled-components-to-compiled.tsx +0 -45
@@ -1,369 +0,0 @@
1
- import {
2
- JSCodeshift,
3
- ImportDeclaration,
4
- ImportDefaultSpecifier,
5
- ImportSpecifier,
6
- Program,
7
- Identifier,
8
- JSXIdentifier,
9
- TSTypeParameter,
10
- Node,
11
- ImportNamespaceSpecifier,
12
- Collection,
13
- } from 'jscodeshift';
14
- import { COMPILED_IMPORT_PATH, REACT_IMPORT_PATH, REACT_IMPORT_NAME } from './constants';
15
-
16
- type Identifiers = Array<Identifier | JSXIdentifier | TSTypeParameter>;
17
-
18
- export const getImportDeclarationCollection = ({
19
- j,
20
- collection,
21
- importPath,
22
- }: {
23
- j: JSCodeshift;
24
- collection: Collection<any>;
25
- importPath: string;
26
- }): Collection<ImportDeclaration> => {
27
- const found: Collection<ImportDeclaration> = collection
28
- .find(j.ImportDeclaration)
29
- .filter((importDeclarationPath) => importDeclarationPath.node.source.value === importPath);
30
-
31
- return found;
32
- };
33
-
34
- export const hasImportDeclaration = ({
35
- j,
36
- collection,
37
- importPath,
38
- }: {
39
- j: JSCodeshift;
40
- collection: Collection<any>;
41
- importPath: string;
42
- }): boolean => {
43
- const result: Collection<ImportDeclaration> = getImportDeclarationCollection({
44
- j,
45
- collection,
46
- importPath,
47
- });
48
-
49
- return result.length > 0;
50
- };
51
-
52
- export const getImportDefaultSpecifierName = (
53
- importDefaultSpecifierCollection: Collection<ImportDefaultSpecifier>
54
- ): string => {
55
- const name = importDefaultSpecifierCollection.nodes()[0]!.local!.name;
56
- if (!name) {
57
- throw new Error('Name should exist.');
58
- }
59
-
60
- return name;
61
- };
62
-
63
- export const getImportSpecifierName = (
64
- importSpecifierCollection: Collection<ImportSpecifier>
65
- ): string | undefined => importSpecifierCollection.nodes()[0]!.local!.name;
66
-
67
- export const getAllImportSpecifiers = ({
68
- j,
69
- importDeclarationCollection,
70
- }: {
71
- j: JSCodeshift;
72
- importDeclarationCollection: Collection<ImportDeclaration>;
73
- }): Identifiers => {
74
- const importSpecifiersImportedNodes: Identifiers = [];
75
-
76
- importDeclarationCollection.find(j.ImportSpecifier).forEach((importSpecifierPath) => {
77
- const node = importSpecifierPath.node.imported;
78
-
79
- if (node) {
80
- importSpecifiersImportedNodes.push(node);
81
- }
82
- });
83
-
84
- return importSpecifiersImportedNodes;
85
- };
86
-
87
- export const findImportSpecifierName = ({
88
- j,
89
- importDeclarationCollection,
90
- importName,
91
- }: {
92
- j: JSCodeshift;
93
- importDeclarationCollection: Collection<ImportDeclaration>;
94
- importName: string;
95
- }): string | null | undefined => {
96
- const importSpecifierCollection: Collection<ImportSpecifier> = importDeclarationCollection
97
- .find(j.ImportSpecifier)
98
- .filter((importSpecifierPath) => importSpecifierPath.node.imported.name === importName);
99
-
100
- if (importSpecifierCollection.length === 0) {
101
- return null;
102
- }
103
-
104
- return getImportSpecifierName(importSpecifierCollection);
105
- };
106
-
107
- export const convertDefaultImportToNamedImport = ({
108
- j,
109
- collection,
110
- importPath,
111
- namedImport,
112
- }: {
113
- j: JSCodeshift;
114
- collection: Collection<any>;
115
- importPath: string;
116
- namedImport: string;
117
- }): void => {
118
- const importDeclarationCollection: Collection<ImportDeclaration> = getImportDeclarationCollection(
119
- {
120
- j,
121
- collection,
122
- importPath,
123
- }
124
- );
125
-
126
- importDeclarationCollection.forEach((importDeclarationPath) => {
127
- const importDefaultSpecifierCollection = j(importDeclarationPath).find(
128
- j.ImportDefaultSpecifier
129
- );
130
-
131
- if (importDefaultSpecifierCollection.length > 0) {
132
- const oldNode = importDeclarationPath.node;
133
- const { comments } = oldNode;
134
-
135
- j(importDeclarationPath).replaceWith([
136
- j.importDeclaration(
137
- [
138
- j.importSpecifier(
139
- j.identifier(namedImport),
140
- j.identifier(getImportDefaultSpecifierName(importDefaultSpecifierCollection))
141
- ),
142
- ],
143
- j.literal(COMPILED_IMPORT_PATH)
144
- ),
145
- ]);
146
-
147
- const newNode = importDeclarationPath.node;
148
-
149
- if (newNode !== oldNode) {
150
- newNode.comments = comments;
151
- }
152
- }
153
- });
154
- };
155
-
156
- // not replacing newlines (which \s does)
157
- const spacesAndTabs = /[ \t]{2,}/g;
158
- const lineStartWithSpaces = /^[ \t]*/gm;
159
-
160
- const clean = (value: string) =>
161
- value
162
- .replace(spacesAndTabs, ' ')
163
- .replace(lineStartWithSpaces, '')
164
- // using .trim() to clear the any newlines before the first text and after last text
165
- .trim();
166
-
167
- export const addCommentBefore = ({
168
- j,
169
- collection,
170
- message,
171
- }: {
172
- j: JSCodeshift;
173
- collection: Collection<Program>;
174
- message: string;
175
- }): void => {
176
- const content = ` TODO(${COMPILED_IMPORT_PATH} codemod): ${clean(message)} `;
177
- collection.forEach((path) => {
178
- path.value.comments = path.value.comments || [];
179
-
180
- const exists = path.value.comments.find((comment) => comment.value === content);
181
-
182
- // avoiding duplicates of the same comment
183
- if (exists) {
184
- return;
185
- }
186
-
187
- path.value.comments.push(j.commentBlock(content));
188
- });
189
- };
190
-
191
- export const addCommentToStartOfFile = ({
192
- j,
193
- collection,
194
- message,
195
- }: {
196
- j: JSCodeshift;
197
- collection: Collection<Node>;
198
- message: string;
199
- }): void => {
200
- addCommentBefore({
201
- j,
202
- collection: collection.find(j.Program),
203
- message,
204
- });
205
- };
206
-
207
- export const addCommentForUnresolvedImportSpecifiers = ({
208
- j,
209
- collection,
210
- importPath,
211
- allowedImportSpecifierNames,
212
- }: {
213
- j: JSCodeshift;
214
- collection: Collection<Node>;
215
- importPath: string;
216
- allowedImportSpecifierNames: string[];
217
- }): void => {
218
- const importDeclarationCollection: Collection<ImportDeclaration> = getImportDeclarationCollection(
219
- {
220
- j,
221
- collection,
222
- importPath,
223
- }
224
- );
225
- const importSpecifiers: Identifiers = getAllImportSpecifiers({
226
- j,
227
- importDeclarationCollection,
228
- });
229
-
230
- importSpecifiers
231
- .filter((identifierPath) => !allowedImportSpecifierNames.includes(identifierPath.name))
232
- .forEach((importSpecifierPath) => {
233
- addCommentToStartOfFile({
234
- j,
235
- collection,
236
- message: `"${importSpecifierPath.name}" is not exported from "${COMPILED_IMPORT_PATH}" at the moment. Please find an alternative for it.`,
237
- });
238
- });
239
- };
240
-
241
- export const addReactIdentifier = ({
242
- j,
243
- collection,
244
- }: {
245
- j: JSCodeshift;
246
- collection: Collection<Node>;
247
- }): void => {
248
- const hasReactImportDeclaration: boolean = hasImportDeclaration({
249
- j,
250
- collection,
251
- importPath: REACT_IMPORT_PATH,
252
- });
253
-
254
- if (!hasReactImportDeclaration) {
255
- collection.find(j.Program).forEach((programPath) => {
256
- programPath.node.body.unshift(
257
- j.importDeclaration(
258
- [j.importNamespaceSpecifier(j.identifier(REACT_IMPORT_NAME))],
259
- j.literal(REACT_IMPORT_PATH)
260
- )
261
- );
262
- });
263
- } else {
264
- const importDeclarationCollection: Collection<ImportDeclaration> = getImportDeclarationCollection(
265
- {
266
- j,
267
- collection,
268
- importPath: REACT_IMPORT_PATH,
269
- }
270
- );
271
-
272
- importDeclarationCollection.forEach((importDeclarationPath) => {
273
- const importDefaultSpecifierCollection: Collection<ImportDefaultSpecifier> = j(
274
- importDeclarationPath
275
- ).find(j.ImportDefaultSpecifier);
276
- const importNamespaceSpecifierCollection: Collection<ImportNamespaceSpecifier> = j(
277
- importDeclarationPath
278
- ).find(j.ImportNamespaceSpecifier);
279
-
280
- const hasNoDefaultReactImportDeclaration = importDefaultSpecifierCollection.length === 0;
281
- const hasNoNamespaceReactImportDeclaration = importNamespaceSpecifierCollection.length === 0;
282
-
283
- if (
284
- hasNoDefaultReactImportDeclaration &&
285
- hasNoNamespaceReactImportDeclaration &&
286
- importDeclarationPath.node.specifiers
287
- ) {
288
- importDeclarationPath.node.specifiers.unshift(
289
- j.importDefaultSpecifier(j.identifier(REACT_IMPORT_NAME))
290
- );
291
- }
292
- });
293
- }
294
- };
295
-
296
- export const replaceImportDeclaration = ({
297
- j,
298
- collection,
299
- importPath,
300
- }: {
301
- j: JSCodeshift;
302
- collection: Collection<Node>;
303
- importPath: string;
304
- }): void => {
305
- const importDeclarationCollection: Collection<ImportDeclaration> = getImportDeclarationCollection(
306
- {
307
- j,
308
- collection,
309
- importPath,
310
- }
311
- );
312
-
313
- importDeclarationCollection.forEach((importDeclarationPath) => {
314
- importDeclarationPath.node.source.value = COMPILED_IMPORT_PATH;
315
- });
316
- };
317
-
318
- export const mergeImportSpecifiersAlongWithTheirComments = ({
319
- j,
320
- collection,
321
- filter = (_) => true,
322
- }: {
323
- j: JSCodeshift;
324
- collection: Collection<Node>;
325
- filter?: (name: string | undefined) => boolean;
326
- }): void => {
327
- const importDeclarationCollection: Collection<ImportDeclaration> = getImportDeclarationCollection(
328
- {
329
- j,
330
- collection,
331
- importPath: COMPILED_IMPORT_PATH,
332
- }
333
- );
334
-
335
- const importSpecifiers: ImportSpecifier[] = [];
336
-
337
- importDeclarationCollection
338
- .find(j.ImportSpecifier)
339
- .filter((importSpecifierPath) => filter(importSpecifierPath.node.imported.name))
340
- .forEach((importSpecifierPath) => {
341
- importSpecifiers.push(importSpecifierPath.node);
342
- });
343
-
344
- const importDeclarationCollectionLength = importDeclarationCollection.length;
345
- const importDeclarationComments: Node['comments'] = [];
346
-
347
- importDeclarationCollection.forEach((importDeclarationPath, index) => {
348
- const oldNode = importDeclarationPath.node;
349
- const { comments } = oldNode;
350
-
351
- if (comments) {
352
- importDeclarationComments.push(...comments);
353
- }
354
-
355
- if (index === importDeclarationCollectionLength - 1) {
356
- j(importDeclarationPath).replaceWith([
357
- j.importDeclaration(importSpecifiers, j.literal(COMPILED_IMPORT_PATH)),
358
- ]);
359
-
360
- const newNode = importDeclarationPath.node;
361
-
362
- if (newNode !== oldNode) {
363
- newNode.comments = importDeclarationComments;
364
- }
365
- } else {
366
- j(importDeclarationPath).remove();
367
- }
368
- });
369
- };
@@ -1,3 +0,0 @@
1
- export const COMPILED_IMPORT_PATH = '@compiled/react';
2
- export const REACT_IMPORT_PATH = 'react';
3
- export const REACT_IMPORT_NAME = 'React';
@@ -1,71 +0,0 @@
1
- # emotion-to-compiled
2
-
3
- > Codemod for easy migration from emotion.
4
-
5
- ## Usage
6
-
7
- ```bash
8
- npx @compiled/cli --preset codemods
9
- # and follow the instructions
10
- ```
11
-
12
- **Will modify files in place, so make sure you can recover if it goes wrong!**
13
-
14
- ## Examples
15
-
16
- ```javascript
17
- /** @jsx jsx */
18
- import styled from '@emotion/styled';
19
- import { css, jsx } from '@emotion/core';
20
-
21
- const Component = (props) => (
22
- <>
23
- <div
24
- css={css`
25
- color: red;
26
- background-color: #000;
27
- `}
28
- />
29
- <span
30
- css={css`
31
- color: blue;
32
- `}
33
- />
34
- </>
35
- );
36
- ```
37
-
38
- Is transformed to:
39
-
40
- ```javascript
41
- import { styled } from '@compiled/react';
42
-
43
- const Component = (props) => (
44
- <>
45
- <div
46
- css={`
47
- color: red;
48
- background-color: #000;
49
- `}
50
- />
51
- <span
52
- css={`
53
- color: blue;
54
- `}
55
- />
56
- </>
57
- );
58
- ```
59
-
60
- ## Updating Instructions
61
-
62
- When wanting to update to a later version make sure `@compiled/cli` is being ran with the same version.
63
-
64
- > Watch out for it being cached!
65
-
66
- For example when upgrading `@compiled/react` to `v0.6.0` where you've already used the CLI,
67
- on your next run explicitly set the version number:
68
-
69
- ```bash
70
- npx @compiled/cli@0.6.0 --preset codemods
71
- ```