@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 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
- var colors = (0, _utils.getColorsFromAppearanceOldLogos)(appearance, colorMode);
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
- var colors = (0, _utils.getColorsFromAppearanceOldLogos)(appearance, colorMode);
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
  };
@@ -1,4 +1,4 @@
1
- /* wrapper.tsx generated by @compiled/babel-plugin v0.36.0 */
1
+ /* wrapper.tsx generated by @compiled/babel-plugin v0.36.1 */
2
2
  "use strict";
3
3
 
4
4
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -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
- const colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
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
- const colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
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
  };
@@ -1,4 +1,4 @@
1
- /* wrapper.tsx generated by @compiled/babel-plugin v0.36.0 */
1
+ /* wrapper.tsx generated by @compiled/babel-plugin v0.36.1 */
2
2
  import _extends from "@babel/runtime/helpers/extends";
3
3
  import "./wrapper.compiled.css";
4
4
  import * as React from 'react';
@@ -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
- var colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
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
- var colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
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
  };
@@ -1,4 +1,4 @@
1
- /* wrapper.tsx generated by @compiled/babel-plugin v0.36.0 */
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 { LogoPropsAppearanceRequired } from '../types';
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, }: LogoPropsAppearanceRequired) => React.JSX.Element;
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 { LogoPropsAppearanceRequired } from '../types';
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, }: LogoPropsAppearanceRequired) => React.JSX.Element;
12
+ export declare const AtlassianAnalyticsLogo: ({ appearance, label, size, testId, iconColor, textColor, }: LogoProps) => React.JSX.Element;
@@ -1,5 +1,5 @@
1
- export type Appearance = 'brand' | 'neutral' | 'inverse';
2
- export type Size = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
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 { LogoPropsAppearanceRequired } from '../types';
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, }: LogoPropsAppearanceRequired) => React.JSX.Element;
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 { LogoPropsAppearanceRequired } from '../types';
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, }: LogoPropsAppearanceRequired) => React.JSX.Element;
12
+ export declare const AtlassianAnalyticsLogo: ({ appearance, label, size, testId, iconColor, textColor, }: LogoProps) => React.JSX.Element;
@@ -1,5 +1,5 @@
1
- export type Appearance = 'brand' | 'neutral' | 'inverse';
2
- export type Size = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
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.2.1",
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": "^15.0.0",
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
- });
@@ -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
- }