@atlaskit/logo 14.2.0 → 14.2.2

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,19 @@
1
1
  # @atlaskit/logo
2
2
 
3
+ ## 14.2.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [#134918](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/134918)
8
+ [`702121b21483a`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/702121b21483a) -
9
+ Remove react-uid
10
+
11
+ ## 14.2.1
12
+
13
+ ### Patch Changes
14
+
15
+ - Updated dependencies
16
+
3
17
  ## 14.2.0
4
18
 
5
19
  ### Minor Changes
@@ -6,20 +6,15 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.AtlassianAnalyticsIcon = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
- var _reactUid = require("react-uid");
9
+ var _reactUid = require("@atlaskit/ds-lib/react-uid");
10
10
  var _tokens = require("@atlaskit/tokens");
11
11
  var _constants = require("../constants");
12
12
  var _utils = require("../utils");
13
13
  var _wrapper = _interopRequireDefault(require("../wrapper"));
14
14
  /* eslint-disable max-len */
15
15
 
16
- var svg = function svg(_ref, colorMode) {
16
+ var svg = function svg(_ref, colorMode, id) {
17
17
  var appearance = _ref.appearance;
18
- // Replace with React 18's useId() hook when we update.
19
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
20
- var id = (0, _reactUid.uid)({
21
- appearance: appearance
22
- });
23
18
  var colors = (0, _utils.getColorsFromAppearanceOldLogos)(appearance, colorMode);
24
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>");
25
20
  };
@@ -42,12 +37,13 @@ var AtlassianAnalyticsIcon = exports.AtlassianAnalyticsIcon = function Atlassian
42
37
  testId = _ref2.testId;
43
38
  var _useThemeObserver = (0, _tokens.useThemeObserver)(),
44
39
  colorMode = _useThemeObserver.colorMode;
40
+ var id = (0, _reactUid.useId)();
45
41
  return /*#__PURE__*/_react.default.createElement(_wrapper.default, {
46
42
  appearance: appearance,
47
43
  label: label,
48
44
  svg: svg({
49
45
  appearance: appearance
50
- }, colorMode),
46
+ }, colorMode, id),
51
47
  size: size,
52
48
  testId: testId
53
49
  });
@@ -6,21 +6,15 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.AtlassianAnalyticsLogo = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
- var _reactUid = require("react-uid");
9
+ var _reactUid = require("@atlaskit/ds-lib/react-uid");
10
10
  var _tokens = require("@atlaskit/tokens");
11
11
  var _constants = require("../constants");
12
12
  var _utils = require("../utils");
13
13
  var _wrapper = _interopRequireDefault(require("../wrapper"));
14
14
  /* eslint-disable max-len */
15
15
 
16
- var svg = function svg(_ref, colorMode) {
16
+ var svg = function svg(_ref, colorMode, id) {
17
17
  var appearance = _ref.appearance;
18
- // Will be fixed upon removal of deprecated iconGradientStart and
19
- // iconGradientStop props, or with React 18's useId() hook when we update.
20
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
21
- var id = (0, _reactUid.uid)({
22
- appearance: appearance
23
- });
24
18
  var colors = (0, _utils.getColorsFromAppearanceOldLogos)(appearance, colorMode);
25
19
  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>");
26
20
  };
@@ -43,13 +37,14 @@ var AtlassianAnalyticsLogo = exports.AtlassianAnalyticsLogo = function Atlassian
43
37
  testId = _ref2.testId;
44
38
  var _useThemeObserver = (0, _tokens.useThemeObserver)(),
45
39
  colorMode = _useThemeObserver.colorMode;
40
+ var id = (0, _reactUid.useId)();
46
41
  return /*#__PURE__*/_react.default.createElement(_wrapper.default, {
47
42
  appearance: appearance,
48
43
  label: label,
49
44
  size: size,
50
45
  svg: svg({
51
46
  appearance: appearance
52
- }, colorMode),
47
+ }, colorMode, id),
53
48
  testId: testId
54
49
  });
55
50
  };
@@ -6,14 +6,14 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.AtlassianStartLogo = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
- var _reactUid = require("react-uid");
9
+ var _reactUid = require("@atlaskit/ds-lib/react-uid");
10
10
  var _tokens = require("@atlaskit/tokens");
11
11
  var _constants = require("../constants");
12
12
  var _utils = require("../utils");
13
13
  var _wrapper = _interopRequireDefault(require("../wrapper"));
14
14
  /* eslint-disable max-len */
15
15
 
16
- var svg = function svg(_ref, colorMode) {
16
+ var svg = function svg(_ref, colorMode, id) {
17
17
  var appearance = _ref.appearance,
18
18
  iconColor = _ref.iconColor,
19
19
  textColor = _ref.textColor;
@@ -25,12 +25,6 @@ var svg = function svg(_ref, colorMode) {
25
25
  // We treat the word "Atlassian" differently to normal product logos, it has a bold brand look
26
26
  atlassianLogoTextColor: textColor
27
27
  };
28
- // Will be fixed upon removal of deprecated iconGradientStart and
29
- // iconGradientStop props, or with React 18's useId() hook when we update.
30
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
31
- var id = (0, _reactUid.uid)({
32
- iconGradientStart: colors.iconGradientStop
33
- });
34
28
  if (appearance) {
35
29
  colors = (0, _utils.getColorsFromAppearanceOldLogos)(appearance, colorMode);
36
30
  }
@@ -62,6 +56,7 @@ var AtlassianStartLogo = exports.AtlassianStartLogo = function AtlassianStartLog
62
56
  textColor = _ref2$textColor === void 0 ? _constants.defaultLogoParams.textColor : _ref2$textColor;
63
57
  var _useThemeObserver = (0, _tokens.useThemeObserver)(),
64
58
  colorMode = _useThemeObserver.colorMode;
59
+ var id = (0, _reactUid.useId)();
65
60
  return /*#__PURE__*/_react.default.createElement(_wrapper.default, {
66
61
  appearance: appearance,
67
62
  label: label,
@@ -72,7 +67,7 @@ var AtlassianStartLogo = exports.AtlassianStartLogo = function AtlassianStartLog
72
67
  label: label,
73
68
  iconColor: iconColor,
74
69
  textColor: textColor
75
- }, colorMode),
70
+ }, colorMode, id),
76
71
  testId: testId,
77
72
  textColor: textColor
78
73
  });
@@ -6,14 +6,14 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.HalpIcon = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
- var _reactUid = require("react-uid");
9
+ var _reactUid = require("@atlaskit/ds-lib/react-uid");
10
10
  var _tokens = require("@atlaskit/tokens");
11
11
  var _constants = require("../constants");
12
12
  var _utils = require("../utils");
13
13
  var _wrapper = _interopRequireDefault(require("../wrapper"));
14
14
  /* eslint-disable max-len */
15
15
 
16
- var svg = function svg(_ref, colorMode) {
16
+ var svg = function svg(_ref, colorMode, id) {
17
17
  var appearance = _ref.appearance,
18
18
  iconColor = _ref.iconColor;
19
19
  var colors = {
@@ -21,12 +21,6 @@ var svg = function svg(_ref, colorMode) {
21
21
  iconGradientStop: _constants.legacyDefaultLogoParams.iconGradientStart,
22
22
  iconColor: iconColor
23
23
  };
24
- // Will be fixed upon removal of deprecated iconGradientStart and
25
- // iconGradientStop props, or with React 18's useId() hook when we update.
26
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
27
- var id = (0, _reactUid.uid)({
28
- iconGradientStart: colors.iconGradientStop
29
- });
30
24
  if (appearance) {
31
25
  colors = (0, _utils.getColorsFromAppearanceOldLogos)(appearance, colorMode);
32
26
  }
@@ -58,13 +52,14 @@ var HalpIcon = exports.HalpIcon = function HalpIcon(_ref2) {
58
52
  iconColor = _ref2$iconColor === void 0 ? _constants.defaultLogoParams.iconColor : _ref2$iconColor;
59
53
  var _useThemeObserver = (0, _tokens.useThemeObserver)(),
60
54
  colorMode = _useThemeObserver.colorMode;
55
+ var id = (0, _reactUid.useId)();
61
56
  return /*#__PURE__*/_react.default.createElement(_wrapper.default, {
62
57
  appearance: appearance,
63
58
  label: label,
64
59
  svg: svg({
65
60
  appearance: appearance,
66
61
  iconColor: iconColor
67
- }, colorMode),
62
+ }, colorMode, id),
68
63
  iconColor: iconColor,
69
64
  size: size,
70
65
  testId: testId,
@@ -6,14 +6,14 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.HalpLogo = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
- var _reactUid = require("react-uid");
9
+ var _reactUid = require("@atlaskit/ds-lib/react-uid");
10
10
  var _tokens = require("@atlaskit/tokens");
11
11
  var _constants = require("../constants");
12
12
  var _utils = require("../utils");
13
13
  var _wrapper = _interopRequireDefault(require("../wrapper"));
14
14
  /* eslint-disable max-len */
15
15
 
16
- var svg = function svg(_ref, colorMode) {
16
+ var svg = function svg(_ref, colorMode, id) {
17
17
  var appearance = _ref.appearance,
18
18
  iconColor = _ref.iconColor,
19
19
  textColor = _ref.textColor;
@@ -23,12 +23,6 @@ var svg = function svg(_ref, colorMode) {
23
23
  iconColor: iconColor,
24
24
  textColor: textColor
25
25
  };
26
- // Will be fixed upon removal of deprecated iconGradientStart and
27
- // iconGradientStop props, or with React 18's useId() hook when we update.
28
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
29
- var id = (0, _reactUid.uid)({
30
- iconGradientStart: colors.iconGradientStop
31
- });
32
26
  if (appearance) {
33
27
  colors = (0, _utils.getColorsFromAppearanceOldLogos)(appearance, colorMode);
34
28
  }
@@ -60,6 +54,7 @@ var HalpLogo = exports.HalpLogo = function HalpLogo(_ref2) {
60
54
  textColor = _ref2$textColor === void 0 ? _constants.defaultLogoParams.textColor : _ref2$textColor;
61
55
  var _useThemeObserver = (0, _tokens.useThemeObserver)(),
62
56
  colorMode = _useThemeObserver.colorMode;
57
+ var id = (0, _reactUid.useId)();
63
58
  return /*#__PURE__*/_react.default.createElement(_wrapper.default, {
64
59
  appearance: appearance,
65
60
  label: label,
@@ -69,7 +64,7 @@ var HalpLogo = exports.HalpLogo = function HalpLogo(_ref2) {
69
64
  appearance: appearance,
70
65
  iconColor: iconColor,
71
66
  textColor: textColor
72
- }, colorMode),
67
+ }, colorMode, id),
73
68
  testId: testId,
74
69
  textColor: textColor
75
70
  });
@@ -6,14 +6,14 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.JiraSoftwareIcon = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
- var _reactUid = require("react-uid");
9
+ var _reactUid = require("@atlaskit/ds-lib/react-uid");
10
10
  var _tokens = require("@atlaskit/tokens");
11
11
  var _constants = require("../constants");
12
12
  var _utils = require("../utils");
13
13
  var _wrapper = _interopRequireDefault(require("../wrapper"));
14
14
  /* eslint-disable max-len */
15
15
 
16
- var svg = function svg(_ref, colorMode) {
16
+ var svg = function svg(_ref, colorMode, id) {
17
17
  var appearance = _ref.appearance,
18
18
  iconColor = _ref.iconColor;
19
19
  var colors = {
@@ -21,12 +21,6 @@ var svg = function svg(_ref, colorMode) {
21
21
  iconGradientStop: _constants.legacyDefaultLogoParams.iconGradientStart,
22
22
  iconColor: iconColor
23
23
  };
24
- // Will be fixed upon removal of deprecated iconGradientStart and
25
- // iconGradientStop props, or with React 18's useId() hook when we update.
26
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
27
- var id = (0, _reactUid.uid)({
28
- iconGradientStart: colors.iconGradientStop
29
- });
30
24
  if (appearance) {
31
25
  colors = (0, _utils.getColorsFromAppearanceOldLogos)(appearance, colorMode);
32
26
  }
@@ -58,13 +52,14 @@ var JiraSoftwareIcon = exports.JiraSoftwareIcon = function JiraSoftwareIcon(_ref
58
52
  textColor = _ref2$textColor === void 0 ? _constants.defaultLogoParams.textColor : _ref2$textColor;
59
53
  var _useThemeObserver = (0, _tokens.useThemeObserver)(),
60
54
  colorMode = _useThemeObserver.colorMode;
55
+ var id = (0, _reactUid.useId)();
61
56
  return /*#__PURE__*/_react.default.createElement(_wrapper.default, {
62
57
  appearance: appearance,
63
58
  label: label,
64
59
  svg: svg({
65
60
  appearance: appearance,
66
61
  iconColor: iconColor
67
- }, colorMode),
62
+ }, colorMode, id),
68
63
  iconColor: iconColor,
69
64
  size: size,
70
65
  testId: testId,
@@ -6,14 +6,14 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.JiraSoftwareLogo = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
- var _reactUid = require("react-uid");
9
+ var _reactUid = require("@atlaskit/ds-lib/react-uid");
10
10
  var _tokens = require("@atlaskit/tokens");
11
11
  var _constants = require("../constants");
12
12
  var _utils = require("../utils");
13
13
  var _wrapper = _interopRequireDefault(require("../wrapper"));
14
14
  /* eslint-disable max-len */
15
15
 
16
- var svg = function svg(_ref, colorMode) {
16
+ var svg = function svg(_ref, colorMode, id) {
17
17
  var appearance = _ref.appearance,
18
18
  iconColor = _ref.iconColor,
19
19
  textColor = _ref.textColor;
@@ -23,12 +23,6 @@ var svg = function svg(_ref, colorMode) {
23
23
  iconColor: iconColor,
24
24
  textColor: textColor
25
25
  };
26
- // Will be fixed upon removal of deprecated iconGradientStart and
27
- // iconGradientStop props, or with React 18's useId() hook when we update.
28
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
29
- var id = (0, _reactUid.uid)({
30
- iconGradientStart: colors.iconGradientStop
31
- });
32
26
  if (appearance) {
33
27
  colors = (0, _utils.getColorsFromAppearanceOldLogos)(appearance, colorMode);
34
28
  }
@@ -60,6 +54,7 @@ var JiraSoftwareLogo = exports.JiraSoftwareLogo = function JiraSoftwareLogo(_ref
60
54
  textColor = _ref2$textColor === void 0 ? _constants.defaultLogoParams.textColor : _ref2$textColor;
61
55
  var _useThemeObserver = (0, _tokens.useThemeObserver)(),
62
56
  colorMode = _useThemeObserver.colorMode;
57
+ var id = (0, _reactUid.useId)();
63
58
  return /*#__PURE__*/_react.default.createElement(_wrapper.default, {
64
59
  appearance: appearance,
65
60
  label: label,
@@ -69,7 +64,7 @@ var JiraSoftwareLogo = exports.JiraSoftwareLogo = function JiraSoftwareLogo(_ref
69
64
  appearance: appearance,
70
65
  iconColor: iconColor,
71
66
  textColor: textColor
72
- }, colorMode),
67
+ }, colorMode, id),
73
68
  testId: testId,
74
69
  textColor: textColor
75
70
  });
@@ -6,14 +6,14 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.JiraWorkManagementIcon = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
- var _reactUid = require("react-uid");
9
+ var _reactUid = require("@atlaskit/ds-lib/react-uid");
10
10
  var _tokens = require("@atlaskit/tokens");
11
11
  var _constants = require("../constants");
12
12
  var _utils = require("../utils");
13
13
  var _wrapper = _interopRequireDefault(require("../wrapper"));
14
14
  /* eslint-disable max-len */
15
15
 
16
- var svg = function svg(_ref, colorMode) {
16
+ var svg = function svg(_ref, colorMode, id) {
17
17
  var appearance = _ref.appearance,
18
18
  iconColor = _ref.iconColor;
19
19
  var colors = {
@@ -21,12 +21,6 @@ var svg = function svg(_ref, colorMode) {
21
21
  iconGradientStop: _constants.legacyDefaultLogoParams.iconGradientStart,
22
22
  iconColor: iconColor
23
23
  };
24
- // Will be fixed upon removal of deprecated iconGradientStart and
25
- // iconGradientStop props, or with React 18's useId() hook when we update.
26
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
27
- var id = (0, _reactUid.uid)({
28
- iconGradientStart: colors.iconGradientStop
29
- });
30
24
  if (appearance) {
31
25
  colors = (0, _utils.getColorsFromAppearanceOldLogos)(appearance, colorMode);
32
26
  }
@@ -58,13 +52,14 @@ var JiraWorkManagementIcon = exports.JiraWorkManagementIcon = function JiraWorkM
58
52
  textColor = _ref2$textColor === void 0 ? _constants.defaultLogoParams.textColor : _ref2$textColor;
59
53
  var _useThemeObserver = (0, _tokens.useThemeObserver)(),
60
54
  colorMode = _useThemeObserver.colorMode;
55
+ var id = (0, _reactUid.useId)();
61
56
  return /*#__PURE__*/_react.default.createElement(_wrapper.default, {
62
57
  appearance: appearance,
63
58
  label: label,
64
59
  svg: svg({
65
60
  appearance: appearance,
66
61
  iconColor: iconColor
67
- }, colorMode),
62
+ }, colorMode, id),
68
63
  iconColor: iconColor,
69
64
  size: size,
70
65
  testId: testId,
@@ -6,14 +6,14 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.JiraWorkManagementLogo = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
- var _reactUid = require("react-uid");
9
+ var _reactUid = require("@atlaskit/ds-lib/react-uid");
10
10
  var _tokens = require("@atlaskit/tokens");
11
11
  var _constants = require("../constants");
12
12
  var _utils = require("../utils");
13
13
  var _wrapper = _interopRequireDefault(require("../wrapper"));
14
14
  /* eslint-disable max-len */
15
15
 
16
- var svg = function svg(_ref, colorMode) {
16
+ var svg = function svg(_ref, colorMode, id) {
17
17
  var appearance = _ref.appearance,
18
18
  iconColor = _ref.iconColor,
19
19
  textColor = _ref.textColor;
@@ -23,12 +23,6 @@ var svg = function svg(_ref, colorMode) {
23
23
  iconColor: iconColor,
24
24
  textColor: textColor
25
25
  };
26
- // Will be fixed upon removal of deprecated iconGradientStart and
27
- // iconGradientStop props, or with React 18's useId() hook when we update.
28
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
29
- var id = (0, _reactUid.uid)({
30
- iconGradientStart: colors.iconGradientStop
31
- });
32
26
  if (appearance) {
33
27
  colors = (0, _utils.getColorsFromAppearanceOldLogos)(appearance, colorMode);
34
28
  }
@@ -60,6 +54,7 @@ var JiraWorkManagementLogo = exports.JiraWorkManagementLogo = function JiraWorkM
60
54
  textColor = _ref2$textColor === void 0 ? _constants.defaultLogoParams.textColor : _ref2$textColor;
61
55
  var _useThemeObserver = (0, _tokens.useThemeObserver)(),
62
56
  colorMode = _useThemeObserver.colorMode;
57
+ var id = (0, _reactUid.useId)();
63
58
  return /*#__PURE__*/_react.default.createElement(_wrapper.default, {
64
59
  appearance: appearance,
65
60
  label: label,
@@ -70,7 +65,7 @@ var JiraWorkManagementLogo = exports.JiraWorkManagementLogo = function JiraWorkM
70
65
  size: size,
71
66
  iconColor: iconColor,
72
67
  textColor: textColor
73
- }, colorMode),
68
+ }, colorMode, id),
74
69
  testId: testId,
75
70
  textColor: textColor
76
71
  });
@@ -1,18 +1,13 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
7
7
  import Wrapper from '../wrapper';
8
8
  const svg = ({
9
9
  appearance
10
- }, colorMode) => {
11
- // Replace with React 18's useId() hook when we update.
12
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
13
- const id = uid({
14
- appearance
15
- });
10
+ }, colorMode, id) => {
16
11
  const colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
17
12
  return `<svg height="32" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
18
13
  <defs>
@@ -53,12 +48,13 @@ export const AtlassianAnalyticsIcon = ({
53
48
  const {
54
49
  colorMode
55
50
  } = useThemeObserver();
51
+ const id = useId();
56
52
  return /*#__PURE__*/React.createElement(Wrapper, {
57
53
  appearance: appearance,
58
54
  label: label,
59
55
  svg: svg({
60
56
  appearance
61
- }, colorMode),
57
+ }, colorMode, id),
62
58
  size: size,
63
59
  testId: testId
64
60
  });
@@ -1,19 +1,13 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
7
7
  import Wrapper from '../wrapper';
8
8
  const svg = ({
9
9
  appearance
10
- }, colorMode) => {
11
- // Will be fixed upon removal of deprecated iconGradientStart and
12
- // iconGradientStop props, or with React 18's useId() hook when we update.
13
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
14
- let id = uid({
15
- appearance
16
- });
10
+ }, colorMode, id) => {
17
11
  const colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
18
12
  return `
19
13
  <svg height="32" viewBox="0 0 477 48" xmlns="http://www.w3.org/2000/svg">
@@ -58,13 +52,14 @@ export const AtlassianAnalyticsLogo = ({
58
52
  const {
59
53
  colorMode
60
54
  } = useThemeObserver();
55
+ const id = useId();
61
56
  return /*#__PURE__*/React.createElement(Wrapper, {
62
57
  appearance: appearance,
63
58
  label: label,
64
59
  size: size,
65
60
  svg: svg({
66
61
  appearance
67
- }, colorMode),
62
+ }, colorMode, id),
68
63
  testId: testId
69
64
  });
70
65
  };
@@ -1,6 +1,6 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
@@ -9,7 +9,7 @@ const svg = ({
9
9
  appearance,
10
10
  iconColor,
11
11
  textColor
12
- }, colorMode) => {
12
+ }, colorMode, id) => {
13
13
  let colors = {
14
14
  iconGradientStart: legacyDefaultLogoParams.iconGradientStart,
15
15
  iconGradientStop: legacyDefaultLogoParams.iconGradientStart,
@@ -18,12 +18,6 @@ const svg = ({
18
18
  // We treat the word "Atlassian" differently to normal product logos, it has a bold brand look
19
19
  atlassianLogoTextColor: textColor
20
20
  };
21
- // Will be fixed upon removal of deprecated iconGradientStart and
22
- // iconGradientStop props, or with React 18's useId() hook when we update.
23
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
24
- let id = uid({
25
- iconGradientStart: colors.iconGradientStop
26
- });
27
21
  if (appearance) {
28
22
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
29
23
  }
@@ -92,6 +86,7 @@ export const AtlassianStartLogo = ({
92
86
  const {
93
87
  colorMode
94
88
  } = useThemeObserver();
89
+ const id = useId();
95
90
  return /*#__PURE__*/React.createElement(Wrapper, {
96
91
  appearance: appearance,
97
92
  label: label,
@@ -102,7 +97,7 @@ export const AtlassianStartLogo = ({
102
97
  label,
103
98
  iconColor,
104
99
  textColor
105
- }, colorMode),
100
+ }, colorMode, id),
106
101
  testId: testId,
107
102
  textColor: textColor
108
103
  });
@@ -1,6 +1,6 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
@@ -8,18 +8,12 @@ import Wrapper from '../wrapper';
8
8
  const svg = ({
9
9
  appearance,
10
10
  iconColor
11
- }, colorMode) => {
11
+ }, colorMode, id) => {
12
12
  let colors = {
13
13
  iconGradientStart: legacyDefaultLogoParams.iconGradientStart,
14
14
  iconGradientStop: legacyDefaultLogoParams.iconGradientStart,
15
15
  iconColor
16
16
  };
17
- // Will be fixed upon removal of deprecated iconGradientStart and
18
- // iconGradientStop props, or with React 18's useId() hook when we update.
19
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
20
- let id = uid({
21
- iconGradientStart: colors.iconGradientStop
22
- });
23
17
  if (appearance) {
24
18
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
25
19
  }
@@ -65,13 +59,14 @@ export const HalpIcon = ({
65
59
  const {
66
60
  colorMode
67
61
  } = useThemeObserver();
62
+ const id = useId();
68
63
  return /*#__PURE__*/React.createElement(Wrapper, {
69
64
  appearance: appearance,
70
65
  label: label,
71
66
  svg: svg({
72
67
  appearance,
73
68
  iconColor
74
- }, colorMode),
69
+ }, colorMode, id),
75
70
  iconColor: iconColor,
76
71
  size: size,
77
72
  testId: testId,
@@ -1,6 +1,6 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
@@ -9,19 +9,13 @@ const svg = ({
9
9
  appearance,
10
10
  iconColor,
11
11
  textColor
12
- }, colorMode) => {
12
+ }, colorMode, id) => {
13
13
  let colors = {
14
14
  iconGradientStart: legacyDefaultLogoParams.iconGradientStart,
15
15
  iconGradientStop: legacyDefaultLogoParams.iconGradientStart,
16
16
  iconColor,
17
17
  textColor
18
18
  };
19
- // Will be fixed upon removal of deprecated iconGradientStart and
20
- // iconGradientStop props, or with React 18's useId() hook when we update.
21
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
22
- let id = uid({
23
- iconGradientStart: colors.iconGradientStop
24
- });
25
19
  if (appearance) {
26
20
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
27
21
  }
@@ -86,6 +80,7 @@ export const HalpLogo = ({
86
80
  const {
87
81
  colorMode
88
82
  } = useThemeObserver();
83
+ const id = useId();
89
84
  return /*#__PURE__*/React.createElement(Wrapper, {
90
85
  appearance: appearance,
91
86
  label: label,
@@ -95,7 +90,7 @@ export const HalpLogo = ({
95
90
  appearance,
96
91
  iconColor,
97
92
  textColor
98
- }, colorMode),
93
+ }, colorMode, id),
99
94
  testId: testId,
100
95
  textColor: textColor
101
96
  });
@@ -1,6 +1,6 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
@@ -8,18 +8,12 @@ import Wrapper from '../wrapper';
8
8
  const svg = ({
9
9
  appearance,
10
10
  iconColor
11
- }, colorMode) => {
11
+ }, colorMode, id) => {
12
12
  let colors = {
13
13
  iconGradientStart: legacyDefaultLogoParams.iconGradientStart,
14
14
  iconGradientStop: legacyDefaultLogoParams.iconGradientStart,
15
15
  iconColor
16
16
  };
17
- // Will be fixed upon removal of deprecated iconGradientStart and
18
- // iconGradientStop props, or with React 18's useId() hook when we update.
19
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
20
- let id = uid({
21
- iconGradientStart: colors.iconGradientStop
22
- });
23
17
  if (appearance) {
24
18
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
25
19
  }
@@ -66,13 +60,14 @@ export const JiraSoftwareIcon = ({
66
60
  const {
67
61
  colorMode
68
62
  } = useThemeObserver();
63
+ const id = useId();
69
64
  return /*#__PURE__*/React.createElement(Wrapper, {
70
65
  appearance: appearance,
71
66
  label: label,
72
67
  svg: svg({
73
68
  appearance,
74
69
  iconColor
75
- }, colorMode),
70
+ }, colorMode, id),
76
71
  iconColor: iconColor,
77
72
  size: size,
78
73
  testId: testId,
@@ -1,6 +1,6 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
@@ -9,19 +9,13 @@ const svg = ({
9
9
  appearance,
10
10
  iconColor,
11
11
  textColor
12
- }, colorMode) => {
12
+ }, colorMode, id) => {
13
13
  let colors = {
14
14
  iconGradientStart: legacyDefaultLogoParams.iconGradientStart,
15
15
  iconGradientStop: legacyDefaultLogoParams.iconGradientStart,
16
16
  iconColor,
17
17
  textColor
18
18
  };
19
- // Will be fixed upon removal of deprecated iconGradientStart and
20
- // iconGradientStop props, or with React 18's useId() hook when we update.
21
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
22
- let id = uid({
23
- iconGradientStart: colors.iconGradientStop
24
- });
25
19
  if (appearance) {
26
20
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
27
21
  }
@@ -70,6 +64,7 @@ export const JiraSoftwareLogo = ({
70
64
  const {
71
65
  colorMode
72
66
  } = useThemeObserver();
67
+ const id = useId();
73
68
  return /*#__PURE__*/React.createElement(Wrapper, {
74
69
  appearance: appearance,
75
70
  label: label,
@@ -79,7 +74,7 @@ export const JiraSoftwareLogo = ({
79
74
  appearance,
80
75
  iconColor,
81
76
  textColor
82
- }, colorMode),
77
+ }, colorMode, id),
83
78
  testId: testId,
84
79
  textColor: textColor
85
80
  });
@@ -1,6 +1,6 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
@@ -8,18 +8,12 @@ import Wrapper from '../wrapper';
8
8
  const svg = ({
9
9
  appearance,
10
10
  iconColor
11
- }, colorMode) => {
11
+ }, colorMode, id) => {
12
12
  let colors = {
13
13
  iconGradientStart: legacyDefaultLogoParams.iconGradientStart,
14
14
  iconGradientStop: legacyDefaultLogoParams.iconGradientStart,
15
15
  iconColor
16
16
  };
17
- // Will be fixed upon removal of deprecated iconGradientStart and
18
- // iconGradientStop props, or with React 18's useId() hook when we update.
19
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
20
- let id = uid({
21
- iconGradientStart: colors.iconGradientStop
22
- });
23
17
  if (appearance) {
24
18
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
25
19
  }
@@ -75,13 +69,14 @@ export const JiraWorkManagementIcon = ({
75
69
  const {
76
70
  colorMode
77
71
  } = useThemeObserver();
72
+ const id = useId();
78
73
  return /*#__PURE__*/React.createElement(Wrapper, {
79
74
  appearance: appearance,
80
75
  label: label,
81
76
  svg: svg({
82
77
  appearance,
83
78
  iconColor
84
- }, colorMode),
79
+ }, colorMode, id),
85
80
  iconColor: iconColor,
86
81
  size: size,
87
82
  testId: testId,
@@ -1,6 +1,6 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
@@ -9,19 +9,13 @@ const svg = ({
9
9
  appearance,
10
10
  iconColor,
11
11
  textColor
12
- }, colorMode) => {
12
+ }, colorMode, id) => {
13
13
  let colors = {
14
14
  iconGradientStart: legacyDefaultLogoParams.iconGradientStart,
15
15
  iconGradientStop: legacyDefaultLogoParams.iconGradientStart,
16
16
  iconColor,
17
17
  textColor
18
18
  };
19
- // Will be fixed upon removal of deprecated iconGradientStart and
20
- // iconGradientStop props, or with React 18's useId() hook when we update.
21
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
22
- let id = uid({
23
- iconGradientStart: colors.iconGradientStop
24
- });
25
19
  if (appearance) {
26
20
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
27
21
  }
@@ -81,6 +75,7 @@ export const JiraWorkManagementLogo = ({
81
75
  const {
82
76
  colorMode
83
77
  } = useThemeObserver();
78
+ const id = useId();
84
79
  return /*#__PURE__*/React.createElement(Wrapper, {
85
80
  appearance: appearance,
86
81
  label: label,
@@ -91,7 +86,7 @@ export const JiraWorkManagementLogo = ({
91
86
  size,
92
87
  iconColor,
93
88
  textColor
94
- }, colorMode),
89
+ }, colorMode, id),
95
90
  testId: testId,
96
91
  textColor: textColor
97
92
  });
@@ -1,17 +1,12 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
7
7
  import Wrapper from '../wrapper';
8
- var svg = function svg(_ref, colorMode) {
8
+ var svg = function svg(_ref, colorMode, id) {
9
9
  var appearance = _ref.appearance;
10
- // Replace with React 18's useId() hook when we update.
11
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
12
- var id = uid({
13
- appearance: appearance
14
- });
15
10
  var colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
16
11
  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>");
17
12
  };
@@ -34,12 +29,13 @@ export var AtlassianAnalyticsIcon = function AtlassianAnalyticsIcon(_ref2) {
34
29
  testId = _ref2.testId;
35
30
  var _useThemeObserver = useThemeObserver(),
36
31
  colorMode = _useThemeObserver.colorMode;
32
+ var id = useId();
37
33
  return /*#__PURE__*/React.createElement(Wrapper, {
38
34
  appearance: appearance,
39
35
  label: label,
40
36
  svg: svg({
41
37
  appearance: appearance
42
- }, colorMode),
38
+ }, colorMode, id),
43
39
  size: size,
44
40
  testId: testId
45
41
  });
@@ -1,18 +1,12 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
7
7
  import Wrapper from '../wrapper';
8
- var svg = function svg(_ref, colorMode) {
8
+ var svg = function svg(_ref, colorMode, id) {
9
9
  var appearance = _ref.appearance;
10
- // Will be fixed upon removal of deprecated iconGradientStart and
11
- // iconGradientStop props, or with React 18's useId() hook when we update.
12
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
13
- var id = uid({
14
- appearance: appearance
15
- });
16
10
  var colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
17
11
  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>");
18
12
  };
@@ -35,13 +29,14 @@ export var AtlassianAnalyticsLogo = function AtlassianAnalyticsLogo(_ref2) {
35
29
  testId = _ref2.testId;
36
30
  var _useThemeObserver = useThemeObserver(),
37
31
  colorMode = _useThemeObserver.colorMode;
32
+ var id = useId();
38
33
  return /*#__PURE__*/React.createElement(Wrapper, {
39
34
  appearance: appearance,
40
35
  label: label,
41
36
  size: size,
42
37
  svg: svg({
43
38
  appearance: appearance
44
- }, colorMode),
39
+ }, colorMode, id),
45
40
  testId: testId
46
41
  });
47
42
  };
@@ -1,11 +1,11 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
7
7
  import Wrapper from '../wrapper';
8
- var svg = function svg(_ref, colorMode) {
8
+ var svg = function svg(_ref, colorMode, id) {
9
9
  var appearance = _ref.appearance,
10
10
  iconColor = _ref.iconColor,
11
11
  textColor = _ref.textColor;
@@ -17,12 +17,6 @@ var svg = function svg(_ref, colorMode) {
17
17
  // We treat the word "Atlassian" differently to normal product logos, it has a bold brand look
18
18
  atlassianLogoTextColor: textColor
19
19
  };
20
- // Will be fixed upon removal of deprecated iconGradientStart and
21
- // iconGradientStop props, or with React 18's useId() hook when we update.
22
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
23
- var id = uid({
24
- iconGradientStart: colors.iconGradientStop
25
- });
26
20
  if (appearance) {
27
21
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
28
22
  }
@@ -54,6 +48,7 @@ export var AtlassianStartLogo = function AtlassianStartLogo(_ref2) {
54
48
  textColor = _ref2$textColor === void 0 ? defaultLogoParams.textColor : _ref2$textColor;
55
49
  var _useThemeObserver = useThemeObserver(),
56
50
  colorMode = _useThemeObserver.colorMode;
51
+ var id = useId();
57
52
  return /*#__PURE__*/React.createElement(Wrapper, {
58
53
  appearance: appearance,
59
54
  label: label,
@@ -64,7 +59,7 @@ export var AtlassianStartLogo = function AtlassianStartLogo(_ref2) {
64
59
  label: label,
65
60
  iconColor: iconColor,
66
61
  textColor: textColor
67
- }, colorMode),
62
+ }, colorMode, id),
68
63
  testId: testId,
69
64
  textColor: textColor
70
65
  });
@@ -1,11 +1,11 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
7
7
  import Wrapper from '../wrapper';
8
- var svg = function svg(_ref, colorMode) {
8
+ var svg = function svg(_ref, colorMode, id) {
9
9
  var appearance = _ref.appearance,
10
10
  iconColor = _ref.iconColor;
11
11
  var colors = {
@@ -13,12 +13,6 @@ var svg = function svg(_ref, colorMode) {
13
13
  iconGradientStop: legacyDefaultLogoParams.iconGradientStart,
14
14
  iconColor: iconColor
15
15
  };
16
- // Will be fixed upon removal of deprecated iconGradientStart and
17
- // iconGradientStop props, or with React 18's useId() hook when we update.
18
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
19
- var id = uid({
20
- iconGradientStart: colors.iconGradientStop
21
- });
22
16
  if (appearance) {
23
17
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
24
18
  }
@@ -50,13 +44,14 @@ export var HalpIcon = function HalpIcon(_ref2) {
50
44
  iconColor = _ref2$iconColor === void 0 ? defaultLogoParams.iconColor : _ref2$iconColor;
51
45
  var _useThemeObserver = useThemeObserver(),
52
46
  colorMode = _useThemeObserver.colorMode;
47
+ var id = useId();
53
48
  return /*#__PURE__*/React.createElement(Wrapper, {
54
49
  appearance: appearance,
55
50
  label: label,
56
51
  svg: svg({
57
52
  appearance: appearance,
58
53
  iconColor: iconColor
59
- }, colorMode),
54
+ }, colorMode, id),
60
55
  iconColor: iconColor,
61
56
  size: size,
62
57
  testId: testId,
@@ -1,11 +1,11 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
7
7
  import Wrapper from '../wrapper';
8
- var svg = function svg(_ref, colorMode) {
8
+ var svg = function svg(_ref, colorMode, id) {
9
9
  var appearance = _ref.appearance,
10
10
  iconColor = _ref.iconColor,
11
11
  textColor = _ref.textColor;
@@ -15,12 +15,6 @@ var svg = function svg(_ref, colorMode) {
15
15
  iconColor: iconColor,
16
16
  textColor: textColor
17
17
  };
18
- // Will be fixed upon removal of deprecated iconGradientStart and
19
- // iconGradientStop props, or with React 18's useId() hook when we update.
20
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
21
- var id = uid({
22
- iconGradientStart: colors.iconGradientStop
23
- });
24
18
  if (appearance) {
25
19
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
26
20
  }
@@ -52,6 +46,7 @@ export var HalpLogo = function HalpLogo(_ref2) {
52
46
  textColor = _ref2$textColor === void 0 ? defaultLogoParams.textColor : _ref2$textColor;
53
47
  var _useThemeObserver = useThemeObserver(),
54
48
  colorMode = _useThemeObserver.colorMode;
49
+ var id = useId();
55
50
  return /*#__PURE__*/React.createElement(Wrapper, {
56
51
  appearance: appearance,
57
52
  label: label,
@@ -61,7 +56,7 @@ export var HalpLogo = function HalpLogo(_ref2) {
61
56
  appearance: appearance,
62
57
  iconColor: iconColor,
63
58
  textColor: textColor
64
- }, colorMode),
59
+ }, colorMode, id),
65
60
  testId: testId,
66
61
  textColor: textColor
67
62
  });
@@ -1,11 +1,11 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
7
7
  import Wrapper from '../wrapper';
8
- var svg = function svg(_ref, colorMode) {
8
+ var svg = function svg(_ref, colorMode, id) {
9
9
  var appearance = _ref.appearance,
10
10
  iconColor = _ref.iconColor;
11
11
  var colors = {
@@ -13,12 +13,6 @@ var svg = function svg(_ref, colorMode) {
13
13
  iconGradientStop: legacyDefaultLogoParams.iconGradientStart,
14
14
  iconColor: iconColor
15
15
  };
16
- // Will be fixed upon removal of deprecated iconGradientStart and
17
- // iconGradientStop props, or with React 18's useId() hook when we update.
18
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
19
- var id = uid({
20
- iconGradientStart: colors.iconGradientStop
21
- });
22
16
  if (appearance) {
23
17
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
24
18
  }
@@ -50,13 +44,14 @@ export var JiraSoftwareIcon = function JiraSoftwareIcon(_ref2) {
50
44
  textColor = _ref2$textColor === void 0 ? defaultLogoParams.textColor : _ref2$textColor;
51
45
  var _useThemeObserver = useThemeObserver(),
52
46
  colorMode = _useThemeObserver.colorMode;
47
+ var id = useId();
53
48
  return /*#__PURE__*/React.createElement(Wrapper, {
54
49
  appearance: appearance,
55
50
  label: label,
56
51
  svg: svg({
57
52
  appearance: appearance,
58
53
  iconColor: iconColor
59
- }, colorMode),
54
+ }, colorMode, id),
60
55
  iconColor: iconColor,
61
56
  size: size,
62
57
  testId: testId,
@@ -1,11 +1,11 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
7
7
  import Wrapper from '../wrapper';
8
- var svg = function svg(_ref, colorMode) {
8
+ var svg = function svg(_ref, colorMode, id) {
9
9
  var appearance = _ref.appearance,
10
10
  iconColor = _ref.iconColor,
11
11
  textColor = _ref.textColor;
@@ -15,12 +15,6 @@ var svg = function svg(_ref, colorMode) {
15
15
  iconColor: iconColor,
16
16
  textColor: textColor
17
17
  };
18
- // Will be fixed upon removal of deprecated iconGradientStart and
19
- // iconGradientStop props, or with React 18's useId() hook when we update.
20
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
21
- var id = uid({
22
- iconGradientStart: colors.iconGradientStop
23
- });
24
18
  if (appearance) {
25
19
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
26
20
  }
@@ -52,6 +46,7 @@ export var JiraSoftwareLogo = function JiraSoftwareLogo(_ref2) {
52
46
  textColor = _ref2$textColor === void 0 ? defaultLogoParams.textColor : _ref2$textColor;
53
47
  var _useThemeObserver = useThemeObserver(),
54
48
  colorMode = _useThemeObserver.colorMode;
49
+ var id = useId();
55
50
  return /*#__PURE__*/React.createElement(Wrapper, {
56
51
  appearance: appearance,
57
52
  label: label,
@@ -61,7 +56,7 @@ export var JiraSoftwareLogo = function JiraSoftwareLogo(_ref2) {
61
56
  appearance: appearance,
62
57
  iconColor: iconColor,
63
58
  textColor: textColor
64
- }, colorMode),
59
+ }, colorMode, id),
65
60
  testId: testId,
66
61
  textColor: textColor
67
62
  });
@@ -1,11 +1,11 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
7
7
  import Wrapper from '../wrapper';
8
- var svg = function svg(_ref, colorMode) {
8
+ var svg = function svg(_ref, colorMode, id) {
9
9
  var appearance = _ref.appearance,
10
10
  iconColor = _ref.iconColor;
11
11
  var colors = {
@@ -13,12 +13,6 @@ var svg = function svg(_ref, colorMode) {
13
13
  iconGradientStop: legacyDefaultLogoParams.iconGradientStart,
14
14
  iconColor: iconColor
15
15
  };
16
- // Will be fixed upon removal of deprecated iconGradientStart and
17
- // iconGradientStop props, or with React 18's useId() hook when we update.
18
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
19
- var id = uid({
20
- iconGradientStart: colors.iconGradientStop
21
- });
22
16
  if (appearance) {
23
17
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
24
18
  }
@@ -50,13 +44,14 @@ export var JiraWorkManagementIcon = function JiraWorkManagementIcon(_ref2) {
50
44
  textColor = _ref2$textColor === void 0 ? defaultLogoParams.textColor : _ref2$textColor;
51
45
  var _useThemeObserver = useThemeObserver(),
52
46
  colorMode = _useThemeObserver.colorMode;
47
+ var id = useId();
53
48
  return /*#__PURE__*/React.createElement(Wrapper, {
54
49
  appearance: appearance,
55
50
  label: label,
56
51
  svg: svg({
57
52
  appearance: appearance,
58
53
  iconColor: iconColor
59
- }, colorMode),
54
+ }, colorMode, id),
60
55
  iconColor: iconColor,
61
56
  size: size,
62
57
  testId: testId,
@@ -1,11 +1,11 @@
1
1
  /* eslint-disable max-len */
2
2
  import React from 'react';
3
- import { uid } from 'react-uid';
3
+ import { useId } from '@atlaskit/ds-lib/react-uid';
4
4
  import { useThemeObserver } from '@atlaskit/tokens';
5
5
  import { defaultLogoParams, legacyDefaultLogoParams } from '../constants';
6
6
  import { getColorsFromAppearanceOldLogos } from '../utils';
7
7
  import Wrapper from '../wrapper';
8
- var svg = function svg(_ref, colorMode) {
8
+ var svg = function svg(_ref, colorMode, id) {
9
9
  var appearance = _ref.appearance,
10
10
  iconColor = _ref.iconColor,
11
11
  textColor = _ref.textColor;
@@ -15,12 +15,6 @@ var svg = function svg(_ref, colorMode) {
15
15
  iconColor: iconColor,
16
16
  textColor: textColor
17
17
  };
18
- // Will be fixed upon removal of deprecated iconGradientStart and
19
- // iconGradientStop props, or with React 18's useId() hook when we update.
20
- // eslint-disable-next-line @repo/internal/react/disallow-unstable-values
21
- var id = uid({
22
- iconGradientStart: colors.iconGradientStop
23
- });
24
18
  if (appearance) {
25
19
  colors = getColorsFromAppearanceOldLogos(appearance, colorMode);
26
20
  }
@@ -52,6 +46,7 @@ export var JiraWorkManagementLogo = function JiraWorkManagementLogo(_ref2) {
52
46
  textColor = _ref2$textColor === void 0 ? defaultLogoParams.textColor : _ref2$textColor;
53
47
  var _useThemeObserver = useThemeObserver(),
54
48
  colorMode = _useThemeObserver.colorMode;
49
+ var id = useId();
55
50
  return /*#__PURE__*/React.createElement(Wrapper, {
56
51
  appearance: appearance,
57
52
  label: label,
@@ -62,7 +57,7 @@ export var JiraWorkManagementLogo = function JiraWorkManagementLogo(_ref2) {
62
57
  size: size,
63
58
  iconColor: iconColor,
64
59
  textColor: textColor
65
- }, colorMode),
60
+ }, colorMode, id),
66
61
  testId: testId,
67
62
  textColor: textColor
68
63
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/logo",
3
- "version": "14.2.0",
3
+ "version": "14.2.2",
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/"
@@ -27,18 +27,17 @@
27
27
  "runReact18": true
28
28
  },
29
29
  "dependencies": {
30
- "@atlaskit/theme": "^12.12.0",
31
- "@atlaskit/tokens": "^1.58.0",
30
+ "@atlaskit/ds-lib": "^2.5.0",
31
+ "@atlaskit/theme": "^13.0.0",
32
+ "@atlaskit/tokens": "^1.59.0",
32
33
  "@babel/runtime": "^7.0.0",
33
- "@emotion/react": "^11.7.1",
34
- "react-uid": "^2.2.0"
34
+ "@emotion/react": "^11.7.1"
35
35
  },
36
36
  "peerDependencies": {
37
37
  "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
38
38
  },
39
39
  "devDependencies": {
40
40
  "@af/accessibility-testing": "*",
41
- "@atlaskit/ds-lib": "^2.4.0",
42
41
  "@atlaskit/ssr": "*",
43
42
  "@atlaskit/visual-regression": "*",
44
43
  "@testing-library/react": "^12.1.5",