@atlaskit/avatar 21.18.2 → 21.18.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 +8 -0
- package/dist/cjs/avatar.js +1 -1
- package/dist/es2019/avatar.js +1 -1
- package/dist/esm/avatar.js +1 -1
- package/package.json +2 -4
- package/codemods/18.0.0-lite-mode.ts +0 -252
- package/codemods/19.0.0-render-props.ts +0 -125
- package/codemods/__tests__/18.0.0-lite-mode.ts +0 -514
- package/codemods/__tests__/19.0.0-render-props.ts +0 -118
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# @atlaskit/avatar
|
|
2
2
|
|
|
3
|
+
## 21.18.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [#111651](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/111651)
|
|
8
|
+
[`0627ea1ac419e`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/0627ea1ac419e) -
|
|
9
|
+
Remove old codemods and update dependencies.
|
|
10
|
+
|
|
3
11
|
## 21.18.2
|
|
4
12
|
|
|
5
13
|
### Patch Changes
|
package/dist/cjs/avatar.js
CHANGED
|
@@ -28,7 +28,7 @@ var _templateObject;
|
|
|
28
28
|
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
29
29
|
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
30
30
|
var packageName = "@atlaskit/avatar";
|
|
31
|
-
var packageVersion = "21.18.
|
|
31
|
+
var packageVersion = "21.18.3";
|
|
32
32
|
var getTestId = function getTestId(testId, children) {
|
|
33
33
|
return !children ? {
|
|
34
34
|
'data-testid': "".concat(testId, "--inner")
|
package/dist/es2019/avatar.js
CHANGED
|
@@ -16,7 +16,7 @@ import { PresenceWrapper } from './presence';
|
|
|
16
16
|
import { StatusWrapper } from './status';
|
|
17
17
|
import { getButtonProps, getCustomElement, getLinkProps } from './utilities';
|
|
18
18
|
const packageName = "@atlaskit/avatar";
|
|
19
|
-
const packageVersion = "21.18.
|
|
19
|
+
const packageVersion = "21.18.3";
|
|
20
20
|
const getTestId = (testId, children) => !children ? {
|
|
21
21
|
'data-testid': `${testId}--inner`
|
|
22
22
|
} : {
|
package/dist/esm/avatar.js
CHANGED
|
@@ -21,7 +21,7 @@ import { PresenceWrapper } from './presence';
|
|
|
21
21
|
import { StatusWrapper } from './status';
|
|
22
22
|
import { getButtonProps, getCustomElement, getLinkProps } from './utilities';
|
|
23
23
|
var packageName = "@atlaskit/avatar";
|
|
24
|
-
var packageVersion = "21.18.
|
|
24
|
+
var packageVersion = "21.18.3";
|
|
25
25
|
var getTestId = function getTestId(testId, children) {
|
|
26
26
|
return !children ? {
|
|
27
27
|
'data-testid': "".concat(testId, "--inner")
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/avatar",
|
|
3
|
-
"version": "21.18.
|
|
3
|
+
"version": "21.18.3",
|
|
4
4
|
"description": "An avatar is a visual representation of a user or entity.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -47,7 +47,7 @@
|
|
|
47
47
|
"@atlaskit/focus-ring": "^2.1.0",
|
|
48
48
|
"@atlaskit/icon": "^23.7.0",
|
|
49
49
|
"@atlaskit/platform-feature-flags": "^1.0.0",
|
|
50
|
-
"@atlaskit/primitives": "^13.
|
|
50
|
+
"@atlaskit/primitives": "^13.5.0",
|
|
51
51
|
"@atlaskit/theme": "^15.0.0",
|
|
52
52
|
"@atlaskit/tokens": "^3.3.0",
|
|
53
53
|
"@babel/runtime": "^7.0.0",
|
|
@@ -76,9 +76,7 @@
|
|
|
76
76
|
"@emotion/styled": "^11.0.0",
|
|
77
77
|
"@testing-library/react": "^13.4.0",
|
|
78
78
|
"@testing-library/user-event": "^14.4.3",
|
|
79
|
-
"@types/jscodeshift": "^0.11.0",
|
|
80
79
|
"jest-in-case": "^1.0.2",
|
|
81
|
-
"jscodeshift": "^0.13.0",
|
|
82
80
|
"react-dom": "^18.2.0",
|
|
83
81
|
"typescript": "~5.4.2"
|
|
84
82
|
},
|
|
@@ -1,252 +0,0 @@
|
|
|
1
|
-
// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
|
|
2
|
-
import type {
|
|
3
|
-
API,
|
|
4
|
-
ASTPath,
|
|
5
|
-
default as core,
|
|
6
|
-
FileInfo,
|
|
7
|
-
ImportDeclaration,
|
|
8
|
-
ImportSpecifier,
|
|
9
|
-
MemberExpression,
|
|
10
|
-
Options,
|
|
11
|
-
} from 'jscodeshift';
|
|
12
|
-
|
|
13
|
-
function getImportDeclaration(
|
|
14
|
-
j: core.JSCodeshift,
|
|
15
|
-
source: ReturnType<typeof j>,
|
|
16
|
-
specifier: string,
|
|
17
|
-
) {
|
|
18
|
-
return source
|
|
19
|
-
.find(j.ImportDeclaration)
|
|
20
|
-
.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === specifier);
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
function getDefaultSpecifier(j: core.JSCodeshift, source: ReturnType<typeof j>, specifier: string) {
|
|
24
|
-
const specifiers = source
|
|
25
|
-
.find(j.ImportDeclaration)
|
|
26
|
-
.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === specifier)
|
|
27
|
-
.find(j.ImportDefaultSpecifier);
|
|
28
|
-
|
|
29
|
-
if (!specifiers.length) {
|
|
30
|
-
return null;
|
|
31
|
-
}
|
|
32
|
-
return specifiers.nodes()[0]!.local!.name;
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
function getImportSpecifier(
|
|
36
|
-
j: core.JSCodeshift,
|
|
37
|
-
source: ReturnType<typeof j>,
|
|
38
|
-
specifier: string,
|
|
39
|
-
imported: string,
|
|
40
|
-
) {
|
|
41
|
-
const specifiers = source
|
|
42
|
-
.find(j.ImportDeclaration)
|
|
43
|
-
.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === specifier)
|
|
44
|
-
.find(j.ImportSpecifier)
|
|
45
|
-
.filter((path: ASTPath<ImportSpecifier>) => path.value.imported.name === imported);
|
|
46
|
-
|
|
47
|
-
if (!specifiers.length) {
|
|
48
|
-
return null;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
return specifiers.nodes()[0]!.local!.name;
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
function getJSXAttributesByName(j: core.JSCodeshift, element: ASTPath<any>, attributeName: string) {
|
|
55
|
-
return j(element)
|
|
56
|
-
.find(j.JSXOpeningElement)
|
|
57
|
-
.find(j.JSXAttribute)
|
|
58
|
-
.filter((attribute) => {
|
|
59
|
-
const matches = j(attribute)
|
|
60
|
-
.find(j.JSXIdentifier)
|
|
61
|
-
.filter((identifier) => identifier.value.name === attributeName);
|
|
62
|
-
return Boolean(matches.length);
|
|
63
|
-
});
|
|
64
|
-
}
|
|
65
|
-
|
|
66
|
-
function updateAvatarProps(j: core.JSCodeshift, source: ReturnType<typeof j>) {
|
|
67
|
-
const defaultSpecifier = getDefaultSpecifier(j, source, '@atlaskit/avatar');
|
|
68
|
-
|
|
69
|
-
if (!defaultSpecifier) {
|
|
70
|
-
return;
|
|
71
|
-
}
|
|
72
|
-
|
|
73
|
-
source.findJSXElements(defaultSpecifier).forEach((element) => {
|
|
74
|
-
getJSXAttributesByName(j, element, 'isHover').remove();
|
|
75
|
-
getJSXAttributesByName(j, element, 'isActive').remove();
|
|
76
|
-
getJSXAttributesByName(j, element, 'isFocus').remove();
|
|
77
|
-
getJSXAttributesByName(j, element, 'isSelected').remove();
|
|
78
|
-
getJSXAttributesByName(j, element, 'theme').remove();
|
|
79
|
-
|
|
80
|
-
const nameAttributes = getJSXAttributesByName(j, element, 'name');
|
|
81
|
-
const name = nameAttributes.length && nameAttributes.get();
|
|
82
|
-
const enableTooltipAttributes = getJSXAttributesByName(j, element, 'enableTooltip');
|
|
83
|
-
const enableTooltipValue = enableTooltipAttributes.length && enableTooltipAttributes;
|
|
84
|
-
|
|
85
|
-
const hasDefaultTrue = !!enableTooltipAttributes.filter((attr) => attr.node.value == null)
|
|
86
|
-
.length;
|
|
87
|
-
|
|
88
|
-
const hasTruthy = !!enableTooltipAttributes
|
|
89
|
-
.find(j.JSXExpressionContainer)
|
|
90
|
-
.find(j.BooleanLiteral)
|
|
91
|
-
.filter((literal) => literal.node.value).length;
|
|
92
|
-
|
|
93
|
-
const hasFalsy = !!enableTooltipAttributes
|
|
94
|
-
.find(j.JSXExpressionContainer)
|
|
95
|
-
.find(j.BooleanLiteral)
|
|
96
|
-
.filter((literal) => literal.node.value === false).length;
|
|
97
|
-
|
|
98
|
-
const hasExpression = !!enableTooltipAttributes
|
|
99
|
-
.find(j.JSXExpressionContainer)
|
|
100
|
-
.filter((container) => {
|
|
101
|
-
return j(container).find(j.BooleanLiteral).length === 0;
|
|
102
|
-
}).length;
|
|
103
|
-
|
|
104
|
-
const shouldWrapAvatar = !hasFalsy || hasDefaultTrue || hasTruthy || hasExpression;
|
|
105
|
-
|
|
106
|
-
if (shouldWrapAvatar && name) {
|
|
107
|
-
getImportDeclaration(j, source, '@atlaskit/avatar').forEach((importDeclaration) => {
|
|
108
|
-
j(importDeclaration).replaceWith([
|
|
109
|
-
j.importDeclaration(
|
|
110
|
-
[j.importDefaultSpecifier(j.identifier('Tooltip'))],
|
|
111
|
-
j.literal('@atlaskit/tooltip'),
|
|
112
|
-
),
|
|
113
|
-
importDeclaration.value,
|
|
114
|
-
]);
|
|
115
|
-
});
|
|
116
|
-
|
|
117
|
-
const wrappedAvatar = j.jsxElement(
|
|
118
|
-
j.jsxOpeningElement(j.jsxIdentifier('Tooltip'), [
|
|
119
|
-
j.jsxAttribute(j.jsxIdentifier('content'), name.value.value),
|
|
120
|
-
]),
|
|
121
|
-
j.jsxClosingElement(j.jsxIdentifier('Tooltip')),
|
|
122
|
-
[
|
|
123
|
-
j.jsxElement(
|
|
124
|
-
element.value.openingElement,
|
|
125
|
-
element.value.closingElement,
|
|
126
|
-
element.value.children,
|
|
127
|
-
),
|
|
128
|
-
],
|
|
129
|
-
);
|
|
130
|
-
|
|
131
|
-
if (hasExpression && enableTooltipValue) {
|
|
132
|
-
j(element).replaceWith([
|
|
133
|
-
j.conditionalExpression(
|
|
134
|
-
enableTooltipValue.find(j.JSXExpressionContainer).get().value.expression,
|
|
135
|
-
wrappedAvatar,
|
|
136
|
-
element.value,
|
|
137
|
-
),
|
|
138
|
-
]);
|
|
139
|
-
} else {
|
|
140
|
-
j(element).replaceWith([wrappedAvatar]);
|
|
141
|
-
}
|
|
142
|
-
}
|
|
143
|
-
|
|
144
|
-
enableTooltipValue && enableTooltipValue.remove();
|
|
145
|
-
});
|
|
146
|
-
}
|
|
147
|
-
|
|
148
|
-
function updateAvatarItemProps(j: core.JSCodeshift, source: ReturnType<typeof j>) {
|
|
149
|
-
const importSpecifier = getImportSpecifier(j, source, '@atlaskit/avatar', 'AvatarItem');
|
|
150
|
-
|
|
151
|
-
if (!importSpecifier) {
|
|
152
|
-
return;
|
|
153
|
-
}
|
|
154
|
-
|
|
155
|
-
source.findJSXElements(importSpecifier).forEach((element) => {
|
|
156
|
-
getJSXAttributesByName(j, element, 'isHover').remove();
|
|
157
|
-
getJSXAttributesByName(j, element, 'isActive').remove();
|
|
158
|
-
getJSXAttributesByName(j, element, 'isFocus').remove();
|
|
159
|
-
getJSXAttributesByName(j, element, 'isSelected').remove();
|
|
160
|
-
getJSXAttributesByName(j, element, 'theme').remove();
|
|
161
|
-
getJSXAttributesByName(j, element, 'enableTextTruncate').forEach((attribute) => {
|
|
162
|
-
// Change the prop name to isTruncationDisabled
|
|
163
|
-
j(attribute).find(j.JSXIdentifier).replaceWith(j.jsxIdentifier('isTruncationDisabled'));
|
|
164
|
-
|
|
165
|
-
// Remove if enableTextTruncate was true or given no value (ie true)
|
|
166
|
-
j(attribute)
|
|
167
|
-
.filter((attr) => attr.node.value == null)
|
|
168
|
-
.remove();
|
|
169
|
-
|
|
170
|
-
j(attribute)
|
|
171
|
-
.filter((attr) => {
|
|
172
|
-
return !!j(attr)
|
|
173
|
-
.find(j.JSXExpressionContainer)
|
|
174
|
-
.find(j.BooleanLiteral)
|
|
175
|
-
.filter((literal) => literal.node.value).length;
|
|
176
|
-
})
|
|
177
|
-
.remove();
|
|
178
|
-
|
|
179
|
-
// if `enableTextTruncate` value is negative we can change it to 'true'
|
|
180
|
-
j(attribute)
|
|
181
|
-
.filter(
|
|
182
|
-
(attr) =>
|
|
183
|
-
!!j(attr)
|
|
184
|
-
.find(j.JSXExpressionContainer)
|
|
185
|
-
.filter(
|
|
186
|
-
(expression) =>
|
|
187
|
-
j(expression)
|
|
188
|
-
.find(j.BooleanLiteral)
|
|
189
|
-
.filter((literal) => !literal.node.value).length > 0,
|
|
190
|
-
).length,
|
|
191
|
-
)
|
|
192
|
-
.replaceWith(j.jsxAttribute(j.jsxIdentifier('isTruncationDisabled')));
|
|
193
|
-
|
|
194
|
-
// if `enableTextTruncate` was an expression, negate it
|
|
195
|
-
j(attribute)
|
|
196
|
-
.find(j.JSXExpressionContainer)
|
|
197
|
-
.filter((container) => {
|
|
198
|
-
return j(container).find(j.BooleanLiteral).length === 0;
|
|
199
|
-
})
|
|
200
|
-
.forEach((container) => {
|
|
201
|
-
j(container).replaceWith(
|
|
202
|
-
j.jsxExpressionContainer(
|
|
203
|
-
// Type 'JSXEmptyExpression' is not assignable to type 'ExpressionKind'.
|
|
204
|
-
// @ts-ignore TS2345
|
|
205
|
-
j.unaryExpression('!', container.node.expression),
|
|
206
|
-
),
|
|
207
|
-
);
|
|
208
|
-
});
|
|
209
|
-
});
|
|
210
|
-
});
|
|
211
|
-
}
|
|
212
|
-
|
|
213
|
-
function updateBorderWidthUsage(j: core.JSCodeshift, source: ReturnType<typeof j>) {
|
|
214
|
-
source
|
|
215
|
-
.find(j.MemberExpression)
|
|
216
|
-
.filter(
|
|
217
|
-
(memberExpression: ASTPath<MemberExpression>) =>
|
|
218
|
-
// @ts-ignore
|
|
219
|
-
memberExpression.value.object.name === 'BORDER_WIDTH',
|
|
220
|
-
)
|
|
221
|
-
.forEach((memberExpression: ASTPath<MemberExpression>) => {
|
|
222
|
-
if (memberExpression.value.property) {
|
|
223
|
-
j(memberExpression).replaceWith(
|
|
224
|
-
// @ts-ignore
|
|
225
|
-
j.identifier(memberExpression.value.object.name),
|
|
226
|
-
);
|
|
227
|
-
}
|
|
228
|
-
});
|
|
229
|
-
}
|
|
230
|
-
|
|
231
|
-
function hasImportDeclaration(
|
|
232
|
-
j: core.JSCodeshift,
|
|
233
|
-
source: ReturnType<typeof j>,
|
|
234
|
-
importPath: string,
|
|
235
|
-
) {
|
|
236
|
-
return !!source.find(j.ImportDeclaration).filter((path) => path.node.source.value === importPath)
|
|
237
|
-
.length;
|
|
238
|
-
}
|
|
239
|
-
|
|
240
|
-
export default function transformer(fileInfo: FileInfo, { jscodeshift: j }: API, options: Options) {
|
|
241
|
-
const source = j(fileInfo.source);
|
|
242
|
-
|
|
243
|
-
if (hasImportDeclaration(j, source, '@atlaskit/avatar')) {
|
|
244
|
-
updateBorderWidthUsage(j, source);
|
|
245
|
-
updateAvatarProps(j, source);
|
|
246
|
-
updateAvatarItemProps(j, source);
|
|
247
|
-
|
|
248
|
-
return source.toSource(options.printOptions || { quote: 'single' });
|
|
249
|
-
}
|
|
250
|
-
|
|
251
|
-
return fileInfo.source;
|
|
252
|
-
}
|
|
@@ -1,125 +0,0 @@
|
|
|
1
|
-
// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
|
|
2
|
-
import type {
|
|
3
|
-
API,
|
|
4
|
-
ASTPath,
|
|
5
|
-
default as core,
|
|
6
|
-
FileInfo,
|
|
7
|
-
ImportDeclaration,
|
|
8
|
-
ImportSpecifier,
|
|
9
|
-
Options,
|
|
10
|
-
} from 'jscodeshift';
|
|
11
|
-
|
|
12
|
-
function getDefaultSpecifier(j: core.JSCodeshift, source: ReturnType<typeof j>, specifier: string) {
|
|
13
|
-
const specifiers = source
|
|
14
|
-
.find(j.ImportDeclaration)
|
|
15
|
-
.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === specifier)
|
|
16
|
-
.find(j.ImportDefaultSpecifier);
|
|
17
|
-
|
|
18
|
-
if (!specifiers.length) {
|
|
19
|
-
return null;
|
|
20
|
-
}
|
|
21
|
-
return specifiers.nodes()[0]!.local!.name;
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
function getImportSpecifier(
|
|
25
|
-
j: core.JSCodeshift,
|
|
26
|
-
source: ReturnType<typeof j>,
|
|
27
|
-
specifier: string,
|
|
28
|
-
imported: string,
|
|
29
|
-
) {
|
|
30
|
-
const specifiers = source
|
|
31
|
-
.find(j.ImportDeclaration)
|
|
32
|
-
.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === specifier)
|
|
33
|
-
.find(j.ImportSpecifier)
|
|
34
|
-
.filter((path: ASTPath<ImportSpecifier>) => path.value.imported.name === imported);
|
|
35
|
-
|
|
36
|
-
if (!specifiers.length) {
|
|
37
|
-
return null;
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
return specifiers.nodes()[0]!.local!.name;
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
function getJSXAttributesByName(j: core.JSCodeshift, element: ASTPath<any>, attributeName: string) {
|
|
44
|
-
return j(element)
|
|
45
|
-
.find(j.JSXOpeningElement)
|
|
46
|
-
.find(j.JSXAttribute)
|
|
47
|
-
.filter((attribute) => {
|
|
48
|
-
const matches = j(attribute)
|
|
49
|
-
.find(j.JSXIdentifier)
|
|
50
|
-
.filter((identifier) => identifier.value.name === attributeName);
|
|
51
|
-
return Boolean(matches.length);
|
|
52
|
-
});
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
function wrapChildrenProp(j: core.JSCodeshift, source: ReturnType<typeof j>, specifier: string) {
|
|
56
|
-
source.findJSXElements(specifier).forEach((element) => {
|
|
57
|
-
const componentProp = getJSXAttributesByName(j, element, 'component').get();
|
|
58
|
-
const componentName = j(componentProp).find(j.JSXExpressionContainer).find(j.Expression).get()
|
|
59
|
-
.value.name;
|
|
60
|
-
|
|
61
|
-
const customComponent = j.jsxElement(
|
|
62
|
-
j.jsxOpeningElement(
|
|
63
|
-
j.jsxIdentifier(componentName),
|
|
64
|
-
[j.jsxSpreadAttribute(j.identifier('props'))],
|
|
65
|
-
true,
|
|
66
|
-
),
|
|
67
|
-
);
|
|
68
|
-
|
|
69
|
-
const childrenExpression = j.jsxExpressionContainer(
|
|
70
|
-
j.arrowFunctionExpression(
|
|
71
|
-
[
|
|
72
|
-
j.objectPattern([
|
|
73
|
-
j.objectProperty(j.identifier('ref'), j.identifier('_')),
|
|
74
|
-
j.restProperty(j.identifier('props')),
|
|
75
|
-
]),
|
|
76
|
-
],
|
|
77
|
-
customComponent,
|
|
78
|
-
),
|
|
79
|
-
);
|
|
80
|
-
|
|
81
|
-
j(componentProp).remove();
|
|
82
|
-
j(element).replaceWith(
|
|
83
|
-
j.jsxElement(
|
|
84
|
-
j.jsxOpeningElement(
|
|
85
|
-
element.value.openingElement.name,
|
|
86
|
-
element.value.openingElement.attributes,
|
|
87
|
-
false,
|
|
88
|
-
),
|
|
89
|
-
j.jsxClosingElement(element.value.openingElement.name),
|
|
90
|
-
[childrenExpression],
|
|
91
|
-
),
|
|
92
|
-
);
|
|
93
|
-
});
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
function hasImportDeclaration(
|
|
97
|
-
j: core.JSCodeshift,
|
|
98
|
-
source: ReturnType<typeof j>,
|
|
99
|
-
importPath: string,
|
|
100
|
-
) {
|
|
101
|
-
return !!source.find(j.ImportDeclaration).filter((path) => path.node.source.value === importPath)
|
|
102
|
-
.length;
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
export default function transformer(fileInfo: FileInfo, { jscodeshift: j }: API, options: Options) {
|
|
106
|
-
const source = j(fileInfo.source);
|
|
107
|
-
|
|
108
|
-
if (hasImportDeclaration(j, source, '@atlaskit/avatar')) {
|
|
109
|
-
const defaultSpecifier = getDefaultSpecifier(j, source, '@atlaskit/avatar');
|
|
110
|
-
|
|
111
|
-
if (defaultSpecifier != null) {
|
|
112
|
-
wrapChildrenProp(j, source, defaultSpecifier);
|
|
113
|
-
}
|
|
114
|
-
|
|
115
|
-
const importSpecifier = getImportSpecifier(j, source, '@atlaskit/avatar', 'AvatarItem');
|
|
116
|
-
|
|
117
|
-
if (importSpecifier != null) {
|
|
118
|
-
wrapChildrenProp(j, source, importSpecifier);
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
return source.toSource(options.printOptions || { quote: 'single' });
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
return fileInfo.source;
|
|
125
|
-
}
|
|
@@ -1,514 +0,0 @@
|
|
|
1
|
-
// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
|
|
2
|
-
jest.autoMockOff();
|
|
3
|
-
|
|
4
|
-
import * as transformer from '../18.0.0-lite-mode';
|
|
5
|
-
|
|
6
|
-
const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
|
|
7
|
-
|
|
8
|
-
describe('Update Avatar props', () => {
|
|
9
|
-
defineInlineTest(
|
|
10
|
-
{ ...transformer, parser: 'tsx' },
|
|
11
|
-
{},
|
|
12
|
-
`
|
|
13
|
-
import Avatar from '@atlaskit/avatar';
|
|
14
|
-
|
|
15
|
-
const App = () => {
|
|
16
|
-
return <Avatar name="foo" />;
|
|
17
|
-
}
|
|
18
|
-
`,
|
|
19
|
-
`
|
|
20
|
-
import Tooltip from '@atlaskit/tooltip';
|
|
21
|
-
import Avatar from '@atlaskit/avatar';
|
|
22
|
-
|
|
23
|
-
const App = () => {
|
|
24
|
-
return <Tooltip content="foo"><Avatar name="foo" /></Tooltip>;
|
|
25
|
-
}
|
|
26
|
-
`,
|
|
27
|
-
'should wrap avatar in a tooltip if name is defined',
|
|
28
|
-
);
|
|
29
|
-
|
|
30
|
-
defineInlineTest(
|
|
31
|
-
{ ...transformer, parser: 'tsx' },
|
|
32
|
-
{},
|
|
33
|
-
`
|
|
34
|
-
import Avatar from '@atlaskit/avatar';
|
|
35
|
-
|
|
36
|
-
const name = 'foo';
|
|
37
|
-
|
|
38
|
-
const App = () => {
|
|
39
|
-
return <Avatar name={name} />;
|
|
40
|
-
}
|
|
41
|
-
`,
|
|
42
|
-
`
|
|
43
|
-
import Tooltip from '@atlaskit/tooltip';
|
|
44
|
-
import Avatar from '@atlaskit/avatar';
|
|
45
|
-
|
|
46
|
-
const name = 'foo';
|
|
47
|
-
|
|
48
|
-
const App = () => {
|
|
49
|
-
return <Tooltip content={name}><Avatar name={name} /></Tooltip>;
|
|
50
|
-
}
|
|
51
|
-
`,
|
|
52
|
-
'should wrap avatar in a tooltip if name is defined as a variable',
|
|
53
|
-
);
|
|
54
|
-
|
|
55
|
-
defineInlineTest(
|
|
56
|
-
{ ...transformer, parser: 'tsx' },
|
|
57
|
-
{},
|
|
58
|
-
`
|
|
59
|
-
import Avatar from '@atlaskit/avatar';
|
|
60
|
-
|
|
61
|
-
const App = () => {
|
|
62
|
-
return <Avatar name="foo" enableTooltip={true} />;
|
|
63
|
-
}
|
|
64
|
-
`,
|
|
65
|
-
`
|
|
66
|
-
import Tooltip from '@atlaskit/tooltip';
|
|
67
|
-
import Avatar from '@atlaskit/avatar';
|
|
68
|
-
|
|
69
|
-
const App = () => {
|
|
70
|
-
return <Tooltip content="foo"><Avatar name="foo" /></Tooltip>;
|
|
71
|
-
}
|
|
72
|
-
`,
|
|
73
|
-
'should wrap avatar in a tooltip if name and enableTooltip are provided',
|
|
74
|
-
);
|
|
75
|
-
|
|
76
|
-
defineInlineTest(
|
|
77
|
-
{ ...transformer, parser: 'tsx' },
|
|
78
|
-
{},
|
|
79
|
-
`
|
|
80
|
-
import Avatar from '@atlaskit/avatar';
|
|
81
|
-
|
|
82
|
-
const value = true;
|
|
83
|
-
|
|
84
|
-
const App = () => {
|
|
85
|
-
return <Avatar name="foo" enableTooltip={value} />;
|
|
86
|
-
}
|
|
87
|
-
`,
|
|
88
|
-
`
|
|
89
|
-
import Tooltip from '@atlaskit/tooltip';
|
|
90
|
-
import Avatar from '@atlaskit/avatar';
|
|
91
|
-
|
|
92
|
-
const value = true;
|
|
93
|
-
|
|
94
|
-
const App = () => {
|
|
95
|
-
return value ? <Tooltip content="foo"><Avatar name="foo" /></Tooltip> : <Avatar name="foo" />;
|
|
96
|
-
}
|
|
97
|
-
`,
|
|
98
|
-
'should conditionally wrap avatar in toolip if an expression is passed to enableTooltip',
|
|
99
|
-
);
|
|
100
|
-
|
|
101
|
-
defineInlineTest(
|
|
102
|
-
{ ...transformer, parser: 'tsx' },
|
|
103
|
-
{},
|
|
104
|
-
`
|
|
105
|
-
import Avatar from '@atlaskit/avatar';
|
|
106
|
-
|
|
107
|
-
const App = () => {
|
|
108
|
-
return <Avatar name="Foo" enableTooltip={false} />;
|
|
109
|
-
}
|
|
110
|
-
`,
|
|
111
|
-
`
|
|
112
|
-
import Avatar from '@atlaskit/avatar';
|
|
113
|
-
|
|
114
|
-
const App = () => {
|
|
115
|
-
return <Avatar name="Foo" />;
|
|
116
|
-
}
|
|
117
|
-
`,
|
|
118
|
-
'should not wrap avatar in a tooltip if name is defined and enableTooltip is false',
|
|
119
|
-
);
|
|
120
|
-
|
|
121
|
-
defineInlineTest(
|
|
122
|
-
{ ...transformer, parser: 'tsx' },
|
|
123
|
-
{},
|
|
124
|
-
`
|
|
125
|
-
import Avatar from '@atlaskit/avatar';
|
|
126
|
-
|
|
127
|
-
const App = () => {
|
|
128
|
-
return (
|
|
129
|
-
<Avatar
|
|
130
|
-
isHover={true}
|
|
131
|
-
isActive={true}
|
|
132
|
-
isFocus={true}
|
|
133
|
-
isSelected={true}
|
|
134
|
-
theme={{}}
|
|
135
|
-
/>
|
|
136
|
-
)
|
|
137
|
-
}
|
|
138
|
-
`,
|
|
139
|
-
`
|
|
140
|
-
import Avatar from '@atlaskit/avatar';
|
|
141
|
-
|
|
142
|
-
const App = () => {
|
|
143
|
-
return <Avatar />;
|
|
144
|
-
}
|
|
145
|
-
`,
|
|
146
|
-
'should remove all deleted props',
|
|
147
|
-
);
|
|
148
|
-
|
|
149
|
-
defineInlineTest(
|
|
150
|
-
{ ...transformer, parser: 'tsx' },
|
|
151
|
-
{},
|
|
152
|
-
`
|
|
153
|
-
import Foo from '@atlaskit/avatar';
|
|
154
|
-
|
|
155
|
-
const App = () => {
|
|
156
|
-
return (
|
|
157
|
-
<Foo
|
|
158
|
-
isHover={true}
|
|
159
|
-
isActive={true}
|
|
160
|
-
isFocus={true}
|
|
161
|
-
isSelected={true}
|
|
162
|
-
theme={{}}
|
|
163
|
-
/>
|
|
164
|
-
)
|
|
165
|
-
}
|
|
166
|
-
`,
|
|
167
|
-
`
|
|
168
|
-
import Foo from '@atlaskit/avatar';
|
|
169
|
-
|
|
170
|
-
const App = () => {
|
|
171
|
-
return <Foo />;
|
|
172
|
-
}
|
|
173
|
-
`,
|
|
174
|
-
'should remove all deleted props with aliased import name',
|
|
175
|
-
);
|
|
176
|
-
|
|
177
|
-
defineInlineTest(
|
|
178
|
-
{ ...transformer, parser: 'tsx' },
|
|
179
|
-
{},
|
|
180
|
-
`
|
|
181
|
-
import Avatar from '@atlaskit/avatar';
|
|
182
|
-
|
|
183
|
-
const App = () => {
|
|
184
|
-
return (
|
|
185
|
-
<Avatar
|
|
186
|
-
enableTooltip={false}
|
|
187
|
-
/>
|
|
188
|
-
)
|
|
189
|
-
}
|
|
190
|
-
`,
|
|
191
|
-
`
|
|
192
|
-
import Avatar from '@atlaskit/avatar';
|
|
193
|
-
|
|
194
|
-
const App = () => {
|
|
195
|
-
return <Avatar />;
|
|
196
|
-
}
|
|
197
|
-
`,
|
|
198
|
-
'should remove enableTooltip when false',
|
|
199
|
-
);
|
|
200
|
-
|
|
201
|
-
defineInlineTest(
|
|
202
|
-
{ ...transformer, parser: 'tsx' },
|
|
203
|
-
{},
|
|
204
|
-
`
|
|
205
|
-
const App = () => {
|
|
206
|
-
return (
|
|
207
|
-
<Avatar
|
|
208
|
-
isHover={true}
|
|
209
|
-
isActive={true}
|
|
210
|
-
isFocus={true}
|
|
211
|
-
isSelected={true}
|
|
212
|
-
enableTooltip={true}
|
|
213
|
-
/>
|
|
214
|
-
)
|
|
215
|
-
}
|
|
216
|
-
`,
|
|
217
|
-
`
|
|
218
|
-
const App = () => {
|
|
219
|
-
return (
|
|
220
|
-
<Avatar
|
|
221
|
-
isHover={true}
|
|
222
|
-
isActive={true}
|
|
223
|
-
isFocus={true}
|
|
224
|
-
isSelected={true}
|
|
225
|
-
enableTooltip={true}
|
|
226
|
-
/>
|
|
227
|
-
)
|
|
228
|
-
}
|
|
229
|
-
`,
|
|
230
|
-
'should not mutate JSX if import is missing',
|
|
231
|
-
);
|
|
232
|
-
});
|
|
233
|
-
|
|
234
|
-
describe('Update AvatarItem props', () => {
|
|
235
|
-
defineInlineTest(
|
|
236
|
-
{ ...transformer, parser: 'tsx' },
|
|
237
|
-
{},
|
|
238
|
-
`
|
|
239
|
-
import Avatar, { AvatarItem } from '@atlaskit/avatar';
|
|
240
|
-
|
|
241
|
-
const App = () => {
|
|
242
|
-
return (
|
|
243
|
-
<AvatarItem
|
|
244
|
-
isHover={true}
|
|
245
|
-
isActive={true}
|
|
246
|
-
isFocus={true}
|
|
247
|
-
isSelected={true}
|
|
248
|
-
theme={{}}
|
|
249
|
-
/>
|
|
250
|
-
)
|
|
251
|
-
}
|
|
252
|
-
`,
|
|
253
|
-
`
|
|
254
|
-
import Avatar, { AvatarItem } from '@atlaskit/avatar';
|
|
255
|
-
|
|
256
|
-
const App = () => {
|
|
257
|
-
return <AvatarItem />;
|
|
258
|
-
}
|
|
259
|
-
`,
|
|
260
|
-
'should remove all deleted props',
|
|
261
|
-
);
|
|
262
|
-
|
|
263
|
-
defineInlineTest(
|
|
264
|
-
{ ...transformer, parser: 'tsx' },
|
|
265
|
-
{},
|
|
266
|
-
`
|
|
267
|
-
import { AvatarItem as Foo } from '@atlaskit/avatar';
|
|
268
|
-
|
|
269
|
-
const App = () => {
|
|
270
|
-
return (
|
|
271
|
-
<Foo
|
|
272
|
-
isHover={true}
|
|
273
|
-
isActive={true}
|
|
274
|
-
isFocus={true}
|
|
275
|
-
isSelected={true}
|
|
276
|
-
theme={{}}
|
|
277
|
-
/>
|
|
278
|
-
)
|
|
279
|
-
}
|
|
280
|
-
`,
|
|
281
|
-
`
|
|
282
|
-
import { AvatarItem as Foo } from '@atlaskit/avatar';
|
|
283
|
-
|
|
284
|
-
const App = () => {
|
|
285
|
-
return <Foo />;
|
|
286
|
-
}
|
|
287
|
-
`,
|
|
288
|
-
'should remove all deleted props with aliased import',
|
|
289
|
-
);
|
|
290
|
-
|
|
291
|
-
defineInlineTest(
|
|
292
|
-
{ ...transformer, parser: 'tsx' },
|
|
293
|
-
{},
|
|
294
|
-
`
|
|
295
|
-
import { AvatarItem } from '@atlaskit/avatar';
|
|
296
|
-
|
|
297
|
-
const App = () => {
|
|
298
|
-
return (
|
|
299
|
-
<AvatarItem
|
|
300
|
-
enableTextTruncate
|
|
301
|
-
/>
|
|
302
|
-
);
|
|
303
|
-
}
|
|
304
|
-
`,
|
|
305
|
-
`
|
|
306
|
-
import { AvatarItem } from '@atlaskit/avatar';
|
|
307
|
-
|
|
308
|
-
const App = () => {
|
|
309
|
-
return <AvatarItem />;
|
|
310
|
-
}
|
|
311
|
-
`,
|
|
312
|
-
'should remove enableTextTruncate when defaulted to true',
|
|
313
|
-
);
|
|
314
|
-
|
|
315
|
-
defineInlineTest(
|
|
316
|
-
{ ...transformer, parser: 'tsx' },
|
|
317
|
-
{},
|
|
318
|
-
`
|
|
319
|
-
import Avatar, { AvatarItem } from '@atlaskit/avatar';
|
|
320
|
-
|
|
321
|
-
const App = () => {
|
|
322
|
-
return (
|
|
323
|
-
<AvatarItem
|
|
324
|
-
enableTextTruncate={false}
|
|
325
|
-
/>
|
|
326
|
-
)
|
|
327
|
-
}
|
|
328
|
-
`,
|
|
329
|
-
`
|
|
330
|
-
import Avatar, { AvatarItem } from '@atlaskit/avatar';
|
|
331
|
-
|
|
332
|
-
const App = () => {
|
|
333
|
-
return (
|
|
334
|
-
<AvatarItem
|
|
335
|
-
isTruncationDisabled
|
|
336
|
-
/>
|
|
337
|
-
);
|
|
338
|
-
}
|
|
339
|
-
`,
|
|
340
|
-
'should rename isTruncationDisabled when false',
|
|
341
|
-
);
|
|
342
|
-
|
|
343
|
-
defineInlineTest(
|
|
344
|
-
{ ...transformer, parser: 'tsx' },
|
|
345
|
-
{},
|
|
346
|
-
`
|
|
347
|
-
import Avatar, { AvatarItem } from '@atlaskit/avatar';
|
|
348
|
-
|
|
349
|
-
const value = true;
|
|
350
|
-
|
|
351
|
-
const App = () => {
|
|
352
|
-
return (
|
|
353
|
-
<AvatarItem
|
|
354
|
-
enableTextTruncate={value}
|
|
355
|
-
/>
|
|
356
|
-
);
|
|
357
|
-
}
|
|
358
|
-
`,
|
|
359
|
-
`
|
|
360
|
-
import Avatar, { AvatarItem } from '@atlaskit/avatar';
|
|
361
|
-
|
|
362
|
-
const value = true;
|
|
363
|
-
|
|
364
|
-
const App = () => {
|
|
365
|
-
return (
|
|
366
|
-
<AvatarItem
|
|
367
|
-
isTruncationDisabled={!value}
|
|
368
|
-
/>
|
|
369
|
-
);
|
|
370
|
-
}
|
|
371
|
-
`,
|
|
372
|
-
'should rename isTruncationDisabled and negate non-boolean values',
|
|
373
|
-
);
|
|
374
|
-
|
|
375
|
-
defineInlineTest(
|
|
376
|
-
{ ...transformer, parser: 'tsx' },
|
|
377
|
-
{},
|
|
378
|
-
`
|
|
379
|
-
import Avatar, { AvatarItem } from '@atlaskit/avatar';
|
|
380
|
-
|
|
381
|
-
const foo = 'foo';
|
|
382
|
-
const bar = 'bar';
|
|
383
|
-
|
|
384
|
-
const App = () => {
|
|
385
|
-
return (
|
|
386
|
-
<AvatarItem
|
|
387
|
-
enableTextTruncate={foo && bar}
|
|
388
|
-
/>
|
|
389
|
-
);
|
|
390
|
-
}
|
|
391
|
-
`,
|
|
392
|
-
`
|
|
393
|
-
import Avatar, { AvatarItem } from '@atlaskit/avatar';
|
|
394
|
-
|
|
395
|
-
const foo = 'foo';
|
|
396
|
-
const bar = 'bar';
|
|
397
|
-
|
|
398
|
-
const App = () => {
|
|
399
|
-
return (
|
|
400
|
-
<AvatarItem
|
|
401
|
-
isTruncationDisabled={!(foo && bar)}
|
|
402
|
-
/>
|
|
403
|
-
);
|
|
404
|
-
}
|
|
405
|
-
`,
|
|
406
|
-
'should rename isTruncationDisabled and negate non-boolean values',
|
|
407
|
-
);
|
|
408
|
-
|
|
409
|
-
defineInlineTest(
|
|
410
|
-
{ ...transformer, parser: 'tsx' },
|
|
411
|
-
{},
|
|
412
|
-
`
|
|
413
|
-
import Avatar, { AvatarItem } from '@atlaskit/avatar';
|
|
414
|
-
|
|
415
|
-
const App = () => {
|
|
416
|
-
return (
|
|
417
|
-
<AvatarItem
|
|
418
|
-
enableTextTruncate={true}
|
|
419
|
-
/>
|
|
420
|
-
)
|
|
421
|
-
}
|
|
422
|
-
`,
|
|
423
|
-
`
|
|
424
|
-
import Avatar, { AvatarItem } from '@atlaskit/avatar';
|
|
425
|
-
|
|
426
|
-
const App = () => {
|
|
427
|
-
return <AvatarItem />;
|
|
428
|
-
}
|
|
429
|
-
`,
|
|
430
|
-
'should remove isTruncationDisabled when true',
|
|
431
|
-
);
|
|
432
|
-
|
|
433
|
-
defineInlineTest(
|
|
434
|
-
{ ...transformer, parser: 'tsx' },
|
|
435
|
-
{},
|
|
436
|
-
`
|
|
437
|
-
const App = () => {
|
|
438
|
-
return (
|
|
439
|
-
<AvatarItem
|
|
440
|
-
isHover={true}
|
|
441
|
-
isActive={true}
|
|
442
|
-
isFocus={true}
|
|
443
|
-
isSelected={true}
|
|
444
|
-
enableTextTruncate={true}
|
|
445
|
-
/>
|
|
446
|
-
)
|
|
447
|
-
}
|
|
448
|
-
`,
|
|
449
|
-
`
|
|
450
|
-
const App = () => {
|
|
451
|
-
return (
|
|
452
|
-
<AvatarItem
|
|
453
|
-
isHover={true}
|
|
454
|
-
isActive={true}
|
|
455
|
-
isFocus={true}
|
|
456
|
-
isSelected={true}
|
|
457
|
-
enableTextTruncate={true}
|
|
458
|
-
/>
|
|
459
|
-
)
|
|
460
|
-
}
|
|
461
|
-
`,
|
|
462
|
-
'should not mutate JSX if import is missing',
|
|
463
|
-
);
|
|
464
|
-
});
|
|
465
|
-
|
|
466
|
-
describe('Update BORDER_WIDTH usage', () => {
|
|
467
|
-
defineInlineTest(
|
|
468
|
-
{ ...transformer, parser: 'tsx' },
|
|
469
|
-
{},
|
|
470
|
-
`
|
|
471
|
-
import { BORDER_WIDTH } from '@atlaskit/avatar';
|
|
472
|
-
|
|
473
|
-
var borderWidth = BORDER_WIDTH['foo'];
|
|
474
|
-
`,
|
|
475
|
-
`
|
|
476
|
-
import { BORDER_WIDTH } from '@atlaskit/avatar';
|
|
477
|
-
|
|
478
|
-
var borderWidth = BORDER_WIDTH;
|
|
479
|
-
`,
|
|
480
|
-
'should update square bracket notation usages',
|
|
481
|
-
);
|
|
482
|
-
|
|
483
|
-
defineInlineTest(
|
|
484
|
-
{ ...transformer, parser: 'tsx' },
|
|
485
|
-
{},
|
|
486
|
-
`
|
|
487
|
-
import { BORDER_WIDTH } from '@atlaskit/avatar';
|
|
488
|
-
|
|
489
|
-
var borderWidth = BORDER_WIDTH.medium;
|
|
490
|
-
`,
|
|
491
|
-
`
|
|
492
|
-
import { BORDER_WIDTH } from '@atlaskit/avatar';
|
|
493
|
-
|
|
494
|
-
var borderWidth = BORDER_WIDTH;
|
|
495
|
-
`,
|
|
496
|
-
'should update dot notation usages',
|
|
497
|
-
);
|
|
498
|
-
|
|
499
|
-
defineInlineTest(
|
|
500
|
-
{ ...transformer, parser: 'tsx' },
|
|
501
|
-
{},
|
|
502
|
-
`
|
|
503
|
-
import Avatar, { BORDER_WIDTH, AvatarItem } from '@atlaskit/avatar';
|
|
504
|
-
|
|
505
|
-
var borderWidth = BORDER_WIDTH['foo'];
|
|
506
|
-
`,
|
|
507
|
-
`
|
|
508
|
-
import Avatar, { BORDER_WIDTH, AvatarItem } from '@atlaskit/avatar';
|
|
509
|
-
|
|
510
|
-
var borderWidth = BORDER_WIDTH;
|
|
511
|
-
`,
|
|
512
|
-
'should update usages with multiple imports',
|
|
513
|
-
);
|
|
514
|
-
});
|
|
@@ -1,118 +0,0 @@
|
|
|
1
|
-
// eslint-disable-next-line @repo/internal/fs/filename-pattern-match
|
|
2
|
-
jest.autoMockOff();
|
|
3
|
-
|
|
4
|
-
import * as transformer from '../19.0.0-render-props';
|
|
5
|
-
|
|
6
|
-
const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
|
|
7
|
-
|
|
8
|
-
describe('Update Avatar to use render props', () => {
|
|
9
|
-
defineInlineTest(
|
|
10
|
-
{ ...transformer, parser: 'tsx' },
|
|
11
|
-
{},
|
|
12
|
-
`
|
|
13
|
-
import Avatar from '@atlaskit/avatar';
|
|
14
|
-
|
|
15
|
-
const App = () => {
|
|
16
|
-
return <Avatar name="MCB" component={CustomAvatar} />;
|
|
17
|
-
}
|
|
18
|
-
`,
|
|
19
|
-
`
|
|
20
|
-
import Avatar from '@atlaskit/avatar';
|
|
21
|
-
|
|
22
|
-
const App = () => {
|
|
23
|
-
return (
|
|
24
|
-
<Avatar name="MCB">{(
|
|
25
|
-
{
|
|
26
|
-
ref: _,
|
|
27
|
-
...props
|
|
28
|
-
}
|
|
29
|
-
) => <CustomAvatar {...props} />}</Avatar>
|
|
30
|
-
);
|
|
31
|
-
}
|
|
32
|
-
`,
|
|
33
|
-
'should wrap custom component in render prop',
|
|
34
|
-
);
|
|
35
|
-
|
|
36
|
-
defineInlineTest(
|
|
37
|
-
{ ...transformer, parser: 'tsx' },
|
|
38
|
-
{},
|
|
39
|
-
`
|
|
40
|
-
import Foo from '@atlaskit/avatar';
|
|
41
|
-
|
|
42
|
-
const App = () => {
|
|
43
|
-
return <Foo component={CustomAvatarItem} />;
|
|
44
|
-
}
|
|
45
|
-
`,
|
|
46
|
-
`
|
|
47
|
-
import Foo from '@atlaskit/avatar';
|
|
48
|
-
|
|
49
|
-
const App = () => {
|
|
50
|
-
return (
|
|
51
|
-
<Foo>{(
|
|
52
|
-
{
|
|
53
|
-
ref: _,
|
|
54
|
-
...props
|
|
55
|
-
}
|
|
56
|
-
) => <CustomAvatarItem {...props} />}</Foo>
|
|
57
|
-
);
|
|
58
|
-
}
|
|
59
|
-
`,
|
|
60
|
-
'should convert aliased Avatar component prop to render prop',
|
|
61
|
-
);
|
|
62
|
-
});
|
|
63
|
-
|
|
64
|
-
describe('Update AvatarItem to use render props', () => {
|
|
65
|
-
defineInlineTest(
|
|
66
|
-
{ ...transformer, parser: 'tsx' },
|
|
67
|
-
{},
|
|
68
|
-
`
|
|
69
|
-
import { AvatarItem } from '@atlaskit/avatar';
|
|
70
|
-
|
|
71
|
-
const App = () => {
|
|
72
|
-
return <AvatarItem component={CustomAvatarItem} />;
|
|
73
|
-
}
|
|
74
|
-
`,
|
|
75
|
-
`
|
|
76
|
-
import { AvatarItem } from '@atlaskit/avatar';
|
|
77
|
-
|
|
78
|
-
const App = () => {
|
|
79
|
-
return (
|
|
80
|
-
<AvatarItem>{(
|
|
81
|
-
{
|
|
82
|
-
ref: _,
|
|
83
|
-
...props
|
|
84
|
-
}
|
|
85
|
-
) => <CustomAvatarItem {...props} />}</AvatarItem>
|
|
86
|
-
);
|
|
87
|
-
}
|
|
88
|
-
`,
|
|
89
|
-
'should wrap custom component in render prop',
|
|
90
|
-
);
|
|
91
|
-
|
|
92
|
-
defineInlineTest(
|
|
93
|
-
{ ...transformer, parser: 'tsx' },
|
|
94
|
-
{},
|
|
95
|
-
`
|
|
96
|
-
import { AvatarItem as Foo } from '@atlaskit/avatar';
|
|
97
|
-
|
|
98
|
-
const App = () => {
|
|
99
|
-
return <Foo component={CustomAvatarItem} />;
|
|
100
|
-
}
|
|
101
|
-
`,
|
|
102
|
-
`
|
|
103
|
-
import { AvatarItem as Foo } from '@atlaskit/avatar';
|
|
104
|
-
|
|
105
|
-
const App = () => {
|
|
106
|
-
return (
|
|
107
|
-
<Foo>{(
|
|
108
|
-
{
|
|
109
|
-
ref: _,
|
|
110
|
-
...props
|
|
111
|
-
}
|
|
112
|
-
) => <CustomAvatarItem {...props} />}</Foo>
|
|
113
|
-
);
|
|
114
|
-
}
|
|
115
|
-
`,
|
|
116
|
-
'should convert aliased AvatarItem component prop to render prop',
|
|
117
|
-
);
|
|
118
|
-
});
|