@atlaskit/logo 15.2.1 → 15.3.1
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 +23 -0
- package/dist/cjs/atlassian-analytics-logo/icon.js +18 -3
- package/dist/cjs/atlassian-analytics-logo/logo.js +25 -5
- package/dist/cjs/wrapper.js +1 -1
- package/dist/es2019/atlassian-analytics-logo/icon.js +16 -3
- package/dist/es2019/atlassian-analytics-logo/logo.js +23 -5
- package/dist/es2019/wrapper.js +1 -1
- package/dist/esm/atlassian-analytics-logo/icon.js +18 -3
- package/dist/esm/atlassian-analytics-logo/logo.js +25 -5
- package/dist/esm/wrapper.js +1 -1
- package/dist/types/atlassian-analytics-logo/icon.d.ts +2 -2
- package/dist/types/atlassian-analytics-logo/logo.d.ts +2 -2
- package/dist/types/types.d.ts +2 -2
- package/dist/types-ts4.5/atlassian-analytics-logo/icon.d.ts +2 -2
- package/dist/types-ts4.5/atlassian-analytics-logo/logo.d.ts +2 -2
- package/dist/types-ts4.5/types.d.ts +2 -2
- package/package.json +12 -3
- package/codemods/13.6.0-rename-imports.tsx +0 -80
- package/codemods/__tests__/13.6.0-rename-imports.test.tsx +0 -233
- package/codemods/utils.tsx +0 -26
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,28 @@
|
|
|
1
1
|
# @atlaskit/logo
|
|
2
2
|
|
|
3
|
+
## 15.3.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Updated dependencies
|
|
8
|
+
|
|
9
|
+
## 15.3.0
|
|
10
|
+
|
|
11
|
+
### Minor Changes
|
|
12
|
+
|
|
13
|
+
- [#115211](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/115211)
|
|
14
|
+
[`3ef7f182f166b`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/3ef7f182f166b) -
|
|
15
|
+
[ux] Updated Atlassian Analytics logo and icon to support `iconColor` and `textColor` to align
|
|
16
|
+
with others.
|
|
17
|
+
|
|
18
|
+
## 15.2.2
|
|
19
|
+
|
|
20
|
+
### Patch Changes
|
|
21
|
+
|
|
22
|
+
- [#112549](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/112549)
|
|
23
|
+
[`ed68a8d2ee5f7`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/ed68a8d2ee5f7) -
|
|
24
|
+
Update dependencies and remove unused exports and codemods.
|
|
25
|
+
|
|
3
26
|
## 15.2.1
|
|
4
27
|
|
|
5
28
|
### Patch Changes
|
|
@@ -14,8 +14,16 @@ var _wrapper = _interopRequireDefault(require("../wrapper"));
|
|
|
14
14
|
/* eslint-disable max-len */
|
|
15
15
|
|
|
16
16
|
var svg = function svg(_ref, colorMode, id) {
|
|
17
|
-
var appearance = _ref.appearance
|
|
18
|
-
|
|
17
|
+
var appearance = _ref.appearance,
|
|
18
|
+
iconColor = _ref.iconColor;
|
|
19
|
+
var colors = {
|
|
20
|
+
iconGradientStart: iconColor,
|
|
21
|
+
iconGradientStop: iconColor,
|
|
22
|
+
iconColor: iconColor
|
|
23
|
+
};
|
|
24
|
+
if (appearance) {
|
|
25
|
+
colors = (0, _utils.getColorsFromAppearanceOldLogos)(appearance, colorMode);
|
|
26
|
+
}
|
|
19
27
|
return "<svg height=\"32\" viewBox=\"0 0 48 48\" xmlns=\"http://www.w3.org/2000/svg\">\n <defs>\n <linearGradient id=\"".concat(id, "-a\" x1=\"12.595\" x2=\"12.595\" y1=\"40\" y2=\"30\" gradientUnits=\"userSpaceOnUse\">\n <stop offset=\"0\" stop-color=\"").concat(colors.iconGradientStart, "\"/>\n <stop offset=\"1\" stop-color=\"").concat(colors.iconGradientStop, "\"/>\n </linearGradient>\n <linearGradient id=\"").concat(id, "-b\" x1=\"28.595\" x2=\"28.595\" y1=\"40\" y2=\"27\" gradientUnits=\"userSpaceOnUse\">\n <stop offset=\"0\" stop-color=\"").concat(colors.iconGradientStart, "\"/>\n <stop offset=\"1\" stop-color=\"").concat(colors.iconGradientStop, "\"/>\n </linearGradient>\n <linearGradient xlink:href=\"#").concat(id, "-b\" id=\"").concat(id, "-c\" x1=\"20.595\" x2=\"20.595\" y2=\"22\"/>\n <linearGradient xlink:href=\"#").concat(id, "-b\" id=\"").concat(id, "-d\" x1=\"36.595\" x2=\"36.595\" y2=\"20\"/>\n </defs>\n <path d=\"M10.595 30h4v10h-4z\" fill=\"url(#").concat(id, "-a)\"/>\n <path d=\"M26.595 27h4v13h-4z\" fill=\"url(#").concat(id, "-b)\"/>\n <path d=\"M18.595 22h4v18h-4z\" fill=\"url(#").concat(id, "-c)\"/>\n <path d=\"M34.595 20h4v20h-4z\" fill=\"url(#").concat(id, "-d)\"/>\n <path fill=\"").concat(colors.iconColor, "\" d=\"m9.009 25.414-2.828-2.828 10.127-10.128a5 5 0 0 1 6.605-.411l4.471 3.477a1.5 1.5 0 0 0 1.982-.123l9.815-9.815 2.828 2.828-10.127 10.128a5 5 0 0 1-6.605.411l-4.471-3.477a1.5 1.5 0 0 0-1.982.123l-9.815 9.815Z\" />\n</svg>");
|
|
20
28
|
};
|
|
21
29
|
|
|
@@ -34,6 +42,10 @@ var AtlassianAnalyticsIcon = exports.AtlassianAnalyticsIcon = function Atlassian
|
|
|
34
42
|
label = _ref2$label === void 0 ? 'Atlassian Analytics' : _ref2$label,
|
|
35
43
|
_ref2$size = _ref2.size,
|
|
36
44
|
size = _ref2$size === void 0 ? _constants.defaultLogoParams.size : _ref2$size,
|
|
45
|
+
_ref2$iconColor = _ref2.iconColor,
|
|
46
|
+
iconColor = _ref2$iconColor === void 0 ? _constants.defaultLogoParams.iconColor : _ref2$iconColor,
|
|
47
|
+
_ref2$textColor = _ref2.textColor,
|
|
48
|
+
textColor = _ref2$textColor === void 0 ? _constants.defaultLogoParams.textColor : _ref2$textColor,
|
|
37
49
|
testId = _ref2.testId;
|
|
38
50
|
var _useThemeObserver = (0, _tokens.useThemeObserver)(),
|
|
39
51
|
colorMode = _useThemeObserver.colorMode;
|
|
@@ -42,8 +54,11 @@ var AtlassianAnalyticsIcon = exports.AtlassianAnalyticsIcon = function Atlassian
|
|
|
42
54
|
appearance: appearance,
|
|
43
55
|
label: label,
|
|
44
56
|
svg: svg({
|
|
45
|
-
appearance: appearance
|
|
57
|
+
appearance: appearance,
|
|
58
|
+
iconColor: iconColor
|
|
46
59
|
}, colorMode, id),
|
|
60
|
+
iconColor: iconColor,
|
|
61
|
+
textColor: textColor,
|
|
47
62
|
size: size,
|
|
48
63
|
testId: testId
|
|
49
64
|
});
|
|
@@ -14,8 +14,20 @@ var _wrapper = _interopRequireDefault(require("../wrapper"));
|
|
|
14
14
|
/* eslint-disable max-len */
|
|
15
15
|
|
|
16
16
|
var svg = function svg(_ref, colorMode, id) {
|
|
17
|
-
var appearance = _ref.appearance
|
|
18
|
-
|
|
17
|
+
var appearance = _ref.appearance,
|
|
18
|
+
iconColor = _ref.iconColor,
|
|
19
|
+
textColor = _ref.textColor;
|
|
20
|
+
var colors = {
|
|
21
|
+
iconGradientStart: iconColor,
|
|
22
|
+
iconGradientStop: iconColor,
|
|
23
|
+
textColor: textColor,
|
|
24
|
+
iconColor: iconColor,
|
|
25
|
+
// We treat the word "Atlassian" differently to normal product logos, it has a bold brand look
|
|
26
|
+
atlassianLogoTextColor: textColor
|
|
27
|
+
};
|
|
28
|
+
if (appearance) {
|
|
29
|
+
colors = (0, _utils.getColorsFromAppearanceOldLogos)(appearance, colorMode);
|
|
30
|
+
}
|
|
19
31
|
return "\n <svg height=\"32\" viewBox=\"0 0 477 48\" xmlns=\"http://www.w3.org/2000/svg\">\n <defs>\n <linearGradient id=\"".concat(id, "-a\" x1=\"447.285\" x2=\"447.285\" y1=\"40\" y2=\"30\" gradientUnits=\"userSpaceOnUse\">\n <stop offset=\"0\" stop-color=\"").concat(colors.iconGradientStart, "\"/>\n <stop offset=\"1\" stop-color=\"").concat(colors.iconGradientStop, "\"/>\n </linearGradient>\n <linearGradient xlink:href=\"#").concat(id, "-a\" id=\"").concat(id, "-b\" x1=\"463.285\" x2=\"463.285\" y2=\"27\"/>\n <linearGradient xlink:href=\"#").concat(id, "-a\" id=\"").concat(id, "-c\" x1=\"455.285\" x2=\"455.285\" y2=\"22\"/>\n <linearGradient xlink:href=\"#").concat(id, "-a\" id=\"").concat(id, "-d\" x1=\"471.285\" x2=\"471.285\" y2=\"20\"/>\n </defs>\n <g fill=\"").concat(colors.atlassianLogoTextColor, "\">\n <path d=\"M106.72 18.359c0 4.201 1.949 7.536 9.572 9.008 4.548.953 5.5 1.689 5.5 3.205 0 1.473-.953 2.425-4.158 2.425-3.725 0-8.142-1.256-11.044-2.988v6.843c2.295 1.126 5.327 2.382 10.957 2.382 7.969 0 11.131-3.551 11.131-8.835m0 0c0-4.981-2.642-7.319-10.091-8.922-4.114-.91-5.111-1.819-5.111-3.118 0-1.646 1.473-2.339 4.201-2.339 3.292 0 6.54.996 9.615 2.382v-6.54c-2.166-1.083-5.5-1.949-9.398-1.949-7.363 0-11.174 3.205-11.174 8.445M209.1 10.346v28.455h6.063V17.103l2.556 5.76 8.575 15.938h7.623V10.346h-6.064V28.71l-2.295-5.327-6.886-13.037H209.1zM163.909 10.346h6.626v28.455h-6.626zM156.263 30.399c0-4.981-2.642-7.319-10.091-8.922-4.114-.91-5.111-1.819-5.111-3.118 0-1.646 1.473-2.339 4.201-2.339 3.292 0 6.54.996 9.615 2.382v-6.54c-2.166-1.083-5.5-1.949-9.398-1.949-7.363 0-11.174 3.205-11.174 8.445 0 4.201 1.949 7.536 9.572 9.008 4.548.953 5.5 1.689 5.5 3.205 0 1.473-.953 2.425-4.158 2.425-3.725 0-8.142-1.256-11.044-2.988v6.843c2.295 1.126 5.327 2.382 10.957 2.382 7.969 0 11.131-3.551 11.131-8.835M55.243 10.346v28.455h13.62l2.145-6.15h-9.095V10.346h-6.67zM28.334 10.346v6.15h7.363v22.305h6.67V16.496h7.882v-6.15H28.334zM18.663 10.346h-8.74L0 38.801h7.579l1.407-4.792a18.852 18.852 0 0 0 10.612 0l1.407 4.792h7.579l-9.922-28.455Zm-4.37 18.533c-1.267 0-2.49-.185-3.647-.524l3.647-12.422 3.647 12.422c-1.157.339-2.38.524-3.647.524ZM92.344 10.346h-8.74l-9.922 28.455h7.579l1.407-4.792a18.852 18.852 0 0 0 10.612 0l1.407 4.792h7.579l-9.922-28.455Zm-4.37 18.533c-1.267 0-2.49-.185-3.647-.524l3.647-12.422 3.647 12.422c-1.157.339-2.38.524-3.647.524ZM194.414 10.346h-8.74l-9.922 28.455h7.579l1.407-4.792a18.852 18.852 0 0 0 10.612 0l1.407 4.792h7.579l-9.922-28.455Zm-4.37 18.533c-1.267 0-2.49-.185-3.647-.524l3.647-12.422 3.647 12.422c-1.157.339-2.38.524-3.647.524Z\"/>\n </g>\n <g fill=\"").concat(colors.textColor, "\">\n <path d=\"m254.776 31.987-2.53 6.809H247.6l11.916-30.225h5.244l11.916 30.225h-4.646l-2.53-6.855c-2.714.552-5.061.828-7.499.828-2.3 0-4.646-.276-7.223-.782Zm13.479-3.496-6.119-16.562-6.119 16.608c2.254.368 4.141.552 5.98.552 1.933 0 3.911-.23 6.257-.598ZM298.984 38.796h-3.957V24.902c0-4.141-1.656-5.981-5.428-5.981-3.681 0-6.211 2.438-6.211 7.085v12.79h-3.957V15.794h3.957v3.772c1.472-2.715 4.187-4.232 7.269-4.232 5.291 0 8.327 3.634 8.327 9.983v13.479ZM320.097 34.656c-1.472 3.036-4.232 4.6-7.775 4.6-6.119 0-9.201-5.199-9.201-11.961 0-6.486 3.22-11.961 9.661-11.961 3.358 0 5.935 1.518 7.314 4.508v-4.048h3.957v23.002h-3.957v-4.14Zm-6.717.92c3.542 0 6.717-2.254 6.717-7.361v-1.84c0-5.106-2.898-7.361-6.256-7.361-4.463 0-6.763 2.944-6.763 8.281 0 5.521 2.208 8.281 6.303 8.281ZM336.196 38.935c-3.772 0-6.165-1.794-6.165-6.027V6.179h3.957v26.269c0 2.07 1.38 2.806 3.083 2.806.414 0 .69 0 1.15-.046v3.542c-.322.092-1.012.184-2.024.184ZM347.328 37.324l-8.327-21.53h4.232l7.361 19.69 7.361-19.69h4.232l-8.695 22.267c-2.576 6.579-4.048 9.983-9.891 9.983-1.979 0-3.083-.184-4.232-.644v-3.404c1.334.414 2.852.552 4.002.552 3.22 0 4.646-2.208 6.533-7.223h-2.576ZM374.698 35.07c.92 0 1.794-.185 2.484-.322v3.818c-.69.184-1.472.368-2.668.368-4.923 0-7.315-2.898-7.315-7.177V19.473h-3.727v-3.68h3.727v-4.877h3.864v4.877h6.119v3.68h-6.119v12.191c0 2.024 1.196 3.405 3.635 3.405ZM384.265 6.961c1.61 0 2.76 1.012 2.76 2.76s-1.15 2.76-2.76 2.76-2.76-1.012-2.76-2.76 1.15-2.76 2.76-2.76Zm-2.024 8.833h3.957v23.002h-3.957V15.794ZM408.416 38.198c-1.38.736-3.496 1.058-5.612 1.058-8.189 0-12.007-4.968-12.007-12.007 0-6.947 3.818-11.915 12.007-11.915 2.07 0 3.68.276 5.475 1.104v3.681c-1.472-.69-3.037-1.104-5.199-1.104-5.98 0-8.419 3.772-8.419 8.235s2.484 8.235 8.511 8.235c2.346 0 3.818-.322 5.244-.828v3.542ZM420.144 39.256c-3.451 0-6.257-.782-8.005-1.702v-4.187c1.978 1.15 5.291 2.254 8.188 2.254 3.037 0 4.601-1.242 4.601-3.036 0-1.749-1.334-2.761-5.705-3.818-5.106-1.242-7.269-3.221-7.269-6.993 0-4.002 3.082-6.44 8.327-6.44 2.99 0 5.705.736 7.407 1.656v4.094c-2.76-1.38-5.014-2.117-7.453-2.117-2.898 0-4.462 1.013-4.462 2.807 0 1.61 1.104 2.622 5.336 3.635 5.106 1.242 7.683 3.128 7.683 7.13 0 3.819-2.484 6.717-8.649 6.717Z\"/>\n </g>\n <path fill=\"url(#").concat(id, "-a)\" d=\"M445.285 30h4v10h-4z\"/>\n <path fill=\"url(#").concat(id, "-b)\" d=\"M461.285 27h4v13h-4z\"/>\n <path fill=\"url(#").concat(id, "-c)\" d=\"M453.285 22h4v18h-4z\"/>\n <path fill=\"url(#").concat(id, "-d)\" d=\"M469.285 20h4v20h-4z\"/>\n <path fill=\"").concat(colors.iconColor, "\" d=\"m443.699 25.414-2.828-2.828 10.127-10.128a5 5 0 0 1 6.605-.411l4.471 3.477a1.5 1.5 0 0 0 1.982-.123l9.815-9.815 2.828 2.828-10.127 10.128a5 5 0 0 1-6.605.411l-4.471-3.477a1.5 1.5 0 0 0-1.982.123l-9.815 9.815Z\"/>\n</svg>");
|
|
20
32
|
};
|
|
21
33
|
|
|
@@ -34,7 +46,11 @@ var AtlassianAnalyticsLogo = exports.AtlassianAnalyticsLogo = function Atlassian
|
|
|
34
46
|
label = _ref2$label === void 0 ? 'Atlassian Analytics' : _ref2$label,
|
|
35
47
|
_ref2$size = _ref2.size,
|
|
36
48
|
size = _ref2$size === void 0 ? _constants.defaultLogoParams.size : _ref2$size,
|
|
37
|
-
testId = _ref2.testId
|
|
49
|
+
testId = _ref2.testId,
|
|
50
|
+
_ref2$iconColor = _ref2.iconColor,
|
|
51
|
+
iconColor = _ref2$iconColor === void 0 ? _constants.defaultLogoParams.iconColor : _ref2$iconColor,
|
|
52
|
+
_ref2$textColor = _ref2.textColor,
|
|
53
|
+
textColor = _ref2$textColor === void 0 ? _constants.defaultLogoParams.textColor : _ref2$textColor;
|
|
38
54
|
var _useThemeObserver = (0, _tokens.useThemeObserver)(),
|
|
39
55
|
colorMode = _useThemeObserver.colorMode;
|
|
40
56
|
var id = (0, _useId.useId)();
|
|
@@ -42,9 +58,13 @@ var AtlassianAnalyticsLogo = exports.AtlassianAnalyticsLogo = function Atlassian
|
|
|
42
58
|
appearance: appearance,
|
|
43
59
|
label: label,
|
|
44
60
|
size: size,
|
|
61
|
+
iconColor: iconColor,
|
|
45
62
|
svg: svg({
|
|
46
|
-
appearance: appearance
|
|
63
|
+
appearance: appearance,
|
|
64
|
+
iconColor: iconColor,
|
|
65
|
+
textColor: textColor
|
|
47
66
|
}, colorMode, id),
|
|
48
|
-
testId: testId
|
|
67
|
+
testId: testId,
|
|
68
|
+
textColor: textColor
|
|
49
69
|
});
|
|
50
70
|
};
|
package/dist/cjs/wrapper.js
CHANGED
|
@@ -6,9 +6,17 @@ import { defaultLogoParams } from '../constants';
|
|
|
6
6
|
import { getColorsFromAppearanceOldLogos } from '../utils';
|
|
7
7
|
import Wrapper from '../wrapper';
|
|
8
8
|
const svg = ({
|
|
9
|
-
appearance
|
|
9
|
+
appearance,
|
|
10
|
+
iconColor
|
|
10
11
|
}, colorMode, id) => {
|
|
11
|
-
|
|
12
|
+
let colors = {
|
|
13
|
+
iconGradientStart: iconColor,
|
|
14
|
+
iconGradientStop: iconColor,
|
|
15
|
+
iconColor
|
|
16
|
+
};
|
|
17
|
+
if (appearance) {
|
|
18
|
+
colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
|
|
19
|
+
}
|
|
12
20
|
return `<svg height="32" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
|
|
13
21
|
<defs>
|
|
14
22
|
<linearGradient id="${id}-a" x1="12.595" x2="12.595" y1="40" y2="30" gradientUnits="userSpaceOnUse">
|
|
@@ -43,6 +51,8 @@ export const AtlassianAnalyticsIcon = ({
|
|
|
43
51
|
appearance,
|
|
44
52
|
label = 'Atlassian Analytics',
|
|
45
53
|
size = defaultLogoParams.size,
|
|
54
|
+
iconColor = defaultLogoParams.iconColor,
|
|
55
|
+
textColor = defaultLogoParams.textColor,
|
|
46
56
|
testId
|
|
47
57
|
}) => {
|
|
48
58
|
const {
|
|
@@ -53,8 +63,11 @@ export const AtlassianAnalyticsIcon = ({
|
|
|
53
63
|
appearance: appearance,
|
|
54
64
|
label: label,
|
|
55
65
|
svg: svg({
|
|
56
|
-
appearance
|
|
66
|
+
appearance,
|
|
67
|
+
iconColor
|
|
57
68
|
}, colorMode, id),
|
|
69
|
+
iconColor: iconColor,
|
|
70
|
+
textColor: textColor,
|
|
58
71
|
size: size,
|
|
59
72
|
testId: testId
|
|
60
73
|
});
|
|
@@ -6,9 +6,21 @@ import { defaultLogoParams } from '../constants';
|
|
|
6
6
|
import { getColorsFromAppearanceOldLogos } from '../utils';
|
|
7
7
|
import Wrapper from '../wrapper';
|
|
8
8
|
const svg = ({
|
|
9
|
-
appearance
|
|
9
|
+
appearance,
|
|
10
|
+
iconColor,
|
|
11
|
+
textColor
|
|
10
12
|
}, colorMode, id) => {
|
|
11
|
-
|
|
13
|
+
let colors = {
|
|
14
|
+
iconGradientStart: iconColor,
|
|
15
|
+
iconGradientStop: iconColor,
|
|
16
|
+
textColor,
|
|
17
|
+
iconColor,
|
|
18
|
+
// We treat the word "Atlassian" differently to normal product logos, it has a bold brand look
|
|
19
|
+
atlassianLogoTextColor: textColor
|
|
20
|
+
};
|
|
21
|
+
if (appearance) {
|
|
22
|
+
colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
|
|
23
|
+
}
|
|
12
24
|
return `
|
|
13
25
|
<svg height="32" viewBox="0 0 477 48" xmlns="http://www.w3.org/2000/svg">
|
|
14
26
|
<defs>
|
|
@@ -47,7 +59,9 @@ export const AtlassianAnalyticsLogo = ({
|
|
|
47
59
|
appearance,
|
|
48
60
|
label = 'Atlassian Analytics',
|
|
49
61
|
size = defaultLogoParams.size,
|
|
50
|
-
testId
|
|
62
|
+
testId,
|
|
63
|
+
iconColor = defaultLogoParams.iconColor,
|
|
64
|
+
textColor = defaultLogoParams.textColor
|
|
51
65
|
}) => {
|
|
52
66
|
const {
|
|
53
67
|
colorMode
|
|
@@ -57,9 +71,13 @@ export const AtlassianAnalyticsLogo = ({
|
|
|
57
71
|
appearance: appearance,
|
|
58
72
|
label: label,
|
|
59
73
|
size: size,
|
|
74
|
+
iconColor: iconColor,
|
|
60
75
|
svg: svg({
|
|
61
|
-
appearance
|
|
76
|
+
appearance,
|
|
77
|
+
iconColor,
|
|
78
|
+
textColor
|
|
62
79
|
}, colorMode, id),
|
|
63
|
-
testId: testId
|
|
80
|
+
testId: testId,
|
|
81
|
+
textColor: textColor
|
|
64
82
|
});
|
|
65
83
|
};
|
package/dist/es2019/wrapper.js
CHANGED
|
@@ -6,8 +6,16 @@ import { defaultLogoParams } from '../constants';
|
|
|
6
6
|
import { getColorsFromAppearanceOldLogos } from '../utils';
|
|
7
7
|
import Wrapper from '../wrapper';
|
|
8
8
|
var svg = function svg(_ref, colorMode, id) {
|
|
9
|
-
var appearance = _ref.appearance
|
|
10
|
-
|
|
9
|
+
var appearance = _ref.appearance,
|
|
10
|
+
iconColor = _ref.iconColor;
|
|
11
|
+
var colors = {
|
|
12
|
+
iconGradientStart: iconColor,
|
|
13
|
+
iconGradientStop: iconColor,
|
|
14
|
+
iconColor: iconColor
|
|
15
|
+
};
|
|
16
|
+
if (appearance) {
|
|
17
|
+
colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
|
|
18
|
+
}
|
|
11
19
|
return "<svg height=\"32\" viewBox=\"0 0 48 48\" xmlns=\"http://www.w3.org/2000/svg\">\n <defs>\n <linearGradient id=\"".concat(id, "-a\" x1=\"12.595\" x2=\"12.595\" y1=\"40\" y2=\"30\" gradientUnits=\"userSpaceOnUse\">\n <stop offset=\"0\" stop-color=\"").concat(colors.iconGradientStart, "\"/>\n <stop offset=\"1\" stop-color=\"").concat(colors.iconGradientStop, "\"/>\n </linearGradient>\n <linearGradient id=\"").concat(id, "-b\" x1=\"28.595\" x2=\"28.595\" y1=\"40\" y2=\"27\" gradientUnits=\"userSpaceOnUse\">\n <stop offset=\"0\" stop-color=\"").concat(colors.iconGradientStart, "\"/>\n <stop offset=\"1\" stop-color=\"").concat(colors.iconGradientStop, "\"/>\n </linearGradient>\n <linearGradient xlink:href=\"#").concat(id, "-b\" id=\"").concat(id, "-c\" x1=\"20.595\" x2=\"20.595\" y2=\"22\"/>\n <linearGradient xlink:href=\"#").concat(id, "-b\" id=\"").concat(id, "-d\" x1=\"36.595\" x2=\"36.595\" y2=\"20\"/>\n </defs>\n <path d=\"M10.595 30h4v10h-4z\" fill=\"url(#").concat(id, "-a)\"/>\n <path d=\"M26.595 27h4v13h-4z\" fill=\"url(#").concat(id, "-b)\"/>\n <path d=\"M18.595 22h4v18h-4z\" fill=\"url(#").concat(id, "-c)\"/>\n <path d=\"M34.595 20h4v20h-4z\" fill=\"url(#").concat(id, "-d)\"/>\n <path fill=\"").concat(colors.iconColor, "\" d=\"m9.009 25.414-2.828-2.828 10.127-10.128a5 5 0 0 1 6.605-.411l4.471 3.477a1.5 1.5 0 0 0 1.982-.123l9.815-9.815 2.828 2.828-10.127 10.128a5 5 0 0 1-6.605.411l-4.471-3.477a1.5 1.5 0 0 0-1.982.123l-9.815 9.815Z\" />\n</svg>");
|
|
12
20
|
};
|
|
13
21
|
|
|
@@ -26,6 +34,10 @@ export var AtlassianAnalyticsIcon = function AtlassianAnalyticsIcon(_ref2) {
|
|
|
26
34
|
label = _ref2$label === void 0 ? 'Atlassian Analytics' : _ref2$label,
|
|
27
35
|
_ref2$size = _ref2.size,
|
|
28
36
|
size = _ref2$size === void 0 ? defaultLogoParams.size : _ref2$size,
|
|
37
|
+
_ref2$iconColor = _ref2.iconColor,
|
|
38
|
+
iconColor = _ref2$iconColor === void 0 ? defaultLogoParams.iconColor : _ref2$iconColor,
|
|
39
|
+
_ref2$textColor = _ref2.textColor,
|
|
40
|
+
textColor = _ref2$textColor === void 0 ? defaultLogoParams.textColor : _ref2$textColor,
|
|
29
41
|
testId = _ref2.testId;
|
|
30
42
|
var _useThemeObserver = useThemeObserver(),
|
|
31
43
|
colorMode = _useThemeObserver.colorMode;
|
|
@@ -34,8 +46,11 @@ export var AtlassianAnalyticsIcon = function AtlassianAnalyticsIcon(_ref2) {
|
|
|
34
46
|
appearance: appearance,
|
|
35
47
|
label: label,
|
|
36
48
|
svg: svg({
|
|
37
|
-
appearance: appearance
|
|
49
|
+
appearance: appearance,
|
|
50
|
+
iconColor: iconColor
|
|
38
51
|
}, colorMode, id),
|
|
52
|
+
iconColor: iconColor,
|
|
53
|
+
textColor: textColor,
|
|
39
54
|
size: size,
|
|
40
55
|
testId: testId
|
|
41
56
|
});
|
|
@@ -6,8 +6,20 @@ import { defaultLogoParams } from '../constants';
|
|
|
6
6
|
import { getColorsFromAppearanceOldLogos } from '../utils';
|
|
7
7
|
import Wrapper from '../wrapper';
|
|
8
8
|
var svg = function svg(_ref, colorMode, id) {
|
|
9
|
-
var appearance = _ref.appearance
|
|
10
|
-
|
|
9
|
+
var appearance = _ref.appearance,
|
|
10
|
+
iconColor = _ref.iconColor,
|
|
11
|
+
textColor = _ref.textColor;
|
|
12
|
+
var colors = {
|
|
13
|
+
iconGradientStart: iconColor,
|
|
14
|
+
iconGradientStop: iconColor,
|
|
15
|
+
textColor: textColor,
|
|
16
|
+
iconColor: iconColor,
|
|
17
|
+
// We treat the word "Atlassian" differently to normal product logos, it has a bold brand look
|
|
18
|
+
atlassianLogoTextColor: textColor
|
|
19
|
+
};
|
|
20
|
+
if (appearance) {
|
|
21
|
+
colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
|
|
22
|
+
}
|
|
11
23
|
return "\n <svg height=\"32\" viewBox=\"0 0 477 48\" xmlns=\"http://www.w3.org/2000/svg\">\n <defs>\n <linearGradient id=\"".concat(id, "-a\" x1=\"447.285\" x2=\"447.285\" y1=\"40\" y2=\"30\" gradientUnits=\"userSpaceOnUse\">\n <stop offset=\"0\" stop-color=\"").concat(colors.iconGradientStart, "\"/>\n <stop offset=\"1\" stop-color=\"").concat(colors.iconGradientStop, "\"/>\n </linearGradient>\n <linearGradient xlink:href=\"#").concat(id, "-a\" id=\"").concat(id, "-b\" x1=\"463.285\" x2=\"463.285\" y2=\"27\"/>\n <linearGradient xlink:href=\"#").concat(id, "-a\" id=\"").concat(id, "-c\" x1=\"455.285\" x2=\"455.285\" y2=\"22\"/>\n <linearGradient xlink:href=\"#").concat(id, "-a\" id=\"").concat(id, "-d\" x1=\"471.285\" x2=\"471.285\" y2=\"20\"/>\n </defs>\n <g fill=\"").concat(colors.atlassianLogoTextColor, "\">\n <path d=\"M106.72 18.359c0 4.201 1.949 7.536 9.572 9.008 4.548.953 5.5 1.689 5.5 3.205 0 1.473-.953 2.425-4.158 2.425-3.725 0-8.142-1.256-11.044-2.988v6.843c2.295 1.126 5.327 2.382 10.957 2.382 7.969 0 11.131-3.551 11.131-8.835m0 0c0-4.981-2.642-7.319-10.091-8.922-4.114-.91-5.111-1.819-5.111-3.118 0-1.646 1.473-2.339 4.201-2.339 3.292 0 6.54.996 9.615 2.382v-6.54c-2.166-1.083-5.5-1.949-9.398-1.949-7.363 0-11.174 3.205-11.174 8.445M209.1 10.346v28.455h6.063V17.103l2.556 5.76 8.575 15.938h7.623V10.346h-6.064V28.71l-2.295-5.327-6.886-13.037H209.1zM163.909 10.346h6.626v28.455h-6.626zM156.263 30.399c0-4.981-2.642-7.319-10.091-8.922-4.114-.91-5.111-1.819-5.111-3.118 0-1.646 1.473-2.339 4.201-2.339 3.292 0 6.54.996 9.615 2.382v-6.54c-2.166-1.083-5.5-1.949-9.398-1.949-7.363 0-11.174 3.205-11.174 8.445 0 4.201 1.949 7.536 9.572 9.008 4.548.953 5.5 1.689 5.5 3.205 0 1.473-.953 2.425-4.158 2.425-3.725 0-8.142-1.256-11.044-2.988v6.843c2.295 1.126 5.327 2.382 10.957 2.382 7.969 0 11.131-3.551 11.131-8.835M55.243 10.346v28.455h13.62l2.145-6.15h-9.095V10.346h-6.67zM28.334 10.346v6.15h7.363v22.305h6.67V16.496h7.882v-6.15H28.334zM18.663 10.346h-8.74L0 38.801h7.579l1.407-4.792a18.852 18.852 0 0 0 10.612 0l1.407 4.792h7.579l-9.922-28.455Zm-4.37 18.533c-1.267 0-2.49-.185-3.647-.524l3.647-12.422 3.647 12.422c-1.157.339-2.38.524-3.647.524ZM92.344 10.346h-8.74l-9.922 28.455h7.579l1.407-4.792a18.852 18.852 0 0 0 10.612 0l1.407 4.792h7.579l-9.922-28.455Zm-4.37 18.533c-1.267 0-2.49-.185-3.647-.524l3.647-12.422 3.647 12.422c-1.157.339-2.38.524-3.647.524ZM194.414 10.346h-8.74l-9.922 28.455h7.579l1.407-4.792a18.852 18.852 0 0 0 10.612 0l1.407 4.792h7.579l-9.922-28.455Zm-4.37 18.533c-1.267 0-2.49-.185-3.647-.524l3.647-12.422 3.647 12.422c-1.157.339-2.38.524-3.647.524Z\"/>\n </g>\n <g fill=\"").concat(colors.textColor, "\">\n <path d=\"m254.776 31.987-2.53 6.809H247.6l11.916-30.225h5.244l11.916 30.225h-4.646l-2.53-6.855c-2.714.552-5.061.828-7.499.828-2.3 0-4.646-.276-7.223-.782Zm13.479-3.496-6.119-16.562-6.119 16.608c2.254.368 4.141.552 5.98.552 1.933 0 3.911-.23 6.257-.598ZM298.984 38.796h-3.957V24.902c0-4.141-1.656-5.981-5.428-5.981-3.681 0-6.211 2.438-6.211 7.085v12.79h-3.957V15.794h3.957v3.772c1.472-2.715 4.187-4.232 7.269-4.232 5.291 0 8.327 3.634 8.327 9.983v13.479ZM320.097 34.656c-1.472 3.036-4.232 4.6-7.775 4.6-6.119 0-9.201-5.199-9.201-11.961 0-6.486 3.22-11.961 9.661-11.961 3.358 0 5.935 1.518 7.314 4.508v-4.048h3.957v23.002h-3.957v-4.14Zm-6.717.92c3.542 0 6.717-2.254 6.717-7.361v-1.84c0-5.106-2.898-7.361-6.256-7.361-4.463 0-6.763 2.944-6.763 8.281 0 5.521 2.208 8.281 6.303 8.281ZM336.196 38.935c-3.772 0-6.165-1.794-6.165-6.027V6.179h3.957v26.269c0 2.07 1.38 2.806 3.083 2.806.414 0 .69 0 1.15-.046v3.542c-.322.092-1.012.184-2.024.184ZM347.328 37.324l-8.327-21.53h4.232l7.361 19.69 7.361-19.69h4.232l-8.695 22.267c-2.576 6.579-4.048 9.983-9.891 9.983-1.979 0-3.083-.184-4.232-.644v-3.404c1.334.414 2.852.552 4.002.552 3.22 0 4.646-2.208 6.533-7.223h-2.576ZM374.698 35.07c.92 0 1.794-.185 2.484-.322v3.818c-.69.184-1.472.368-2.668.368-4.923 0-7.315-2.898-7.315-7.177V19.473h-3.727v-3.68h3.727v-4.877h3.864v4.877h6.119v3.68h-6.119v12.191c0 2.024 1.196 3.405 3.635 3.405ZM384.265 6.961c1.61 0 2.76 1.012 2.76 2.76s-1.15 2.76-2.76 2.76-2.76-1.012-2.76-2.76 1.15-2.76 2.76-2.76Zm-2.024 8.833h3.957v23.002h-3.957V15.794ZM408.416 38.198c-1.38.736-3.496 1.058-5.612 1.058-8.189 0-12.007-4.968-12.007-12.007 0-6.947 3.818-11.915 12.007-11.915 2.07 0 3.68.276 5.475 1.104v3.681c-1.472-.69-3.037-1.104-5.199-1.104-5.98 0-8.419 3.772-8.419 8.235s2.484 8.235 8.511 8.235c2.346 0 3.818-.322 5.244-.828v3.542ZM420.144 39.256c-3.451 0-6.257-.782-8.005-1.702v-4.187c1.978 1.15 5.291 2.254 8.188 2.254 3.037 0 4.601-1.242 4.601-3.036 0-1.749-1.334-2.761-5.705-3.818-5.106-1.242-7.269-3.221-7.269-6.993 0-4.002 3.082-6.44 8.327-6.44 2.99 0 5.705.736 7.407 1.656v4.094c-2.76-1.38-5.014-2.117-7.453-2.117-2.898 0-4.462 1.013-4.462 2.807 0 1.61 1.104 2.622 5.336 3.635 5.106 1.242 7.683 3.128 7.683 7.13 0 3.819-2.484 6.717-8.649 6.717Z\"/>\n </g>\n <path fill=\"url(#").concat(id, "-a)\" d=\"M445.285 30h4v10h-4z\"/>\n <path fill=\"url(#").concat(id, "-b)\" d=\"M461.285 27h4v13h-4z\"/>\n <path fill=\"url(#").concat(id, "-c)\" d=\"M453.285 22h4v18h-4z\"/>\n <path fill=\"url(#").concat(id, "-d)\" d=\"M469.285 20h4v20h-4z\"/>\n <path fill=\"").concat(colors.iconColor, "\" d=\"m443.699 25.414-2.828-2.828 10.127-10.128a5 5 0 0 1 6.605-.411l4.471 3.477a1.5 1.5 0 0 0 1.982-.123l9.815-9.815 2.828 2.828-10.127 10.128a5 5 0 0 1-6.605.411l-4.471-3.477a1.5 1.5 0 0 0-1.982.123l-9.815 9.815Z\"/>\n</svg>");
|
|
12
24
|
};
|
|
13
25
|
|
|
@@ -26,7 +38,11 @@ export var AtlassianAnalyticsLogo = function AtlassianAnalyticsLogo(_ref2) {
|
|
|
26
38
|
label = _ref2$label === void 0 ? 'Atlassian Analytics' : _ref2$label,
|
|
27
39
|
_ref2$size = _ref2.size,
|
|
28
40
|
size = _ref2$size === void 0 ? defaultLogoParams.size : _ref2$size,
|
|
29
|
-
testId = _ref2.testId
|
|
41
|
+
testId = _ref2.testId,
|
|
42
|
+
_ref2$iconColor = _ref2.iconColor,
|
|
43
|
+
iconColor = _ref2$iconColor === void 0 ? defaultLogoParams.iconColor : _ref2$iconColor,
|
|
44
|
+
_ref2$textColor = _ref2.textColor,
|
|
45
|
+
textColor = _ref2$textColor === void 0 ? defaultLogoParams.textColor : _ref2$textColor;
|
|
30
46
|
var _useThemeObserver = useThemeObserver(),
|
|
31
47
|
colorMode = _useThemeObserver.colorMode;
|
|
32
48
|
var id = useId();
|
|
@@ -34,9 +50,13 @@ export var AtlassianAnalyticsLogo = function AtlassianAnalyticsLogo(_ref2) {
|
|
|
34
50
|
appearance: appearance,
|
|
35
51
|
label: label,
|
|
36
52
|
size: size,
|
|
53
|
+
iconColor: iconColor,
|
|
37
54
|
svg: svg({
|
|
38
|
-
appearance: appearance
|
|
55
|
+
appearance: appearance,
|
|
56
|
+
iconColor: iconColor,
|
|
57
|
+
textColor: textColor
|
|
39
58
|
}, colorMode, id),
|
|
40
|
-
testId: testId
|
|
59
|
+
testId: testId,
|
|
60
|
+
textColor: textColor
|
|
41
61
|
});
|
|
42
62
|
};
|
package/dist/esm/wrapper.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* wrapper.tsx generated by @compiled/babel-plugin v0.36.
|
|
1
|
+
/* wrapper.tsx generated by @compiled/babel-plugin v0.36.1 */
|
|
2
2
|
import _extends from "@babel/runtime/helpers/extends";
|
|
3
3
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
4
4
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type {
|
|
2
|
+
import type { LogoProps } from '../types';
|
|
3
3
|
/**
|
|
4
4
|
* __Atlassian Analytics icon__
|
|
5
5
|
*
|
|
@@ -9,4 +9,4 @@ import type { LogoPropsAppearanceRequired } from '../types';
|
|
|
9
9
|
* - [Code](https://atlassian.design/components/logo/code)
|
|
10
10
|
* - [Usage](https://atlassian.design/components/logo/usage)
|
|
11
11
|
*/
|
|
12
|
-
export declare const AtlassianAnalyticsIcon: ({ appearance, label, size, testId, }:
|
|
12
|
+
export declare const AtlassianAnalyticsIcon: ({ appearance, label, size, iconColor, textColor, testId, }: LogoProps) => React.JSX.Element;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type {
|
|
2
|
+
import type { LogoProps } from '../types';
|
|
3
3
|
/**
|
|
4
4
|
* __Atlassian Analytics logo__
|
|
5
5
|
*
|
|
@@ -9,4 +9,4 @@ import type { LogoPropsAppearanceRequired } from '../types';
|
|
|
9
9
|
* - [Code](https://atlassian.design/components/logo/code)
|
|
10
10
|
* - [Usage](https://atlassian.design/components/logo/usage)
|
|
11
11
|
*/
|
|
12
|
-
export declare const AtlassianAnalyticsLogo: ({ appearance, label, size, testId, }:
|
|
12
|
+
export declare const AtlassianAnalyticsLogo: ({ appearance, label, size, testId, iconColor, textColor, }: LogoProps) => React.JSX.Element;
|
package/dist/types/types.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
type Appearance = 'brand' | 'neutral' | 'inverse';
|
|
2
|
+
type Size = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
|
|
3
3
|
export type LogoProps = {
|
|
4
4
|
/**
|
|
5
5
|
* The size of the icon, uses the same sizing scheme as in `@atlaskit/icon`.
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type {
|
|
2
|
+
import type { LogoProps } from '../types';
|
|
3
3
|
/**
|
|
4
4
|
* __Atlassian Analytics icon__
|
|
5
5
|
*
|
|
@@ -9,4 +9,4 @@ import type { LogoPropsAppearanceRequired } from '../types';
|
|
|
9
9
|
* - [Code](https://atlassian.design/components/logo/code)
|
|
10
10
|
* - [Usage](https://atlassian.design/components/logo/usage)
|
|
11
11
|
*/
|
|
12
|
-
export declare const AtlassianAnalyticsIcon: ({ appearance, label, size, testId, }:
|
|
12
|
+
export declare const AtlassianAnalyticsIcon: ({ appearance, label, size, iconColor, textColor, testId, }: LogoProps) => React.JSX.Element;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import type {
|
|
2
|
+
import type { LogoProps } from '../types';
|
|
3
3
|
/**
|
|
4
4
|
* __Atlassian Analytics logo__
|
|
5
5
|
*
|
|
@@ -9,4 +9,4 @@ import type { LogoPropsAppearanceRequired } from '../types';
|
|
|
9
9
|
* - [Code](https://atlassian.design/components/logo/code)
|
|
10
10
|
* - [Usage](https://atlassian.design/components/logo/usage)
|
|
11
11
|
*/
|
|
12
|
-
export declare const AtlassianAnalyticsLogo: ({ appearance, label, size, testId, }:
|
|
12
|
+
export declare const AtlassianAnalyticsLogo: ({ appearance, label, size, testId, iconColor, textColor, }: LogoProps) => React.JSX.Element;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
type Appearance = 'brand' | 'neutral' | 'inverse';
|
|
2
|
+
type Size = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
|
|
3
3
|
export type LogoProps = {
|
|
4
4
|
/**
|
|
5
5
|
* The size of the icon, uses the same sizing scheme as in `@atlaskit/icon`.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@atlaskit/logo",
|
|
3
|
-
"version": "15.
|
|
3
|
+
"version": "15.3.1",
|
|
4
4
|
"description": "A logo is a visual representation of a brand or product. It can be a word or an image, or a combination of both.",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"registry": "https://registry.npmjs.org/"
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
},
|
|
27
27
|
"dependencies": {
|
|
28
28
|
"@atlaskit/ds-lib": "^3.5.0",
|
|
29
|
-
"@atlaskit/theme": "^
|
|
29
|
+
"@atlaskit/theme": "^16.0.0",
|
|
30
30
|
"@atlaskit/tokens": "^3.3.0",
|
|
31
31
|
"@babel/runtime": "^7.0.0",
|
|
32
32
|
"@compiled/react": "^0.18.1"
|
|
@@ -37,10 +37,19 @@
|
|
|
37
37
|
"devDependencies": {
|
|
38
38
|
"@af/accessibility-testing": "*",
|
|
39
39
|
"@af/integration-testing": "*",
|
|
40
|
+
"@af/visual-regression": "*",
|
|
41
|
+
"@atlaskit/code": "^15.7.1",
|
|
42
|
+
"@atlaskit/docs": "*",
|
|
43
|
+
"@atlaskit/form": "^11.1.1",
|
|
44
|
+
"@atlaskit/link": "*",
|
|
45
|
+
"@atlaskit/lozenge": "^11.13.2",
|
|
46
|
+
"@atlaskit/primitives": "^13.5.0",
|
|
47
|
+
"@atlaskit/section-message": "*",
|
|
48
|
+
"@atlaskit/select": "^18.10.4",
|
|
40
49
|
"@atlaskit/ssr": "*",
|
|
41
|
-
"@atlaskit/visual-regression": "*",
|
|
42
50
|
"@testing-library/react": "^13.4.0",
|
|
43
51
|
"jscodeshift": "^0.13.0",
|
|
52
|
+
"lodash": "^4.17.21",
|
|
44
53
|
"react-dom": "^18.2.0",
|
|
45
54
|
"typescript": "~5.4.2"
|
|
46
55
|
},
|
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
import {
|
|
2
|
-
type API,
|
|
3
|
-
type ASTPath,
|
|
4
|
-
type FileInfo,
|
|
5
|
-
type ImportDeclaration,
|
|
6
|
-
type ImportSpecifier,
|
|
7
|
-
type Options,
|
|
8
|
-
} from 'jscodeshift';
|
|
9
|
-
|
|
10
|
-
import { addCommentBefore } from './utils';
|
|
11
|
-
|
|
12
|
-
const replacementMapping: { [name: string]: string } = {
|
|
13
|
-
Props: 'LogoProps',
|
|
14
|
-
DefaultProps: 'defaultLogoParams',
|
|
15
|
-
JiraCoreIcon: 'JiraWorkManagementIcon',
|
|
16
|
-
JiraCoreLogo: 'JiraWorkManagementLogo',
|
|
17
|
-
JiraCoreWordmark: 'JiraWorkManagementWordmark',
|
|
18
|
-
JiraServiceDeskIcon: 'JiraServiceManagementIcon',
|
|
19
|
-
JiraServiceDeskLogo: 'JiraServiceManagementLogo',
|
|
20
|
-
JiraServiceDeskWordmark: 'JiraServiceManagementWordmark',
|
|
21
|
-
OpsGenieIcon: 'OpsgenieIcon',
|
|
22
|
-
OpsGenieIconLogo: 'OpsgenieIconLogo',
|
|
23
|
-
OpsGenieIconWordmark: 'OpsgenieIconWordmark',
|
|
24
|
-
StrideIcon: 'NO_ALTERNATIVE_COMPONENT',
|
|
25
|
-
StrideLogo: 'NO_ALTERNATIVE_COMPONENT',
|
|
26
|
-
StrideWordmark: 'NO_ALTERNATIVE_COMPONENT',
|
|
27
|
-
HipchatIcon: 'NO_ALTERNATIVE_COMPONENT',
|
|
28
|
-
HipchatLogo: 'NO_ALTERNATIVE_COMPONENT',
|
|
29
|
-
HipchatWordmark: 'NO_ALTERNATIVE_COMPONENT',
|
|
30
|
-
};
|
|
31
|
-
|
|
32
|
-
export default function transform(file: FileInfo, { jscodeshift: j }: API, options: Options) {
|
|
33
|
-
const source = j(file.source);
|
|
34
|
-
const target = source.find(j.ImportDeclaration).filter((path: ASTPath<ImportDeclaration>) => {
|
|
35
|
-
const value = path.node.source.value as string;
|
|
36
|
-
return value.includes('@atlaskit/logo');
|
|
37
|
-
});
|
|
38
|
-
const logoImports = target.find(j.ImportSpecifier);
|
|
39
|
-
|
|
40
|
-
if (!logoImports.length) {
|
|
41
|
-
// Returns original source file, untouched and unformatted
|
|
42
|
-
return file.source;
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
logoImports.forEach((path: ASTPath<ImportSpecifier>) => {
|
|
46
|
-
const foundKey = Object.keys(replacementMapping).find((key) => key === path.node.imported.name);
|
|
47
|
-
|
|
48
|
-
if (!foundKey || !replacementMapping[foundKey] || !path.node.local) {
|
|
49
|
-
return;
|
|
50
|
-
}
|
|
51
|
-
// add comment for logo component that don't have alternatives
|
|
52
|
-
if (replacementMapping[foundKey] === 'NO_ALTERNATIVE_COMPONENT') {
|
|
53
|
-
addCommentBefore(
|
|
54
|
-
j,
|
|
55
|
-
target,
|
|
56
|
-
`This file uses the @atlaskit/logo \`${foundKey}\`
|
|
57
|
-
which will be removed with no alternative in the next major version.`,
|
|
58
|
-
);
|
|
59
|
-
return;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
// replace the import with mapping name
|
|
63
|
-
const newLogoImport: ImportSpecifier = j.importSpecifier(
|
|
64
|
-
j.identifier(replacementMapping[foundKey]),
|
|
65
|
-
// if aliased import exist, keep the alias name unchanged, i.e.
|
|
66
|
-
// before: import { JiraCoreLogo as JCLogo } from '@atlaskit/logo';
|
|
67
|
-
// after: import { JiraWorkManagementLogo as JCLogo } from '@atlaskit/logo';
|
|
68
|
-
// otherwise alias the import using the original name, i.e.
|
|
69
|
-
// before: import { JiraCoreLogo } from '@atlaskit/logo';
|
|
70
|
-
// after: import { JiraWorkManagementLogo as JiraCoreLogo } from '@atlaskit/logo';
|
|
71
|
-
j.identifier(
|
|
72
|
-
path.node.local.name !== path.node.imported.name ? path.node.local.name : foundKey,
|
|
73
|
-
),
|
|
74
|
-
);
|
|
75
|
-
|
|
76
|
-
j(path).replaceWith(newLogoImport);
|
|
77
|
-
});
|
|
78
|
-
|
|
79
|
-
return source.toSource(options.printOptions);
|
|
80
|
-
}
|
|
@@ -1,233 +0,0 @@
|
|
|
1
|
-
jest.autoMockOff();
|
|
2
|
-
|
|
3
|
-
import transformer from '../13.6.0-rename-imports';
|
|
4
|
-
|
|
5
|
-
const defineInlineTest = require('jscodeshift/dist/testUtils').defineInlineTest;
|
|
6
|
-
|
|
7
|
-
describe('Rename Logo import code-mods', () => {
|
|
8
|
-
['tsx', 'babylon'].forEach((parser) => {
|
|
9
|
-
describe(`parser: ${parser}`, () => {
|
|
10
|
-
defineInlineTest(
|
|
11
|
-
{ default: transformer, parser },
|
|
12
|
-
{},
|
|
13
|
-
`
|
|
14
|
-
import React from 'react';
|
|
15
|
-
import { JiraCoreLogo } from '@atlaskit/logo';
|
|
16
|
-
|
|
17
|
-
const Logo = () => (<JiraCoreLogo />);
|
|
18
|
-
`,
|
|
19
|
-
`
|
|
20
|
-
import React from 'react';
|
|
21
|
-
import { JiraWorkManagementLogo as JiraCoreLogo } from '@atlaskit/logo';
|
|
22
|
-
|
|
23
|
-
const Logo = () => (<JiraCoreLogo />);
|
|
24
|
-
`,
|
|
25
|
-
'should alias the import using alternative components',
|
|
26
|
-
);
|
|
27
|
-
defineInlineTest(
|
|
28
|
-
{ default: transformer, parser },
|
|
29
|
-
{},
|
|
30
|
-
`
|
|
31
|
-
import React from 'react';
|
|
32
|
-
import {
|
|
33
|
-
AtlassianIcon,
|
|
34
|
-
JiraCoreLogo
|
|
35
|
-
} from '@atlaskit/logo';
|
|
36
|
-
const getProductIcon = (productId: string) => {
|
|
37
|
-
switch (productId) {
|
|
38
|
-
case 'jira-core':
|
|
39
|
-
return JiraCoreIcon;
|
|
40
|
-
default:
|
|
41
|
-
return AtlassianIcon;
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
const Logo = () => getProductIcon();
|
|
45
|
-
`,
|
|
46
|
-
`
|
|
47
|
-
import React from 'react';
|
|
48
|
-
import {
|
|
49
|
-
AtlassianIcon,
|
|
50
|
-
JiraWorkManagementLogo as JiraCoreLogo
|
|
51
|
-
} from '@atlaskit/logo';
|
|
52
|
-
const getProductIcon = (productId: string) => {
|
|
53
|
-
switch (productId) {
|
|
54
|
-
case 'jira-core':
|
|
55
|
-
return JiraCoreIcon;
|
|
56
|
-
default:
|
|
57
|
-
return AtlassianIcon;
|
|
58
|
-
}
|
|
59
|
-
}
|
|
60
|
-
const Logo = () => getProductIcon();
|
|
61
|
-
`,
|
|
62
|
-
'should alias the import using alternative components, and keep other logo components unchanged',
|
|
63
|
-
);
|
|
64
|
-
defineInlineTest(
|
|
65
|
-
{ default: transformer, parser },
|
|
66
|
-
{},
|
|
67
|
-
`
|
|
68
|
-
import React from 'react';
|
|
69
|
-
import { JiraCoreLogo } from '@atlaskit/logo';
|
|
70
|
-
|
|
71
|
-
const Logo = ({textColor}) => (<JiraCoreLogo textColor={textColor} />);
|
|
72
|
-
`,
|
|
73
|
-
`
|
|
74
|
-
import React from 'react';
|
|
75
|
-
import { JiraWorkManagementLogo as JiraCoreLogo } from '@atlaskit/logo';
|
|
76
|
-
|
|
77
|
-
const Logo = ({textColor}) => (<JiraCoreLogo textColor={textColor} />);
|
|
78
|
-
`,
|
|
79
|
-
'should replace imports with alternative component with props unchanged',
|
|
80
|
-
);
|
|
81
|
-
defineInlineTest(
|
|
82
|
-
{ default: transformer, parser },
|
|
83
|
-
{},
|
|
84
|
-
`
|
|
85
|
-
import React from 'react';
|
|
86
|
-
import {
|
|
87
|
-
JiraCoreWordmark,
|
|
88
|
-
JiraCoreIcon
|
|
89
|
-
} from '@atlaskit/logo';
|
|
90
|
-
|
|
91
|
-
const Logo = () => (<><JiraCoreIcon /><JiraCoreWordmark /></>);
|
|
92
|
-
`,
|
|
93
|
-
`
|
|
94
|
-
import React from 'react';
|
|
95
|
-
import {
|
|
96
|
-
JiraWorkManagementWordmark as JiraCoreWordmark,
|
|
97
|
-
JiraWorkManagementIcon as JiraCoreIcon
|
|
98
|
-
} from '@atlaskit/logo';
|
|
99
|
-
|
|
100
|
-
const Logo = () => (<><JiraCoreIcon /><JiraCoreWordmark /></>);
|
|
101
|
-
`,
|
|
102
|
-
'should alias multiple imports using alternative components',
|
|
103
|
-
);
|
|
104
|
-
defineInlineTest(
|
|
105
|
-
{ default: transformer, parser },
|
|
106
|
-
{},
|
|
107
|
-
`
|
|
108
|
-
import React from 'react';
|
|
109
|
-
import { JiraCoreLogo as JCLogo } from '@atlaskit/logo';
|
|
110
|
-
|
|
111
|
-
const Logo = () => (<JCLogo />);
|
|
112
|
-
`,
|
|
113
|
-
`
|
|
114
|
-
import React from 'react';
|
|
115
|
-
import { JiraWorkManagementLogo as JCLogo } from '@atlaskit/logo';
|
|
116
|
-
|
|
117
|
-
const Logo = () => (<JCLogo />);
|
|
118
|
-
`,
|
|
119
|
-
'should replace aliased import and JSX element with alternative components',
|
|
120
|
-
);
|
|
121
|
-
defineInlineTest(
|
|
122
|
-
{ default: transformer, parser },
|
|
123
|
-
{},
|
|
124
|
-
`
|
|
125
|
-
import React from 'react';
|
|
126
|
-
import { StrideIcon } from '@atlaskit/logo';
|
|
127
|
-
|
|
128
|
-
const Logo = () => (<StrideIcon />);
|
|
129
|
-
`,
|
|
130
|
-
`
|
|
131
|
-
import React from 'react';
|
|
132
|
-
/* TODO: (from codemod) This file uses the @atlaskit/logo \`StrideIcon\`
|
|
133
|
-
which will be removed with no alternative in the next major version. */
|
|
134
|
-
import { StrideIcon } from '@atlaskit/logo';
|
|
135
|
-
|
|
136
|
-
const Logo = () => (<StrideIcon />);
|
|
137
|
-
`,
|
|
138
|
-
'should prompt user when using logo components with no alternatives',
|
|
139
|
-
);
|
|
140
|
-
defineInlineTest(
|
|
141
|
-
{ default: transformer, parser },
|
|
142
|
-
{},
|
|
143
|
-
`
|
|
144
|
-
import React from 'react';
|
|
145
|
-
import { JiraCoreIcon, HipchatIcon } from '@atlaskit/logo';
|
|
146
|
-
const Logo = () => (<><JiraCoreIcon /><HipchatIcon /></>);
|
|
147
|
-
`,
|
|
148
|
-
`
|
|
149
|
-
import React from 'react';
|
|
150
|
-
/* TODO: (from codemod) This file uses the @atlaskit/logo \`HipchatIcon\`
|
|
151
|
-
which will be removed with no alternative in the next major version. */
|
|
152
|
-
import { JiraWorkManagementIcon as JiraCoreIcon, HipchatIcon } from '@atlaskit/logo';
|
|
153
|
-
const Logo = () => (<><JiraCoreIcon /><HipchatIcon /></>);
|
|
154
|
-
`,
|
|
155
|
-
'should alias imports using alternative component and propt user when using logo compontns with no alternatives',
|
|
156
|
-
);
|
|
157
|
-
defineInlineTest(
|
|
158
|
-
{ default: transformer, parser },
|
|
159
|
-
{},
|
|
160
|
-
`
|
|
161
|
-
import React from 'react';
|
|
162
|
-
|
|
163
|
-
const MyComponent = () => (<div />);
|
|
164
|
-
`,
|
|
165
|
-
`
|
|
166
|
-
import React from 'react';
|
|
167
|
-
|
|
168
|
-
const MyComponent = () => (<div />);
|
|
169
|
-
`,
|
|
170
|
-
'should not modify files that are not using @atlaskit/logo',
|
|
171
|
-
);
|
|
172
|
-
});
|
|
173
|
-
describe(`parser: ${parser}`, () => {
|
|
174
|
-
defineInlineTest(
|
|
175
|
-
{ default: transformer, parser },
|
|
176
|
-
{},
|
|
177
|
-
`
|
|
178
|
-
import React from 'react';
|
|
179
|
-
import { Props } from '@atlaskit/logo/constants';
|
|
180
|
-
|
|
181
|
-
const ExampleLogoProps = Props;
|
|
182
|
-
`,
|
|
183
|
-
`
|
|
184
|
-
import React from 'react';
|
|
185
|
-
import { LogoProps as Props } from '@atlaskit/logo/constants';
|
|
186
|
-
|
|
187
|
-
const ExampleLogoProps = Props;
|
|
188
|
-
`,
|
|
189
|
-
'should alias the Props import using LogoProps',
|
|
190
|
-
);
|
|
191
|
-
});
|
|
192
|
-
describe(`parser: ${parser}`, () => {
|
|
193
|
-
defineInlineTest(
|
|
194
|
-
{ default: transformer, parser },
|
|
195
|
-
{},
|
|
196
|
-
`
|
|
197
|
-
import React from 'react';
|
|
198
|
-
import { DefaultProps } from '@atlaskit/logo/constants';
|
|
199
|
-
|
|
200
|
-
const ExampleLogoProps = DefaultProps;
|
|
201
|
-
`,
|
|
202
|
-
`
|
|
203
|
-
import React from 'react';
|
|
204
|
-
import { defaultLogoParams as DefaultProps } from '@atlaskit/logo/constants';
|
|
205
|
-
|
|
206
|
-
const ExampleLogoProps = DefaultProps;
|
|
207
|
-
`,
|
|
208
|
-
'should alias the DefaultProps import using defaultLogoParams',
|
|
209
|
-
);
|
|
210
|
-
});
|
|
211
|
-
describe(`parser: ${parser}`, () => {
|
|
212
|
-
defineInlineTest(
|
|
213
|
-
{ default: transformer, parser },
|
|
214
|
-
{},
|
|
215
|
-
`
|
|
216
|
-
import React from 'react';
|
|
217
|
-
import { JiraCoreIcon } from '@atlaskit/logo';
|
|
218
|
-
import { DefaultProps } from '@atlaskit/logo/constants';
|
|
219
|
-
|
|
220
|
-
const Logo = (DefaultProps) => (<JiraCoreIcon />);
|
|
221
|
-
`,
|
|
222
|
-
`
|
|
223
|
-
import React from 'react';
|
|
224
|
-
import { JiraWorkManagementIcon as JiraCoreIcon } from '@atlaskit/logo';
|
|
225
|
-
import { defaultLogoParams as DefaultProps } from '@atlaskit/logo/constants';
|
|
226
|
-
|
|
227
|
-
const Logo = (DefaultProps) => (<JiraCoreIcon />);
|
|
228
|
-
`,
|
|
229
|
-
'should alias imports from both @atlaskit/logo and the /constants entrypoint at the same time',
|
|
230
|
-
);
|
|
231
|
-
});
|
|
232
|
-
});
|
|
233
|
-
});
|
package/codemods/utils.tsx
DELETED
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import type { ASTPath, default as core } from 'jscodeshift';
|
|
2
|
-
import { type Collection } from 'jscodeshift/src/Collection';
|
|
3
|
-
|
|
4
|
-
// not replacing newlines (which \s does)
|
|
5
|
-
const spacesAndTabs: RegExp = /[ \t]{2,}/g;
|
|
6
|
-
const lineStartWithSpaces: RegExp = /^[ \t]*/gm;
|
|
7
|
-
|
|
8
|
-
function clean(value: string): string {
|
|
9
|
-
return value.replace(spacesAndTabs, ' ').replace(lineStartWithSpaces, '').trim();
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
export function addCommentBefore(j: core.JSCodeshift, target: Collection<any>, message: string) {
|
|
13
|
-
const content: string = ` TODO: (from codemod) ${clean(message)} `;
|
|
14
|
-
target.forEach((path: ASTPath<any>) => {
|
|
15
|
-
path.value.comments = path.value.comments || [];
|
|
16
|
-
|
|
17
|
-
const exists = path.value.comments.find((comment: any) => comment.value === content);
|
|
18
|
-
|
|
19
|
-
// avoiding duplicates of the same comment
|
|
20
|
-
if (exists) {
|
|
21
|
-
return;
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
path.value.comments.push(j.commentBlock(content));
|
|
25
|
-
});
|
|
26
|
-
}
|