@atlaskit/textfield 8.0.1 → 8.0.3
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.
- package/CHANGELOG.md +16 -0
- package/dist/cjs/text-field.compiled.css +2 -3
- package/dist/cjs/text-field.js +2 -2
- package/dist/es2019/text-field.compiled.css +2 -3
- package/dist/es2019/text-field.js +2 -2
- package/dist/esm/text-field.compiled.css +2 -3
- package/dist/esm/text-field.js +2 -2
- package/package.json +15 -12
- package/codemods/5.0.0-lite-mode.tsx +0 -13
- package/codemods/5.6.0-deprecate-disabled.tsx +0 -7
- package/codemods/__tests__/5.0.0-lite-mode.tsx +0 -87
- package/codemods/__tests__/remove-imports.tsx +0 -62
- package/codemods/__tests__/remove-prop.tsx +0 -142
- package/codemods/__tests__/rename-disabled-to-isdisabled.tsx +0 -143
- package/codemods/__tests__/rename-imports.tsx +0 -82
- package/codemods/migrations/remove-imports.tsx +0 -8
- package/codemods/migrations/remove-props.tsx +0 -10
- package/codemods/migrations/rename-disabled-to-isdisabled.tsx +0 -7
- package/codemods/migrations/rename-imports.tsx +0 -15
- package/codemods/migrations/utils.tsx +0 -335
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# @atlaskit/textfield
|
|
2
2
|
|
|
3
|
+
## 8.0.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#129364](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/129364)
|
|
8
|
+
[`998814482368f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/998814482368f) -
|
|
9
|
+
Internal changes to placeholder text color for disabled text fields.
|
|
10
|
+
|
|
11
|
+
## 8.0.2
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- [#126525](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/126525)
|
|
16
|
+
[`69b96eb748121`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/69b96eb748121) -
|
|
17
|
+
Update dependencies and remove old codemods.
|
|
18
|
+
|
|
3
19
|
## 8.0.1
|
|
4
20
|
|
|
5
21
|
### Patch Changes
|
|
@@ -28,6 +28,8 @@
|
|
|
28
28
|
._1goxglyw::-ms-clear{display:none}
|
|
29
29
|
._1idr131l::-ms-input-placeholder{color:var(--ds-text-subtlest,#626f86)}
|
|
30
30
|
._1idr131l::placeholder{color:var(--ds-text-subtlest,#626f86)}
|
|
31
|
+
._1idr1lh4::-ms-input-placeholder{color:var(--ds-text-disabled,#091e424f)}
|
|
32
|
+
._1idr1lh4::placeholder{color:var(--ds-text-disabled,#091e424f)}
|
|
31
33
|
._1kod12x7:not([data-compact]){padding-inline-end:var(--ds-space-075,6px)}
|
|
32
34
|
._1l02v77o[data-compact]{padding-block-start:var(--ds-space-025,2px)}
|
|
33
35
|
._1n7e1l2s:placeholder-shown{text-overflow:ellipsis}
|
|
@@ -37,8 +39,6 @@
|
|
|
37
39
|
._1qu2glyw{outline-style:none}
|
|
38
40
|
._1reo15vq{overflow-x:hidden}
|
|
39
41
|
._1ul9idpf{min-width:0}
|
|
40
|
-
._3hog1lh4::-ms-input-placeholder:disabled{color:var(--ds-text-disabled,#091e424f)}
|
|
41
|
-
._3hog1lh4::placeholder:disabled{color:var(--ds-text-disabled,#091e424f)}
|
|
42
42
|
._4cvr1h6o{align-items:center}
|
|
43
43
|
._7ba012x7:not([data-compact]){padding-inline-start:var(--ds-space-075,6px)}
|
|
44
44
|
._80om13gf{cursor:not-allowed}
|
|
@@ -57,7 +57,6 @@
|
|
|
57
57
|
._lcxv1wug{pointer-events:auto}
|
|
58
58
|
._olc612x7:not([data-compact]){padding-block-start:var(--ds-space-075,6px)}
|
|
59
59
|
._olc6u2gc:not([data-compact]){padding-block-start:var(--ds-space-100,8px)}
|
|
60
|
-
._oo9g1lh4{-webkit-text-fill-color:var(--ds-text-disabled,#091e424f)}
|
|
61
60
|
._s7n4jp4b{vertical-align:top}
|
|
62
61
|
._slp31hna{word-wrap:break-word}
|
|
63
62
|
._syaz1fxt{color:var(--ds-text,#172b4d)}
|
package/dist/cjs/text-field.js
CHANGED
|
@@ -29,7 +29,7 @@ var inputMediaDisabled = null;
|
|
|
29
29
|
var analyticsParams = {
|
|
30
30
|
componentName: 'textField',
|
|
31
31
|
packageName: "@atlaskit/textfield",
|
|
32
|
-
packageVersion: "8.0.
|
|
32
|
+
packageVersion: "8.0.3"
|
|
33
33
|
};
|
|
34
34
|
var disabledStyle = {
|
|
35
35
|
standard: "_1h6dsyzs _bfhksyzs _syaz1lh4 _80om13gf",
|
|
@@ -182,7 +182,7 @@ var Textfield = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
|
|
|
182
182
|
readOnly: isReadOnly,
|
|
183
183
|
ref: setInputRef,
|
|
184
184
|
required: isRequired,
|
|
185
|
-
className: (0, _runtime.ax)(["_19itidpf _11c82smr _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _1bsb1osq _1ul9idpf _bfhk1j28 _syaz1kw7 _80om1kw7 _14jiu2gc _olc6u2gc _1kod12x7 _7ba012x7 _1goxglyw _13xeglyw _1n7e1l2s _1idr131l
|
|
185
|
+
className: (0, _runtime.ax)(["_19itidpf _11c82smr _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _1bsb1osq _1ul9idpf _bfhk1j28 _syaz1kw7 _80om1kw7 _14jiu2gc _olc6u2gc _1kod12x7 _7ba012x7 _1goxglyw _13xeglyw _1n7e1l2s _1idr131l", isMonospaced && "_ect41odn", isCompact && "_85i51b66 _1q511b66 _y4ti12x7 _bozg12x7", isDisabled && "_syaz1lh4 _1idr1lh4", isDisabled && "_1fnx18qt", !isCompact && (0, _platformFeatureFlags.fg)('platform_design_system_team_safari_input_fix') && "_14ji12x7 _olc612x7 _1kod12x7 _7ba012x7 _l9oiu2gc _549yu2gc _1h5w12x7 _124212x7", (0, _platformFeatureFlags.fg)('platform_design_system_team_safari_input_fix') && "_11c81ixg _1tn22smr", isCompact && (0, _platformFeatureFlags.fg)('platform_design_system_team_safari_input_fix') && "_11zpv77o _1l02v77o _daj712x7 _141f12x7 _1srd1b66 _oi9h1b66 _1e3012x7 _1txv12x7", isMonospaced && (0, _platformFeatureFlags.fg)('platform_design_system_team_safari_input_fix') && "_ect41odn _14md1odn"])
|
|
186
186
|
})), elemAfterInput);
|
|
187
187
|
});
|
|
188
188
|
var _default = exports.default = Textfield;
|
|
@@ -28,6 +28,8 @@
|
|
|
28
28
|
._1goxglyw::-ms-clear{display:none}
|
|
29
29
|
._1idr131l::-ms-input-placeholder{color:var(--ds-text-subtlest,#626f86)}
|
|
30
30
|
._1idr131l::placeholder{color:var(--ds-text-subtlest,#626f86)}
|
|
31
|
+
._1idr1lh4::-ms-input-placeholder{color:var(--ds-text-disabled,#091e424f)}
|
|
32
|
+
._1idr1lh4::placeholder{color:var(--ds-text-disabled,#091e424f)}
|
|
31
33
|
._1kod12x7:not([data-compact]){padding-inline-end:var(--ds-space-075,6px)}
|
|
32
34
|
._1l02v77o[data-compact]{padding-block-start:var(--ds-space-025,2px)}
|
|
33
35
|
._1n7e1l2s:placeholder-shown{text-overflow:ellipsis}
|
|
@@ -37,8 +39,6 @@
|
|
|
37
39
|
._1qu2glyw{outline-style:none}
|
|
38
40
|
._1reo15vq{overflow-x:hidden}
|
|
39
41
|
._1ul9idpf{min-width:0}
|
|
40
|
-
._3hog1lh4::-ms-input-placeholder:disabled{color:var(--ds-text-disabled,#091e424f)}
|
|
41
|
-
._3hog1lh4::placeholder:disabled{color:var(--ds-text-disabled,#091e424f)}
|
|
42
42
|
._4cvr1h6o{align-items:center}
|
|
43
43
|
._7ba012x7:not([data-compact]){padding-inline-start:var(--ds-space-075,6px)}
|
|
44
44
|
._80om13gf{cursor:not-allowed}
|
|
@@ -57,7 +57,6 @@
|
|
|
57
57
|
._lcxv1wug{pointer-events:auto}
|
|
58
58
|
._olc612x7:not([data-compact]){padding-block-start:var(--ds-space-075,6px)}
|
|
59
59
|
._olc6u2gc:not([data-compact]){padding-block-start:var(--ds-space-100,8px)}
|
|
60
|
-
._oo9g1lh4{-webkit-text-fill-color:var(--ds-text-disabled,#091e424f)}
|
|
61
60
|
._s7n4jp4b{vertical-align:top}
|
|
62
61
|
._slp31hna{word-wrap:break-word}
|
|
63
62
|
._syaz1fxt{color:var(--ds-text,#172b4d)}
|
|
@@ -13,7 +13,7 @@ const inputMediaDisabled = null;
|
|
|
13
13
|
const analyticsParams = {
|
|
14
14
|
componentName: 'textField',
|
|
15
15
|
packageName: "@atlaskit/textfield",
|
|
16
|
-
packageVersion: "8.0.
|
|
16
|
+
packageVersion: "8.0.3"
|
|
17
17
|
};
|
|
18
18
|
const disabledStyle = {
|
|
19
19
|
standard: "_1h6dsyzs _bfhksyzs _syaz1lh4 _80om13gf",
|
|
@@ -160,7 +160,7 @@ const Textfield = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
160
160
|
readOnly: isReadOnly,
|
|
161
161
|
ref: setInputRef,
|
|
162
162
|
required: isRequired,
|
|
163
|
-
className: ax(["_19itidpf _11c82smr _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _1bsb1osq _1ul9idpf _bfhk1j28 _syaz1kw7 _80om1kw7 _14jiu2gc _olc6u2gc _1kod12x7 _7ba012x7 _1goxglyw _13xeglyw _1n7e1l2s _1idr131l
|
|
163
|
+
className: ax(["_19itidpf _11c82smr _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _1bsb1osq _1ul9idpf _bfhk1j28 _syaz1kw7 _80om1kw7 _14jiu2gc _olc6u2gc _1kod12x7 _7ba012x7 _1goxglyw _13xeglyw _1n7e1l2s _1idr131l", isMonospaced && "_ect41odn", isCompact && "_85i51b66 _1q511b66 _y4ti12x7 _bozg12x7", isDisabled && "_syaz1lh4 _1idr1lh4", isDisabled && "_1fnx18qt", !isCompact && fg('platform_design_system_team_safari_input_fix') && "_14ji12x7 _olc612x7 _1kod12x7 _7ba012x7 _l9oiu2gc _549yu2gc _1h5w12x7 _124212x7", fg('platform_design_system_team_safari_input_fix') && "_11c81ixg _1tn22smr", isCompact && fg('platform_design_system_team_safari_input_fix') && "_11zpv77o _1l02v77o _daj712x7 _141f12x7 _1srd1b66 _oi9h1b66 _1e3012x7 _1txv12x7", isMonospaced && fg('platform_design_system_team_safari_input_fix') && "_ect41odn _14md1odn"])
|
|
164
164
|
})), elemAfterInput);
|
|
165
165
|
});
|
|
166
166
|
export default Textfield;
|
|
@@ -28,6 +28,8 @@
|
|
|
28
28
|
._1goxglyw::-ms-clear{display:none}
|
|
29
29
|
._1idr131l::-ms-input-placeholder{color:var(--ds-text-subtlest,#626f86)}
|
|
30
30
|
._1idr131l::placeholder{color:var(--ds-text-subtlest,#626f86)}
|
|
31
|
+
._1idr1lh4::-ms-input-placeholder{color:var(--ds-text-disabled,#091e424f)}
|
|
32
|
+
._1idr1lh4::placeholder{color:var(--ds-text-disabled,#091e424f)}
|
|
31
33
|
._1kod12x7:not([data-compact]){padding-inline-end:var(--ds-space-075,6px)}
|
|
32
34
|
._1l02v77o[data-compact]{padding-block-start:var(--ds-space-025,2px)}
|
|
33
35
|
._1n7e1l2s:placeholder-shown{text-overflow:ellipsis}
|
|
@@ -37,8 +39,6 @@
|
|
|
37
39
|
._1qu2glyw{outline-style:none}
|
|
38
40
|
._1reo15vq{overflow-x:hidden}
|
|
39
41
|
._1ul9idpf{min-width:0}
|
|
40
|
-
._3hog1lh4::-ms-input-placeholder:disabled{color:var(--ds-text-disabled,#091e424f)}
|
|
41
|
-
._3hog1lh4::placeholder:disabled{color:var(--ds-text-disabled,#091e424f)}
|
|
42
42
|
._4cvr1h6o{align-items:center}
|
|
43
43
|
._7ba012x7:not([data-compact]){padding-inline-start:var(--ds-space-075,6px)}
|
|
44
44
|
._80om13gf{cursor:not-allowed}
|
|
@@ -57,7 +57,6 @@
|
|
|
57
57
|
._lcxv1wug{pointer-events:auto}
|
|
58
58
|
._olc612x7:not([data-compact]){padding-block-start:var(--ds-space-075,6px)}
|
|
59
59
|
._olc6u2gc:not([data-compact]){padding-block-start:var(--ds-space-100,8px)}
|
|
60
|
-
._oo9g1lh4{-webkit-text-fill-color:var(--ds-text-disabled,#091e424f)}
|
|
61
60
|
._s7n4jp4b{vertical-align:top}
|
|
62
61
|
._slp31hna{word-wrap:break-word}
|
|
63
62
|
._syaz1fxt{color:var(--ds-text,#172b4d)}
|
package/dist/esm/text-field.js
CHANGED
|
@@ -19,7 +19,7 @@ var inputMediaDisabled = null;
|
|
|
19
19
|
var analyticsParams = {
|
|
20
20
|
componentName: 'textField',
|
|
21
21
|
packageName: "@atlaskit/textfield",
|
|
22
|
-
packageVersion: "8.0.
|
|
22
|
+
packageVersion: "8.0.3"
|
|
23
23
|
};
|
|
24
24
|
var disabledStyle = {
|
|
25
25
|
standard: "_1h6dsyzs _bfhksyzs _syaz1lh4 _80om13gf",
|
|
@@ -172,7 +172,7 @@ var Textfield = /*#__PURE__*/forwardRef(function (props, ref) {
|
|
|
172
172
|
readOnly: isReadOnly,
|
|
173
173
|
ref: setInputRef,
|
|
174
174
|
required: isRequired,
|
|
175
|
-
className: ax(["_19itidpf _11c82smr _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _1bsb1osq _1ul9idpf _bfhk1j28 _syaz1kw7 _80om1kw7 _14jiu2gc _olc6u2gc _1kod12x7 _7ba012x7 _1goxglyw _13xeglyw _1n7e1l2s _1idr131l
|
|
175
|
+
className: ax(["_19itidpf _11c82smr _12ji1r31 _1qu2glyw _12y31o36 _vchhusvi _1bsb1osq _1ul9idpf _bfhk1j28 _syaz1kw7 _80om1kw7 _14jiu2gc _olc6u2gc _1kod12x7 _7ba012x7 _1goxglyw _13xeglyw _1n7e1l2s _1idr131l", isMonospaced && "_ect41odn", isCompact && "_85i51b66 _1q511b66 _y4ti12x7 _bozg12x7", isDisabled && "_syaz1lh4 _1idr1lh4", isDisabled && "_1fnx18qt", !isCompact && fg('platform_design_system_team_safari_input_fix') && "_14ji12x7 _olc612x7 _1kod12x7 _7ba012x7 _l9oiu2gc _549yu2gc _1h5w12x7 _124212x7", fg('platform_design_system_team_safari_input_fix') && "_11c81ixg _1tn22smr", isCompact && fg('platform_design_system_team_safari_input_fix') && "_11zpv77o _1l02v77o _daj712x7 _141f12x7 _1srd1b66 _oi9h1b66 _1e3012x7 _1txv12x7", isMonospaced && fg('platform_design_system_team_safari_input_fix') && "_ect41odn _14md1odn"])
|
|
176
176
|
})), elemAfterInput);
|
|
177
177
|
});
|
|
178
178
|
export default Textfield;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/textfield",
|
|
3
|
-
"version": "8.0.
|
|
3
|
+
"version": "8.0.3",
|
|
4
4
|
"description": "A text field is an input that allows a user to write or edit text.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
"@atlaskit/analytics-next": "^11.0.0",
|
|
29
29
|
"@atlaskit/platform-feature-flags": "^1.1.0",
|
|
30
30
|
"@atlaskit/theme": "^18.0.0",
|
|
31
|
-
"@atlaskit/tokens": "^4.
|
|
31
|
+
"@atlaskit/tokens": "^4.5.0",
|
|
32
32
|
"@babel/runtime": "^7.0.0",
|
|
33
33
|
"@compiled/react": "^0.18.2"
|
|
34
34
|
},
|
|
@@ -36,19 +36,22 @@
|
|
|
36
36
|
"react": "^18.2.0"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
|
-
"@af/accessibility-testing": "
|
|
40
|
-
"@af/integration-testing": "
|
|
41
|
-
"@af/visual-regression": "
|
|
42
|
-
"@atlaskit/
|
|
39
|
+
"@af/accessibility-testing": "^2.0.0",
|
|
40
|
+
"@af/integration-testing": "^0.5.0",
|
|
41
|
+
"@af/visual-regression": "^1.3.0",
|
|
42
|
+
"@atlaskit/avatar": "^25.0.0",
|
|
43
|
+
"@atlaskit/button": "^21.1.0",
|
|
44
|
+
"@atlaskit/docs": "^10.0.0",
|
|
43
45
|
"@atlaskit/ds-lib": "^4.0.0",
|
|
44
|
-
"@atlaskit/
|
|
45
|
-
"@atlaskit/
|
|
46
|
-
"@
|
|
47
|
-
"@
|
|
46
|
+
"@atlaskit/form": "^12.0.0",
|
|
47
|
+
"@atlaskit/icon": "^25.0.0",
|
|
48
|
+
"@atlaskit/link": "^3.0.0",
|
|
49
|
+
"@atlaskit/primitives": "^14.2.0",
|
|
50
|
+
"@atlaskit/section-message": "^8.2.0",
|
|
51
|
+
"@atlaskit/ssr": "^0.4.0",
|
|
48
52
|
"@testing-library/react": "^13.4.0",
|
|
49
|
-
"
|
|
53
|
+
"@testing-library/user-event": "^14.4.3",
|
|
50
54
|
"react-dom": "^18.2.0",
|
|
51
|
-
"storybook-addon-performance": "^0.17.3",
|
|
52
55
|
"typescript": "~5.4.2"
|
|
53
56
|
},
|
|
54
57
|
"keywords": [
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { removeThemeImports } from './migrations/remove-imports';
|
|
2
|
-
import { removeThemeProp } from './migrations/remove-props';
|
|
3
|
-
import { renameThemeAppearanceImport, renamethemeTokensImport } from './migrations/rename-imports';
|
|
4
|
-
import { createTransformer } from './migrations/utils';
|
|
5
|
-
|
|
6
|
-
const transformer = createTransformer('@atlaskit/textfield', [
|
|
7
|
-
removeThemeProp,
|
|
8
|
-
removeThemeImports,
|
|
9
|
-
renamethemeTokensImport,
|
|
10
|
-
renameThemeAppearanceImport,
|
|
11
|
-
]);
|
|
12
|
-
|
|
13
|
-
export default transformer;
|
|
@@ -1,87 +0,0 @@
|
|
|
1
|
-
jest.autoMockOff();
|
|
2
|
-
|
|
3
|
-
import transformer from '../5.0.0-lite-mode';
|
|
4
|
-
|
|
5
|
-
const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
|
|
6
|
-
|
|
7
|
-
describe('TextField code-mods', () => {
|
|
8
|
-
defineInlineTest(
|
|
9
|
-
{ default: transformer, parser: 'tsx' },
|
|
10
|
-
{},
|
|
11
|
-
`
|
|
12
|
-
import Textfield, { ThemeProps, ThemeAppearance , themeTokens as ColorTokens, ThemeTokens } from '@atlaskit/textfield';
|
|
13
|
-
import customeTheme from './theme';
|
|
14
|
-
import React from 'react';
|
|
15
|
-
|
|
16
|
-
const SimpleTextfield = () => {
|
|
17
|
-
return (
|
|
18
|
-
<Textfield
|
|
19
|
-
theme={customTheme}
|
|
20
|
-
/>
|
|
21
|
-
);
|
|
22
|
-
}
|
|
23
|
-
`,
|
|
24
|
-
`
|
|
25
|
-
/* TODO: (from codemod) This file uses the @atlaskit/textfield \`theme\` prop which
|
|
26
|
-
has now been removed due to its poor performance characteristics. We have not replaced
|
|
27
|
-
theme with an equivalent API due to minimal usage of the \`theme\` prop.
|
|
28
|
-
The appearance of TextField will have likely changed. */
|
|
29
|
-
/* TODO: (from codemod) This file uses exports used to help theme @atlaskit/textfield which
|
|
30
|
-
has now been removed due to its poor performance characteristics. */
|
|
31
|
-
import Textfield, { Appearance, TextFieldColors as ColorTokens } from '@atlaskit/textfield';
|
|
32
|
-
import customeTheme from './theme';
|
|
33
|
-
import React from 'react';
|
|
34
|
-
|
|
35
|
-
const SimpleTextfield = () => {
|
|
36
|
-
return <Textfield />;
|
|
37
|
-
}
|
|
38
|
-
`,
|
|
39
|
-
'should remove theme & its imports from Textfield and leave a comment',
|
|
40
|
-
);
|
|
41
|
-
defineInlineTest(
|
|
42
|
-
{ default: transformer, parser: 'tsx' },
|
|
43
|
-
{},
|
|
44
|
-
`
|
|
45
|
-
import Textfield, { ThemeProps, ThemeTokens } from '@atlaskit/textfield';
|
|
46
|
-
import React from 'react';
|
|
47
|
-
|
|
48
|
-
const SimpleTextfield = () => {
|
|
49
|
-
return (
|
|
50
|
-
<Textfield
|
|
51
|
-
theme={(theme, props: ThemeProps) => {
|
|
52
|
-
const { container, input, ...rest } = theme(props);
|
|
53
|
-
return {
|
|
54
|
-
...rest,
|
|
55
|
-
container: {
|
|
56
|
-
...container,
|
|
57
|
-
padding: 5,
|
|
58
|
-
border: '2px solid orange',
|
|
59
|
-
},
|
|
60
|
-
input: {
|
|
61
|
-
...input,
|
|
62
|
-
fontSize: 20,
|
|
63
|
-
border: '2px solid green',
|
|
64
|
-
},
|
|
65
|
-
};
|
|
66
|
-
}}
|
|
67
|
-
/>
|
|
68
|
-
);
|
|
69
|
-
}
|
|
70
|
-
`,
|
|
71
|
-
`
|
|
72
|
-
/* TODO: (from codemod) This file uses the @atlaskit/textfield \`theme\` prop which
|
|
73
|
-
has now been removed due to its poor performance characteristics. We have not replaced
|
|
74
|
-
theme with an equivalent API due to minimal usage of the \`theme\` prop.
|
|
75
|
-
The appearance of TextField will have likely changed. */
|
|
76
|
-
/* TODO: (from codemod) This file uses exports used to help theme @atlaskit/textfield which
|
|
77
|
-
has now been removed due to its poor performance characteristics. */
|
|
78
|
-
import Textfield from '@atlaskit/textfield';
|
|
79
|
-
import React from 'react';
|
|
80
|
-
|
|
81
|
-
const SimpleTextfield = () => {
|
|
82
|
-
return <Textfield />;
|
|
83
|
-
}
|
|
84
|
-
`,
|
|
85
|
-
'should remove theme prop & its imports from Textfield and leave a comment',
|
|
86
|
-
);
|
|
87
|
-
});
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
jest.autoMockOff();
|
|
2
|
-
|
|
3
|
-
import { removeThemeImports } from '../migrations/remove-imports';
|
|
4
|
-
import { createTransformer } from '../migrations/utils';
|
|
5
|
-
|
|
6
|
-
const transformer = createTransformer('@atlaskit/textfield', [removeThemeImports]);
|
|
7
|
-
|
|
8
|
-
const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
|
|
9
|
-
|
|
10
|
-
const importToDoComment = `
|
|
11
|
-
/* TODO: (from codemod) This file uses exports used to help theme @atlaskit/textfield which
|
|
12
|
-
has now been removed due to its poor performance characteristics. */`;
|
|
13
|
-
|
|
14
|
-
describe('Remove imports', () => {
|
|
15
|
-
defineInlineTest(
|
|
16
|
-
{ default: transformer, parser: 'tsx' },
|
|
17
|
-
{},
|
|
18
|
-
`
|
|
19
|
-
import Textfield, { Theme, ThemeProps, ThemeTokens } from '@atlaskit/textfield';
|
|
20
|
-
`,
|
|
21
|
-
`
|
|
22
|
-
${importToDoComment}
|
|
23
|
-
import Textfield from '@atlaskit/textfield';
|
|
24
|
-
`,
|
|
25
|
-
'should remove theme imports from Textfield and leave a comment',
|
|
26
|
-
);
|
|
27
|
-
defineInlineTest(
|
|
28
|
-
{ default: transformer, parser: 'tsx' },
|
|
29
|
-
{},
|
|
30
|
-
`
|
|
31
|
-
import Textfield, { ThemeProps as TextfieldThemeProp, Theme as TextFieldTheme, ThemeTokens as TextfieldThemeTokens} from '@atlaskit/textfield';
|
|
32
|
-
`,
|
|
33
|
-
`
|
|
34
|
-
${importToDoComment}
|
|
35
|
-
import Textfield from '@atlaskit/textfield';
|
|
36
|
-
`,
|
|
37
|
-
'should remove theme imports with alias name from Textfield and leave a comment',
|
|
38
|
-
);
|
|
39
|
-
defineInlineTest(
|
|
40
|
-
{ default: transformer, parser: 'tsx' },
|
|
41
|
-
{},
|
|
42
|
-
`
|
|
43
|
-
import { TextFieldProps, ThemeProps, Theme, ThemeTokens } from '@atlaskit/textfield';
|
|
44
|
-
`,
|
|
45
|
-
`
|
|
46
|
-
${importToDoComment}
|
|
47
|
-
import { TextFieldProps } from '@atlaskit/textfield';
|
|
48
|
-
`,
|
|
49
|
-
'should remove theme imports & leave other imports from Textfield and leave a comment',
|
|
50
|
-
);
|
|
51
|
-
defineInlineTest(
|
|
52
|
-
{ default: transformer, parser: 'tsx' },
|
|
53
|
-
{},
|
|
54
|
-
`
|
|
55
|
-
import { ThemeProps, ThemeTokens, Theme } from '@atlaskit/textfield';
|
|
56
|
-
`,
|
|
57
|
-
`
|
|
58
|
-
${importToDoComment}
|
|
59
|
-
`,
|
|
60
|
-
'should remove theme imports & remove whole line if no default import from Textfield and leave a comment',
|
|
61
|
-
);
|
|
62
|
-
});
|
|
@@ -1,142 +0,0 @@
|
|
|
1
|
-
jest.autoMockOff();
|
|
2
|
-
|
|
3
|
-
import { removeThemeProp } from '../migrations/remove-props';
|
|
4
|
-
import { createTransformer } from '../migrations/utils';
|
|
5
|
-
|
|
6
|
-
const transformer = createTransformer('@atlaskit/textfield', [removeThemeProp]);
|
|
7
|
-
|
|
8
|
-
const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
|
|
9
|
-
|
|
10
|
-
const themeToDoComment = `
|
|
11
|
-
/* TODO: (from codemod) This file uses the @atlaskit/textfield \`theme\` prop which
|
|
12
|
-
has now been removed due to its poor performance characteristics. We have not replaced
|
|
13
|
-
theme with an equivalent API due to minimal usage of the \`theme\` prop.
|
|
14
|
-
The appearance of TextField will have likely changed. */`;
|
|
15
|
-
|
|
16
|
-
describe('Remove prop', () => {
|
|
17
|
-
defineInlineTest(
|
|
18
|
-
{ default: transformer, parser: 'tsx' },
|
|
19
|
-
{},
|
|
20
|
-
`
|
|
21
|
-
import React from 'react';
|
|
22
|
-
import Textfield from '@atlaskit/textfield';
|
|
23
|
-
import customeTheme from './theme';
|
|
24
|
-
|
|
25
|
-
const SimpleTextfield = () => {
|
|
26
|
-
return (
|
|
27
|
-
<Textfield
|
|
28
|
-
theme={customTheme}
|
|
29
|
-
/>
|
|
30
|
-
);
|
|
31
|
-
}
|
|
32
|
-
`,
|
|
33
|
-
`
|
|
34
|
-
${themeToDoComment}
|
|
35
|
-
import React from 'react';
|
|
36
|
-
import Textfield from '@atlaskit/textfield';
|
|
37
|
-
import customeTheme from './theme';
|
|
38
|
-
|
|
39
|
-
const SimpleTextfield = () => {
|
|
40
|
-
return <Textfield />;
|
|
41
|
-
}
|
|
42
|
-
`,
|
|
43
|
-
'should remove theme from Textfield and leave a comment',
|
|
44
|
-
);
|
|
45
|
-
|
|
46
|
-
defineInlineTest(
|
|
47
|
-
{ default: transformer, parser: 'tsx' },
|
|
48
|
-
{},
|
|
49
|
-
`
|
|
50
|
-
import React from 'react';
|
|
51
|
-
import TextField from '@atlaskit/textfield';
|
|
52
|
-
import customeTheme from './theme';
|
|
53
|
-
|
|
54
|
-
const SimpleTextfield = () => {
|
|
55
|
-
return (
|
|
56
|
-
<TextField
|
|
57
|
-
theme={customTheme}
|
|
58
|
-
/>
|
|
59
|
-
);
|
|
60
|
-
}
|
|
61
|
-
`,
|
|
62
|
-
`
|
|
63
|
-
${themeToDoComment}
|
|
64
|
-
import React from 'react';
|
|
65
|
-
import TextField from '@atlaskit/textfield';
|
|
66
|
-
import customeTheme from './theme';
|
|
67
|
-
|
|
68
|
-
const SimpleTextfield = () => {
|
|
69
|
-
return <TextField />;
|
|
70
|
-
}
|
|
71
|
-
`,
|
|
72
|
-
'should remove theme from TextField and leave a comment',
|
|
73
|
-
);
|
|
74
|
-
|
|
75
|
-
defineInlineTest(
|
|
76
|
-
{ default: transformer, parser: 'tsx' },
|
|
77
|
-
{},
|
|
78
|
-
`
|
|
79
|
-
import React from 'react';
|
|
80
|
-
import Textfield from '@atlaskit/textfield';
|
|
81
|
-
import customeTheme from './theme';
|
|
82
|
-
|
|
83
|
-
const SimpleTextfield = () => {
|
|
84
|
-
return (
|
|
85
|
-
<div>
|
|
86
|
-
<Textfield
|
|
87
|
-
theme={customTheme}
|
|
88
|
-
/>
|
|
89
|
-
<Textfield
|
|
90
|
-
theme={customTheme}
|
|
91
|
-
/>
|
|
92
|
-
</div>
|
|
93
|
-
);
|
|
94
|
-
}
|
|
95
|
-
`,
|
|
96
|
-
`
|
|
97
|
-
${themeToDoComment}
|
|
98
|
-
import React from 'react';
|
|
99
|
-
import Textfield from '@atlaskit/textfield';
|
|
100
|
-
import customeTheme from './theme';
|
|
101
|
-
|
|
102
|
-
const SimpleTextfield = () => {
|
|
103
|
-
return (
|
|
104
|
-
<div>
|
|
105
|
-
<Textfield />
|
|
106
|
-
<Textfield />
|
|
107
|
-
</div>
|
|
108
|
-
);
|
|
109
|
-
}
|
|
110
|
-
`,
|
|
111
|
-
'should remove 2 usages of theme and add 1 comment',
|
|
112
|
-
);
|
|
113
|
-
|
|
114
|
-
defineInlineTest(
|
|
115
|
-
{ default: transformer, parser: 'tsx' },
|
|
116
|
-
{},
|
|
117
|
-
`
|
|
118
|
-
import React from 'react';
|
|
119
|
-
import Foo from '@atlaskit/textfield';
|
|
120
|
-
import customeTheme from './theme';
|
|
121
|
-
|
|
122
|
-
const SimpleTextfield = () => {
|
|
123
|
-
return (
|
|
124
|
-
<Foo
|
|
125
|
-
theme={customeTheme}
|
|
126
|
-
/>
|
|
127
|
-
);
|
|
128
|
-
}
|
|
129
|
-
`,
|
|
130
|
-
`
|
|
131
|
-
${themeToDoComment}
|
|
132
|
-
import React from 'react';
|
|
133
|
-
import Foo from '@atlaskit/textfield';
|
|
134
|
-
import customeTheme from './theme';
|
|
135
|
-
|
|
136
|
-
const SimpleTextfield = () => {
|
|
137
|
-
return <Foo />;
|
|
138
|
-
}
|
|
139
|
-
`,
|
|
140
|
-
'should remove theme prop when using an aliased name',
|
|
141
|
-
);
|
|
142
|
-
});
|
|
@@ -1,143 +0,0 @@
|
|
|
1
|
-
jest.autoMockOff();
|
|
2
|
-
|
|
3
|
-
import { createTransformer } from '@atlaskit/codemod-utils';
|
|
4
|
-
|
|
5
|
-
import { renameDisabledToIsDisabled } from '../migrations/rename-disabled-to-isdisabled';
|
|
6
|
-
|
|
7
|
-
const transformer = createTransformer([renameDisabledToIsDisabled]);
|
|
8
|
-
|
|
9
|
-
const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
|
|
10
|
-
|
|
11
|
-
describe('Rename `disabled` prop to `isDisabled`', () => {
|
|
12
|
-
defineInlineTest(
|
|
13
|
-
{ default: transformer, parser: 'tsx' },
|
|
14
|
-
{},
|
|
15
|
-
`
|
|
16
|
-
import React from 'react';
|
|
17
|
-
import Textfield from '@atlaskit/textfield';
|
|
18
|
-
|
|
19
|
-
const SimpleTextfield = () => {
|
|
20
|
-
return <Textfield disabled />;
|
|
21
|
-
}
|
|
22
|
-
`,
|
|
23
|
-
`
|
|
24
|
-
import React from 'react';
|
|
25
|
-
import Textfield from '@atlaskit/textfield';
|
|
26
|
-
|
|
27
|
-
const SimpleTextfield = () => {
|
|
28
|
-
return <Textfield isDisabled />;
|
|
29
|
-
}
|
|
30
|
-
`,
|
|
31
|
-
'should rename single line disabled to isDisabled',
|
|
32
|
-
);
|
|
33
|
-
|
|
34
|
-
defineInlineTest(
|
|
35
|
-
{ default: transformer, parser: 'tsx' },
|
|
36
|
-
{},
|
|
37
|
-
`
|
|
38
|
-
import React from 'react';
|
|
39
|
-
import Textfield from '@atlaskit/textfield';
|
|
40
|
-
|
|
41
|
-
const SimpleTextfield = () => {
|
|
42
|
-
return (
|
|
43
|
-
<Textfield
|
|
44
|
-
name="basic"
|
|
45
|
-
aria-label="default text field"
|
|
46
|
-
disabled
|
|
47
|
-
/>
|
|
48
|
-
);
|
|
49
|
-
}
|
|
50
|
-
`,
|
|
51
|
-
`
|
|
52
|
-
import React from 'react';
|
|
53
|
-
import Textfield from '@atlaskit/textfield';
|
|
54
|
-
|
|
55
|
-
const SimpleTextfield = () => {
|
|
56
|
-
return (
|
|
57
|
-
<Textfield
|
|
58
|
-
name="basic"
|
|
59
|
-
aria-label="default text field"
|
|
60
|
-
isDisabled
|
|
61
|
-
/>
|
|
62
|
-
);
|
|
63
|
-
}
|
|
64
|
-
`,
|
|
65
|
-
'should rename multiline disabled to isDisabled',
|
|
66
|
-
);
|
|
67
|
-
|
|
68
|
-
defineInlineTest(
|
|
69
|
-
{ default: transformer, parser: 'tsx' },
|
|
70
|
-
{},
|
|
71
|
-
`
|
|
72
|
-
import React from 'react';
|
|
73
|
-
import Textfield from '@atlaskit/textfield';
|
|
74
|
-
|
|
75
|
-
const SimpleTextfield = () => {
|
|
76
|
-
const disabled = true;
|
|
77
|
-
|
|
78
|
-
return (
|
|
79
|
-
<Textfield
|
|
80
|
-
name="basic"
|
|
81
|
-
aria-label="default text field"
|
|
82
|
-
disabled={disabled}
|
|
83
|
-
/>
|
|
84
|
-
);
|
|
85
|
-
}
|
|
86
|
-
`,
|
|
87
|
-
`
|
|
88
|
-
import React from 'react';
|
|
89
|
-
import Textfield from '@atlaskit/textfield';
|
|
90
|
-
|
|
91
|
-
const SimpleTextfield = () => {
|
|
92
|
-
const disabled = true;
|
|
93
|
-
|
|
94
|
-
return (
|
|
95
|
-
<Textfield
|
|
96
|
-
name="basic"
|
|
97
|
-
aria-label="default text field"
|
|
98
|
-
isDisabled={disabled}
|
|
99
|
-
/>
|
|
100
|
-
);
|
|
101
|
-
}
|
|
102
|
-
`,
|
|
103
|
-
'should rename disabled to isDisabled with indirection',
|
|
104
|
-
);
|
|
105
|
-
|
|
106
|
-
defineInlineTest(
|
|
107
|
-
{ default: transformer, parser: 'tsx' },
|
|
108
|
-
{},
|
|
109
|
-
`
|
|
110
|
-
import React from 'react';
|
|
111
|
-
import AkTextfield from '@atlaskit/textfield';
|
|
112
|
-
|
|
113
|
-
const SimpleTextfield = () => {
|
|
114
|
-
const disabled = true;
|
|
115
|
-
|
|
116
|
-
return (
|
|
117
|
-
<AkTextfield
|
|
118
|
-
name="basic"
|
|
119
|
-
aria-label="default text field"
|
|
120
|
-
disabled={disabled}
|
|
121
|
-
/>
|
|
122
|
-
);
|
|
123
|
-
}
|
|
124
|
-
`,
|
|
125
|
-
`
|
|
126
|
-
import React from 'react';
|
|
127
|
-
import AkTextfield from '@atlaskit/textfield';
|
|
128
|
-
|
|
129
|
-
const SimpleTextfield = () => {
|
|
130
|
-
const disabled = true;
|
|
131
|
-
|
|
132
|
-
return (
|
|
133
|
-
<AkTextfield
|
|
134
|
-
name="basic"
|
|
135
|
-
aria-label="default text field"
|
|
136
|
-
isDisabled={disabled}
|
|
137
|
-
/>
|
|
138
|
-
);
|
|
139
|
-
}
|
|
140
|
-
`,
|
|
141
|
-
'should rename disabled to isDisabled with indirection and different default import',
|
|
142
|
-
);
|
|
143
|
-
});
|
|
@@ -1,82 +0,0 @@
|
|
|
1
|
-
jest.autoMockOff();
|
|
2
|
-
|
|
3
|
-
import { renameThemeAppearanceImport, renamethemeTokensImport } from '../migrations/rename-imports';
|
|
4
|
-
import { createTransformer } from '../migrations/utils';
|
|
5
|
-
|
|
6
|
-
const transformer = createTransformer('@atlaskit/textfield', [
|
|
7
|
-
renamethemeTokensImport,
|
|
8
|
-
renameThemeAppearanceImport,
|
|
9
|
-
]);
|
|
10
|
-
|
|
11
|
-
const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
|
|
12
|
-
|
|
13
|
-
describe('Rename imports', () => {
|
|
14
|
-
defineInlineTest(
|
|
15
|
-
{ default: transformer, parser: 'tsx' },
|
|
16
|
-
{},
|
|
17
|
-
`
|
|
18
|
-
import { themeTokens, ThemeAppearance } from '@atlaskit/textfield';
|
|
19
|
-
`,
|
|
20
|
-
`
|
|
21
|
-
import { TextFieldColors, Appearance } from '@atlaskit/textfield';
|
|
22
|
-
`,
|
|
23
|
-
'should rename themeTokens & ThemeAppearance to TextFieldColors & Appearance',
|
|
24
|
-
);
|
|
25
|
-
defineInlineTest(
|
|
26
|
-
{ default: transformer, parser: 'tsx' },
|
|
27
|
-
{},
|
|
28
|
-
`
|
|
29
|
-
import Textfield, { ThemeAppearance, themeTokens } from '@atlaskit/textfield';
|
|
30
|
-
`,
|
|
31
|
-
`
|
|
32
|
-
import Textfield, { Appearance, TextFieldColors } from '@atlaskit/textfield';
|
|
33
|
-
`,
|
|
34
|
-
'should rename themeTokens & Appearance to TextFieldColors & Appearance and keep Textfield default import as is',
|
|
35
|
-
);
|
|
36
|
-
defineInlineTest(
|
|
37
|
-
{ default: transformer, parser: 'tsx' },
|
|
38
|
-
{},
|
|
39
|
-
`
|
|
40
|
-
import Textfield, { TextFieldProps, themeTokens } from '@atlaskit/textfield';
|
|
41
|
-
`,
|
|
42
|
-
`
|
|
43
|
-
import Textfield, { TextFieldProps, TextFieldColors } from '@atlaskit/textfield';
|
|
44
|
-
`,
|
|
45
|
-
'should rename themeTokens to TextFieldColors and keep TextFieldProps as is',
|
|
46
|
-
);
|
|
47
|
-
defineInlineTest(
|
|
48
|
-
{ default: transformer, parser: 'tsx' },
|
|
49
|
-
{},
|
|
50
|
-
`
|
|
51
|
-
import Textfield, { TextFieldProps, themeTokens as MyLifeMyColors } from '@atlaskit/textfield';
|
|
52
|
-
`,
|
|
53
|
-
`
|
|
54
|
-
import Textfield, { TextFieldProps, TextFieldColors as MyLifeMyColors } from '@atlaskit/textfield';
|
|
55
|
-
`,
|
|
56
|
-
'should rename themeTokens to TextFieldColors and keep its alias name as is',
|
|
57
|
-
);
|
|
58
|
-
defineInlineTest(
|
|
59
|
-
{ default: transformer, parser: 'tsx' },
|
|
60
|
-
{},
|
|
61
|
-
`
|
|
62
|
-
import Textfield, { ThemeProps as TextfieldThemeProp,
|
|
63
|
-
ThemeAppearance as TextFieldAppearance, Theme as TextFieldTheme, themeTokens as MyLifeMyColors, ThemeTokens as TextfieldThemeTokens} from '@atlaskit/textfield';
|
|
64
|
-
`,
|
|
65
|
-
`
|
|
66
|
-
import Textfield, { ThemeProps as TextfieldThemeProp,
|
|
67
|
-
Appearance as TextFieldAppearance, Theme as TextFieldTheme, TextFieldColors as MyLifeMyColors, ThemeTokens as TextfieldThemeTokens} from '@atlaskit/textfield';
|
|
68
|
-
`,
|
|
69
|
-
'should rename themeTokens to TextFieldColors, ThemeAppearance to Appearance and keep its alias name as is even when there are multiple name exports with alias',
|
|
70
|
-
);
|
|
71
|
-
defineInlineTest(
|
|
72
|
-
{ default: transformer, parser: 'tsx' },
|
|
73
|
-
{},
|
|
74
|
-
`
|
|
75
|
-
import { themeTokens, TextFieldProps } from '@atlaskit/textfield';
|
|
76
|
-
`,
|
|
77
|
-
`
|
|
78
|
-
import { TextFieldColors, TextFieldProps } from '@atlaskit/textfield';
|
|
79
|
-
`,
|
|
80
|
-
'should rename themeTokens to TextFieldColors and keep TextFieldProps named import as is',
|
|
81
|
-
);
|
|
82
|
-
});
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { createRemoveImportsFor } from './utils';
|
|
2
|
-
|
|
3
|
-
export const removeThemeImports = createRemoveImportsFor({
|
|
4
|
-
importsToRemove: ['ThemeProps', 'ThemeTokens', 'Theme'],
|
|
5
|
-
packagePath: '@atlaskit/textfield',
|
|
6
|
-
comment: `This file uses exports used to help theme @atlaskit/textfield which
|
|
7
|
-
has now been removed due to its poor performance characteristics.`,
|
|
8
|
-
});
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { createRemoveFuncFor } from './utils';
|
|
2
|
-
|
|
3
|
-
const component = '@atlaskit/textfield';
|
|
4
|
-
const prop = 'theme';
|
|
5
|
-
const comment = `This file uses the @atlaskit/textfield \`theme\` prop which
|
|
6
|
-
has now been removed due to its poor performance characteristics. We have not replaced
|
|
7
|
-
theme with an equivalent API due to minimal usage of the \`theme\` prop.
|
|
8
|
-
The appearance of TextField will have likely changed.`;
|
|
9
|
-
|
|
10
|
-
export const removeThemeProp = createRemoveFuncFor(component, prop, comment);
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { createRenameJSXFunc } from './utils';
|
|
2
|
-
|
|
3
|
-
export const renamethemeTokensImport = createRenameJSXFunc(
|
|
4
|
-
'@atlaskit/textfield',
|
|
5
|
-
'themeTokens',
|
|
6
|
-
'TextFieldColors',
|
|
7
|
-
'DSTextFieldColors',
|
|
8
|
-
);
|
|
9
|
-
|
|
10
|
-
export const renameThemeAppearanceImport = createRenameJSXFunc(
|
|
11
|
-
'@atlaskit/textfield',
|
|
12
|
-
'ThemeAppearance',
|
|
13
|
-
'Appearance',
|
|
14
|
-
'DSTextFieldAppearance',
|
|
15
|
-
);
|
|
@@ -1,335 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
type API,
|
|
3
|
-
type ASTPath,
|
|
4
|
-
type default as core,
|
|
5
|
-
type FileInfo,
|
|
6
|
-
type Identifier,
|
|
7
|
-
type ImportDeclaration,
|
|
8
|
-
type ImportSpecifier,
|
|
9
|
-
type JSXAttribute,
|
|
10
|
-
type Options,
|
|
11
|
-
type Program,
|
|
12
|
-
} from 'jscodeshift';
|
|
13
|
-
import { type Collection } from 'jscodeshift/src/Collection';
|
|
14
|
-
|
|
15
|
-
export type Nullable<T> = T | null;
|
|
16
|
-
|
|
17
|
-
export function getDefaultSpecifier(j: core.JSCodeshift, source: any, specifier: string) {
|
|
18
|
-
const specifiers = source
|
|
19
|
-
.find(j.ImportDeclaration)
|
|
20
|
-
.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === specifier)
|
|
21
|
-
.find(j.ImportDefaultSpecifier);
|
|
22
|
-
|
|
23
|
-
if (!specifiers.length) {
|
|
24
|
-
return null;
|
|
25
|
-
}
|
|
26
|
-
return specifiers.nodes()[0]!.local!.name;
|
|
27
|
-
}
|
|
28
|
-
export function getNamedSpecifier(
|
|
29
|
-
j: core.JSCodeshift,
|
|
30
|
-
source: any,
|
|
31
|
-
specifier: string,
|
|
32
|
-
importName: string,
|
|
33
|
-
) {
|
|
34
|
-
const specifiers = source
|
|
35
|
-
.find(j.ImportDeclaration)
|
|
36
|
-
.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === specifier)
|
|
37
|
-
.find(j.ImportSpecifier)
|
|
38
|
-
.filter((path: ASTPath<ImportSpecifier>) => path.node.imported.name === importName);
|
|
39
|
-
|
|
40
|
-
if (!specifiers.length) {
|
|
41
|
-
return null;
|
|
42
|
-
}
|
|
43
|
-
return specifiers.nodes()[0]!.local!.name;
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
export function getJSXAttributesByName(
|
|
47
|
-
j: core.JSCodeshift,
|
|
48
|
-
element: ASTPath<any>,
|
|
49
|
-
attributeName: string,
|
|
50
|
-
): Collection<JSXAttribute> {
|
|
51
|
-
return j(element)
|
|
52
|
-
.find(j.JSXOpeningElement)
|
|
53
|
-
.find(j.JSXAttribute)
|
|
54
|
-
.filter((attribute) => {
|
|
55
|
-
const matches = j(attribute)
|
|
56
|
-
.find(j.JSXIdentifier)
|
|
57
|
-
.filter((identifier) => identifier.value.name === attributeName);
|
|
58
|
-
return Boolean(matches.length);
|
|
59
|
-
});
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
export function hasImportDeclaration(j: core.JSCodeshift, source: any, importPath: string) {
|
|
63
|
-
const imports = source
|
|
64
|
-
.find(j.ImportDeclaration)
|
|
65
|
-
.filter(
|
|
66
|
-
(path: ASTPath<ImportDeclaration>) =>
|
|
67
|
-
typeof path.node.source.value === 'string' && path.node.source.value.startsWith(importPath),
|
|
68
|
-
);
|
|
69
|
-
|
|
70
|
-
return Boolean(imports.length);
|
|
71
|
-
}
|
|
72
|
-
// not replacing newlines (which \s does)
|
|
73
|
-
const spacesAndTabs: RegExp = /[ \t]{2,}/g;
|
|
74
|
-
const lineStartWithSpaces: RegExp = /^[ \t]*/gm;
|
|
75
|
-
|
|
76
|
-
function clean(value: string): string {
|
|
77
|
-
return (
|
|
78
|
-
value
|
|
79
|
-
.replace(spacesAndTabs, ' ')
|
|
80
|
-
.replace(lineStartWithSpaces, '')
|
|
81
|
-
// using .trim() to clear the any newlines before the first text and after last text
|
|
82
|
-
.trim()
|
|
83
|
-
);
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
export function addCommentToStartOfFile({
|
|
87
|
-
j,
|
|
88
|
-
base,
|
|
89
|
-
message,
|
|
90
|
-
}: {
|
|
91
|
-
j: core.JSCodeshift;
|
|
92
|
-
base: Collection<Node>;
|
|
93
|
-
message: string;
|
|
94
|
-
}) {
|
|
95
|
-
addCommentBefore({
|
|
96
|
-
j,
|
|
97
|
-
target: base.find(j.Program),
|
|
98
|
-
message,
|
|
99
|
-
});
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
export function addCommentBefore({
|
|
103
|
-
j,
|
|
104
|
-
target,
|
|
105
|
-
message,
|
|
106
|
-
}: {
|
|
107
|
-
j: core.JSCodeshift;
|
|
108
|
-
target: Collection<Program> | Collection<ImportDeclaration>;
|
|
109
|
-
message: string;
|
|
110
|
-
}) {
|
|
111
|
-
const content: string = ` TODO: (from codemod) ${clean(message)} `;
|
|
112
|
-
target.forEach((path: ASTPath<Program | ImportDeclaration>) => {
|
|
113
|
-
path.value.comments = path.value.comments || [];
|
|
114
|
-
|
|
115
|
-
const exists = path.value.comments.find((comment) => comment.value === content);
|
|
116
|
-
|
|
117
|
-
// avoiding duplicates of the same comment
|
|
118
|
-
if (exists) {
|
|
119
|
-
return;
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
path.value.comments.push(j.commentBlock(content));
|
|
123
|
-
});
|
|
124
|
-
}
|
|
125
|
-
|
|
126
|
-
export function doesIdentifierExist({
|
|
127
|
-
j,
|
|
128
|
-
base,
|
|
129
|
-
name,
|
|
130
|
-
}: {
|
|
131
|
-
j: core.JSCodeshift;
|
|
132
|
-
base: Collection<any>;
|
|
133
|
-
name: string;
|
|
134
|
-
}): boolean {
|
|
135
|
-
return (
|
|
136
|
-
base
|
|
137
|
-
.find(j.Identifier)
|
|
138
|
-
.filter((identifer: ASTPath<Identifier>) => identifer.value.name === name).length > 0
|
|
139
|
-
);
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
export function getSafeImportName({
|
|
143
|
-
j,
|
|
144
|
-
base,
|
|
145
|
-
currentDefaultSpecifierName,
|
|
146
|
-
desiredName,
|
|
147
|
-
fallbackName,
|
|
148
|
-
}: {
|
|
149
|
-
j: core.JSCodeshift;
|
|
150
|
-
base: Collection<any>;
|
|
151
|
-
currentDefaultSpecifierName: string;
|
|
152
|
-
desiredName: string;
|
|
153
|
-
fallbackName: string;
|
|
154
|
-
}) {
|
|
155
|
-
if (currentDefaultSpecifierName === desiredName) {
|
|
156
|
-
return desiredName;
|
|
157
|
-
}
|
|
158
|
-
|
|
159
|
-
const isUsed: boolean = doesIdentifierExist({ j, base, name: desiredName });
|
|
160
|
-
|
|
161
|
-
return isUsed ? fallbackName : desiredName;
|
|
162
|
-
}
|
|
163
|
-
|
|
164
|
-
export const createRemoveFuncFor =
|
|
165
|
-
(component: string, prop: string, comment?: string) =>
|
|
166
|
-
(j: core.JSCodeshift, source: Collection<Node>) => {
|
|
167
|
-
const defaultSpecifier = getDefaultSpecifier(j, source, component);
|
|
168
|
-
|
|
169
|
-
if (!defaultSpecifier) {
|
|
170
|
-
return;
|
|
171
|
-
}
|
|
172
|
-
|
|
173
|
-
source.findJSXElements(defaultSpecifier).forEach((element) => {
|
|
174
|
-
getJSXAttributesByName(j, element, prop).forEach((attribute) => {
|
|
175
|
-
j(attribute).remove();
|
|
176
|
-
if (comment) {
|
|
177
|
-
addCommentToStartOfFile({ j, base: source, message: comment });
|
|
178
|
-
}
|
|
179
|
-
});
|
|
180
|
-
});
|
|
181
|
-
};
|
|
182
|
-
|
|
183
|
-
export const createRemoveImportsFor =
|
|
184
|
-
({
|
|
185
|
-
importsToRemove,
|
|
186
|
-
packagePath,
|
|
187
|
-
comment,
|
|
188
|
-
}: {
|
|
189
|
-
importsToRemove: string[];
|
|
190
|
-
packagePath: string;
|
|
191
|
-
comment: string;
|
|
192
|
-
}) =>
|
|
193
|
-
(j: core.JSCodeshift, source: Collection<Node>) => {
|
|
194
|
-
const isUsingName: boolean =
|
|
195
|
-
source.find(j.ImportDeclaration).filter((path) => path.node.source.value === packagePath)
|
|
196
|
-
.length > 0;
|
|
197
|
-
if (!isUsingName) {
|
|
198
|
-
return;
|
|
199
|
-
}
|
|
200
|
-
|
|
201
|
-
const existingAliases: Nullable<string>[] =
|
|
202
|
-
source
|
|
203
|
-
.find(j.ImportDeclaration)
|
|
204
|
-
.filter((path) => path.node.source.value === packagePath)
|
|
205
|
-
.find(j.ImportSpecifier)
|
|
206
|
-
.nodes()
|
|
207
|
-
.map((specifier): Nullable<string> => {
|
|
208
|
-
if (!importsToRemove.includes(specifier.imported.name)) {
|
|
209
|
-
return null;
|
|
210
|
-
}
|
|
211
|
-
// If aliased: return the alias
|
|
212
|
-
if (specifier.local && !importsToRemove.includes(specifier.local.name)) {
|
|
213
|
-
return specifier.local.name;
|
|
214
|
-
}
|
|
215
|
-
|
|
216
|
-
return null;
|
|
217
|
-
})
|
|
218
|
-
.filter(Boolean) || null;
|
|
219
|
-
|
|
220
|
-
// Add comments
|
|
221
|
-
source
|
|
222
|
-
.find(j.ImportDeclaration)
|
|
223
|
-
.filter((path) => path.node.source.value === packagePath)
|
|
224
|
-
.find(j.ImportSpecifier)
|
|
225
|
-
.filter((importSpecifier) => {
|
|
226
|
-
const identifier = j(importSpecifier).find(j.Identifier).get();
|
|
227
|
-
if (
|
|
228
|
-
importsToRemove.includes(identifier.value.name) ||
|
|
229
|
-
existingAliases.includes(identifier.value.name)
|
|
230
|
-
) {
|
|
231
|
-
addCommentToStartOfFile({ j, base: source, message: comment });
|
|
232
|
-
return true;
|
|
233
|
-
}
|
|
234
|
-
return false;
|
|
235
|
-
})
|
|
236
|
-
.remove();
|
|
237
|
-
|
|
238
|
-
// Remove entire import if it is empty
|
|
239
|
-
const isEmptyNamedImport =
|
|
240
|
-
source
|
|
241
|
-
.find(j.ImportDeclaration)
|
|
242
|
-
.filter((path) => path.node.source.value === packagePath)
|
|
243
|
-
.find(j.ImportSpecifier)
|
|
244
|
-
.find(j.Identifier).length === 0;
|
|
245
|
-
|
|
246
|
-
if (isEmptyNamedImport) {
|
|
247
|
-
const isEmptyDefaultImport =
|
|
248
|
-
source
|
|
249
|
-
.find(j.ImportDeclaration)
|
|
250
|
-
.filter((path) => path.node.source.value === packagePath)
|
|
251
|
-
.find(j.ImportDefaultSpecifier)
|
|
252
|
-
.find(j.Identifier).length === 0;
|
|
253
|
-
|
|
254
|
-
isEmptyDefaultImport
|
|
255
|
-
? source
|
|
256
|
-
.find(j.ImportDeclaration)
|
|
257
|
-
.filter((path) => path.node.source.value === packagePath)
|
|
258
|
-
.remove()
|
|
259
|
-
: source
|
|
260
|
-
.find(j.ImportDeclaration)
|
|
261
|
-
.filter((path) => path.node.source.value === packagePath)
|
|
262
|
-
.find(j.ImportSpecifier)
|
|
263
|
-
.remove();
|
|
264
|
-
}
|
|
265
|
-
};
|
|
266
|
-
|
|
267
|
-
export const createRenameJSXFunc =
|
|
268
|
-
(packagePath: string, from: string, to: string, fallback: string | undefined = undefined) =>
|
|
269
|
-
(j: core.JSCodeshift, source: any) => {
|
|
270
|
-
const namedSpecifier = getNamedSpecifier(j, source, packagePath, from);
|
|
271
|
-
|
|
272
|
-
const toName = fallback
|
|
273
|
-
? getSafeImportName({
|
|
274
|
-
j,
|
|
275
|
-
base: source,
|
|
276
|
-
currentDefaultSpecifierName: namedSpecifier,
|
|
277
|
-
desiredName: to,
|
|
278
|
-
fallbackName: fallback,
|
|
279
|
-
})
|
|
280
|
-
: to;
|
|
281
|
-
|
|
282
|
-
const existingAlias: Nullable<string> =
|
|
283
|
-
source
|
|
284
|
-
.find(j.ImportDeclaration)
|
|
285
|
-
.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === packagePath)
|
|
286
|
-
.find(j.ImportSpecifier)
|
|
287
|
-
.nodes()
|
|
288
|
-
.map((specifier: ImportSpecifier): Nullable<string> => {
|
|
289
|
-
if (from !== specifier.imported.name) {
|
|
290
|
-
return null;
|
|
291
|
-
}
|
|
292
|
-
// If aliased: return the alias
|
|
293
|
-
if (specifier.local && from !== specifier.local.name) {
|
|
294
|
-
return specifier.local.name;
|
|
295
|
-
}
|
|
296
|
-
|
|
297
|
-
return null;
|
|
298
|
-
})
|
|
299
|
-
.filter(Boolean)[0] || null;
|
|
300
|
-
|
|
301
|
-
source
|
|
302
|
-
.find(j.ImportDeclaration)
|
|
303
|
-
.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === packagePath)
|
|
304
|
-
.find(j.ImportSpecifier)
|
|
305
|
-
.filter((importSpecifier: ImportSpecifier) => {
|
|
306
|
-
const identifier = j(importSpecifier).find(j.Identifier).get();
|
|
307
|
-
if (from === identifier.value.name || existingAlias === identifier.value.name) {
|
|
308
|
-
return true;
|
|
309
|
-
}
|
|
310
|
-
return false;
|
|
311
|
-
})
|
|
312
|
-
.replaceWith(
|
|
313
|
-
[
|
|
314
|
-
j.importSpecifier(
|
|
315
|
-
j.identifier(toName),
|
|
316
|
-
existingAlias ? j.identifier(existingAlias) : null,
|
|
317
|
-
),
|
|
318
|
-
],
|
|
319
|
-
j.literal(packagePath),
|
|
320
|
-
);
|
|
321
|
-
};
|
|
322
|
-
|
|
323
|
-
export const createTransformer =
|
|
324
|
-
(component: string, migrates: { (j: core.JSCodeshift, source: Collection<Node>): void }[]) =>
|
|
325
|
-
(fileInfo: FileInfo, { jscodeshift: j }: API, options: Options) => {
|
|
326
|
-
const source: Collection<Node> = j(fileInfo.source);
|
|
327
|
-
|
|
328
|
-
if (!hasImportDeclaration(j, source, component)) {
|
|
329
|
-
return fileInfo.source;
|
|
330
|
-
}
|
|
331
|
-
|
|
332
|
-
migrates.forEach((tf) => tf(j, source));
|
|
333
|
-
|
|
334
|
-
return source.toSource(options.printOptions || { quote: 'single' });
|
|
335
|
-
};
|