@atlaskit/mention 24.6.0 → 24.6.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.
Files changed (27) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/afm-cc/tsconfig.json +0 -3
  3. package/dist/cjs/components/Mention/PrimitiveMention.js +10 -11
  4. package/dist/cjs/components/MentionDescriptionByline/styles.js +2 -3
  5. package/dist/cjs/components/MentionItem/index.js +1 -1
  6. package/dist/cjs/components/MentionItem/styles.js +4 -5
  7. package/dist/cjs/components/MentionList/styles.js +1 -1
  8. package/dist/cjs/components/MentionPicker/styles.js +2 -3
  9. package/dist/cjs/components/Scrollable/styles.js +1 -1
  10. package/dist/cjs/shared-styles.js +2 -3
  11. package/dist/es2019/components/Mention/PrimitiveMention.js +10 -11
  12. package/dist/es2019/components/MentionDescriptionByline/styles.js +2 -3
  13. package/dist/es2019/components/MentionItem/index.js +1 -1
  14. package/dist/es2019/components/MentionItem/styles.js +4 -5
  15. package/dist/es2019/components/MentionList/styles.js +1 -1
  16. package/dist/es2019/components/MentionPicker/styles.js +2 -3
  17. package/dist/es2019/components/Scrollable/styles.js +1 -1
  18. package/dist/es2019/shared-styles.js +2 -3
  19. package/dist/esm/components/Mention/PrimitiveMention.js +10 -11
  20. package/dist/esm/components/MentionDescriptionByline/styles.js +2 -3
  21. package/dist/esm/components/MentionItem/index.js +1 -1
  22. package/dist/esm/components/MentionItem/styles.js +4 -5
  23. package/dist/esm/components/MentionList/styles.js +1 -1
  24. package/dist/esm/components/MentionPicker/styles.js +2 -3
  25. package/dist/esm/components/Scrollable/styles.js +1 -1
  26. package/dist/esm/shared-styles.js +2 -3
  27. package/package.json +6 -7
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # @atlaskit/mention
2
2
 
3
+ ## 24.6.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [`608c375f6f9b9`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/608c375f6f9b9) -
8
+ Internal changes to remove unnecessary token fallbacks and imports from `@atlaskit/theme`
9
+
3
10
  ## 24.6.0
4
11
 
5
12
  ### Minor Changes
package/afm-cc/tsconfig.json CHANGED
@@ -56,9 +56,6 @@
56
56
  {
57
57
  "path": "../../../people-and-teams/teams-avatar/afm-cc/tsconfig.json"
58
58
  },
59
- {
60
- "path": "../../../design-system/theme/afm-cc/tsconfig.json"
61
- },
62
59
  {
63
60
  "path": "../../../design-system/tokens/afm-cc/tsconfig.json"
64
61
  },
package/dist/cjs/components/Mention/PrimitiveMention.js CHANGED
@@ -10,7 +10,6 @@ var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/hel
10
10
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
11
11
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
12
12
  var _react = require("@emotion/react");
13
- var _colors = require("@atlaskit/theme/colors");
14
13
  var _types = require("../../types");
15
14
  var _react2 = require("react");
16
15
  var _templateObject;
@@ -22,23 +21,23 @@ var _excluded = ["mentionType"];
22
21
  */
23
22
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
24
23
  var mentionStyle = (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _types.MentionType.SELF, {
25
- background: "var(--ds-background-brand-bold, ".concat(_colors.B400, ")"),
24
+ background: "var(--ds-background-brand-bold, #1868DB)",
26
25
  borderColor: 'transparent',
27
- text: "var(--ds-text-inverse, ".concat(_colors.N20, ")"),
28
- hoveredBackground: "var(--ds-background-brand-bold-hovered, ".concat(_colors.B400, ")"),
29
- pressedBackground: "var(--ds-background-brand-bold-pressed, ".concat(_colors.B400, ")")
26
+ text: "var(--ds-text-inverse, #FFFFFF)",
27
+ hoveredBackground: "var(--ds-background-brand-bold-hovered, #1558BC)",
28
+ pressedBackground: "var(--ds-background-brand-bold-pressed, #144794)"
30
29
  }), _types.MentionType.RESTRICTED, {
31
30
  background: 'transparent',
32
- borderColor: "var(--ds-border-bold, ".concat(_colors.N500, ")"),
33
- text: "var(--ds-text, ".concat(_colors.N500, ")"),
31
+ borderColor: "var(--ds-border-bold, #7D818A)",
32
+ text: "var(--ds-text, #292A2E)",
34
33
  hoveredBackground: 'transparent',
35
34
  pressedBackground: 'transparent'
36
35
  }), _types.MentionType.DEFAULT, {
37
- background: "var(--ds-background-neutral, ".concat(_colors.N30A, ")"),
36
+ background: "var(--ds-background-neutral, #0515240F)",
38
37
  borderColor: 'transparent',
39
- text: "var(--ds-text-subtle, ".concat(_colors.N500, ")"),
40
- hoveredBackground: "var(--ds-background-neutral-hovered, ".concat(_colors.N30A, ")"),
41
- pressedBackground: "var(--ds-background-neutral-pressed, ".concat(_colors.N30A, ")")
38
+ text: "var(--ds-text-subtle, #505258)",
39
+ hoveredBackground: "var(--ds-background-neutral-hovered, #0B120E24)",
40
+ pressedBackground: "var(--ds-background-neutral-pressed, #080F214A)"
42
41
  });
43
42
  var getStyle = function getStyle(_ref, property) {
44
43
  var mentionType = _ref.mentionType;
package/dist/cjs/components/MentionDescriptionByline/styles.js CHANGED
@@ -6,15 +6,14 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.DescriptionBylineStyle = void 0;
8
8
  var _styled = _interopRequireDefault(require("@emotion/styled"));
9
- var _colors = require("@atlaskit/theme/colors");
10
9
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
11
10
 
12
11
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
13
12
 
14
13
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
15
14
  var DescriptionBylineStyle = exports.DescriptionBylineStyle = _styled.default.span({
16
- color: "var(--ds-text-subtlest, ".concat(_colors.N100, ")"),
17
- font: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
15
+ color: "var(--ds-text-subtlest, #6B6E76)",
16
+ font: "var(--ds-font-body-small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
18
17
  marginTop: "var(--ds-space-025, 2px)",
19
18
  display: 'block',
20
19
  overflow: 'hidden',
package/dist/cjs/components/MentionItem/index.js CHANGED
@@ -132,7 +132,7 @@ var MentionItem = exports.default = /*#__PURE__*/function (_React$PureComponent)
132
132
  time = _ref.time;
133
133
  var restricted = (0, _types.isRestricted)(accessLevel);
134
134
  var nameHighlights = highlight && highlight.name;
135
- var xProductUserInfoIconColor = selected ? "var(--ds-icon-selected, #0C66E4)" : "var(--ds-icon, #44546F)";
135
+ var xProductUserInfoIconColor = selected ? "var(--ds-icon-selected, #1868DB)" : "var(--ds-icon, #292A2E)";
136
136
  return /*#__PURE__*/_react.default.createElement(_MessagesIntlProvider.default, null, /*#__PURE__*/_react.default.createElement(_styles.MentionItemStyle, {
137
137
  selected: selected,
138
138
  onMouseDown: this.onMentionSelected,
package/dist/cjs/components/MentionItem/styles.js CHANGED
@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.TimeStyle = exports.RowStyle = exports.NameSectionStyle = exports.MentionItemStyle = exports.MENTION_ITEM_HEIGHT = exports.InfoSectionStyle = exports.FullNameStyle = exports.AvatarStyle = exports.AccessSectionStyle = void 0;
8
8
  var _styled = _interopRequireDefault(require("@emotion/styled"));
9
9
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
10
- var _colors = require("@atlaskit/theme/colors");
11
10
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
12
11
 
13
12
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
@@ -51,7 +50,7 @@ var FullNameStyle = exports.FullNameStyle = _styled.default.span({
51
50
  overflow: 'hidden',
52
51
  textOverflow: 'ellipsis',
53
52
  whiteSpace: 'nowrap',
54
- color: "var(--ds-text, ".concat(_colors.N900, ")")
53
+ color: "var(--ds-text, #292A2E)"
55
54
  });
56
55
 
57
56
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
@@ -80,7 +79,7 @@ var InfoSectionStyle = exports.InfoSectionStyle = _styled.default.div(function (
80
79
  var TimeStyle = exports.TimeStyle = _styled.default.div({
81
80
  marginLeft: "var(--ds-space-250, 20px)",
82
81
  flex: 'none',
83
- color: "var(--ds-text-subtlest, ".concat(_colors.N100, ")"),
82
+ color: "var(--ds-text-subtlest, #6B6E76)",
84
83
  font: "var(--ds-font-body-small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)"
85
84
  });
86
85
  var MENTION_ITEM_HEIGHT = exports.MENTION_ITEM_HEIGHT = 48;
@@ -88,7 +87,7 @@ var MENTION_ITEM_HEIGHT = exports.MENTION_ITEM_HEIGHT = 48;
88
87
  var MentionItemStyle = exports.MentionItemStyle = _styled.default.div(function (props) {
89
88
  return {
90
89
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
91
- backgroundColor: props.selected ? "var(--ds-background-selected, ".concat(_colors.N30, ")") : 'transparent',
90
+ backgroundColor: props.selected ? "var(--ds-background-selected, #E9F2FE)" : 'transparent',
92
91
  display: 'block',
93
92
  overflow: 'hidden',
94
93
  listStyleType: 'none',
@@ -102,5 +101,5 @@ var MentionItemStyle = exports.MentionItemStyle = _styled.default.div(function (
102
101
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
103
102
  var AccessSectionStyle = exports.AccessSectionStyle = _styled.default.div({
104
103
  paddingLeft: "var(--ds-space-050, 4px)",
105
- color: "var(--ds-text-subtle, ".concat(_colors.N500, ")")
104
+ color: "var(--ds-text-subtle, #505258)"
106
105
  });
package/dist/cjs/components/MentionList/styles.js CHANGED
@@ -19,7 +19,7 @@ var MentionListStyle = exports.MentionListStyle = _styled.default.div(function (
19
19
  /* list style */
20
20
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
21
21
  width: _sharedStyles.mentionListWidth,
22
- color: "var(--ds-text-subtle, #333)",
22
+ color: "var(--ds-text-subtle, #505258)",
23
23
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
24
24
  border: "1px solid ".concat(_sharedStyles.noDialogContainerBorderColor),
25
25
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
package/dist/cjs/components/MentionPicker/styles.js CHANGED
@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.MentionPickerStyle = exports.MentionPickerInfoStyle = void 0;
8
8
  var _styled = _interopRequireDefault(require("@emotion/styled"));
9
- var _colors = require("@atlaskit/theme/colors");
10
9
  var _sharedStyles = require("../../shared-styles");
11
10
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
12
11
 
@@ -22,8 +21,8 @@ var MentionPickerStyle = exports.MentionPickerStyle = _styled.default.div(functi
22
21
 
23
22
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
24
23
  var MentionPickerInfoStyle = exports.MentionPickerInfoStyle = _styled.default.div({
25
- background: "var(--ds-surface, #fff)",
26
- color: "var(--ds-text-subtlest, ".concat(_colors.N100, ")"),
24
+ background: "var(--ds-surface, #FFFFFF)",
25
+ color: "var(--ds-text-subtlest, #6B6E76)",
27
26
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
28
27
  border: "1px solid ".concat(_sharedStyles.noDialogContainerBorderColor),
29
28
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
package/dist/cjs/components/Scrollable/styles.js CHANGED
@@ -18,7 +18,7 @@ var ScrollableStyle = exports.ScrollableStyle = _styled.default.div({
18
18
  overflowY: 'auto',
19
19
  padding: "var(--ds-space-050, 4px)".concat(" 0"),
20
20
  margin: 0,
21
- background: "var(--ds-surface, white)",
21
+ background: "var(--ds-surface, #FFFFFF)",
22
22
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
23
23
  maxHeight: _sharedStyles.scrollableMaxHeight,
24
24
  borderRadius: "var(--ds-radius-small, 3px)"
package/dist/cjs/shared-styles.js CHANGED
@@ -4,10 +4,9 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.scrollableMaxHeight = exports.noDialogContainerBoxShadow = exports.noDialogContainerBorderRadius = exports.noDialogContainerBorderColor = exports.mentionListWidth = void 0;
7
- var _colors = require("@atlaskit/theme/colors");
8
- var noDialogContainerBorderColor = exports.noDialogContainerBorderColor = "var(--ds-border, ".concat(_colors.N40, ")"); // This has not been confirmed by the ADG yet
7
+ var noDialogContainerBorderColor = exports.noDialogContainerBorderColor = "var(--ds-border, #0B120E24)"; // This has not been confirmed by the ADG yet
9
8
  var noDialogContainerBorderRadius = exports.noDialogContainerBorderRadius = "var(--ds-radius-small, 3px)";
10
- var noDialogContainerBoxShadow = exports.noDialogContainerBoxShadow = "var(--ds-shadow-overlay, 0 4px 8px -2px rgba(9, 30, 66, 0.25), 0 0 1px rgba(9, 30, 66, 0.31))"; // Copied from droplist style
9
+ var noDialogContainerBoxShadow = exports.noDialogContainerBoxShadow = "var(--ds-shadow-overlay, 0px 8px 12px #1E1F2126, 0px 0px 1px #1E1F214f)"; // Copied from droplist style
11
10
 
12
11
  var scrollableMaxHeight = exports.scrollableMaxHeight = '264px';
13
12
  var mentionListWidth = exports.mentionListWidth = '340px';
package/dist/es2019/components/Mention/PrimitiveMention.js CHANGED
@@ -6,30 +6,29 @@ import _extends from "@babel/runtime/helpers/extends";
6
6
  */
7
7
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
8
8
  import { jsx, css } from '@emotion/react';
9
- import { B400, N500, N30A, N20 } from '@atlaskit/theme/colors';
10
9
  import { MentionType } from '../../types';
11
10
  import { forwardRef } from 'react';
12
11
  const mentionStyle = {
13
12
  [MentionType.SELF]: {
14
- background: `var(--ds-background-brand-bold, ${B400})`,
13
+ background: "var(--ds-background-brand-bold, #1868DB)",
15
14
  borderColor: 'transparent',
16
- text: `var(--ds-text-inverse, ${N20})`,
17
- hoveredBackground: `var(--ds-background-brand-bold-hovered, ${B400})`,
18
- pressedBackground: `var(--ds-background-brand-bold-pressed, ${B400})`
15
+ text: "var(--ds-text-inverse, #FFFFFF)",
16
+ hoveredBackground: "var(--ds-background-brand-bold-hovered, #1558BC)",
17
+ pressedBackground: "var(--ds-background-brand-bold-pressed, #144794)"
19
18
  },
20
19
  [MentionType.RESTRICTED]: {
21
20
  background: 'transparent',
22
- borderColor: `var(--ds-border-bold, ${N500})`,
23
- text: `var(--ds-text, ${N500})`,
21
+ borderColor: "var(--ds-border-bold, #7D818A)",
22
+ text: "var(--ds-text, #292A2E)",
24
23
  hoveredBackground: 'transparent',
25
24
  pressedBackground: 'transparent'
26
25
  },
27
26
  [MentionType.DEFAULT]: {
28
- background: `var(--ds-background-neutral, ${N30A})`,
27
+ background: "var(--ds-background-neutral, #0515240F)",
29
28
  borderColor: 'transparent',
30
- text: `var(--ds-text-subtle, ${N500})`,
31
- hoveredBackground: `var(--ds-background-neutral-hovered, ${N30A})`,
32
- pressedBackground: `var(--ds-background-neutral-pressed, ${N30A})`
29
+ text: "var(--ds-text-subtle, #505258)",
30
+ hoveredBackground: "var(--ds-background-neutral-hovered, #0B120E24)",
31
+ pressedBackground: "var(--ds-background-neutral-pressed, #080F214A)"
33
32
  }
34
33
  };
35
34
  const getStyle = ({
package/dist/es2019/components/MentionDescriptionByline/styles.js CHANGED
@@ -2,11 +2,10 @@
2
2
  import styled from '@emotion/styled';
3
3
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
4
4
 
5
- import { N100 } from '@atlaskit/theme/colors';
6
5
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
7
6
  export const DescriptionBylineStyle = styled.span({
8
- color: `var(--ds-text-subtlest, ${N100})`,
9
- font: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
7
+ color: "var(--ds-text-subtlest, #6B6E76)",
8
+ font: "var(--ds-font-body-small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
10
9
  marginTop: "var(--ds-space-025, 2px)",
11
10
  display: 'block',
12
11
  overflow: 'hidden',
package/dist/es2019/components/MentionItem/index.js CHANGED
@@ -111,7 +111,7 @@ export default class MentionItem extends React.PureComponent {
111
111
  } = presence || {};
112
112
  const restricted = isRestricted(accessLevel);
113
113
  const nameHighlights = highlight && highlight.name;
114
- const xProductUserInfoIconColor = selected ? "var(--ds-icon-selected, #0C66E4)" : "var(--ds-icon, #44546F)";
114
+ const xProductUserInfoIconColor = selected ? "var(--ds-icon-selected, #1868DB)" : "var(--ds-icon, #292A2E)";
115
115
  return /*#__PURE__*/React.createElement(MessagesIntlProvider, null, /*#__PURE__*/React.createElement(MentionItemStyle, {
116
116
  selected: selected,
117
117
  onMouseDown: this.onMentionSelected,
package/dist/es2019/components/MentionItem/styles.js CHANGED
@@ -3,7 +3,6 @@ import styled from '@emotion/styled';
3
3
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
4
4
 
5
5
  import { fg } from '@atlaskit/platform-feature-flags';
6
- import { N900, N100, N30, N500 } from '@atlaskit/theme/colors';
7
6
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
8
7
  export const RowStyle = styled.div({
9
8
  alignItems: 'center',
@@ -39,7 +38,7 @@ export const FullNameStyle = styled.span({
39
38
  overflow: 'hidden',
40
39
  textOverflow: 'ellipsis',
41
40
  whiteSpace: 'nowrap',
42
- color: `var(--ds-text, ${N900})`
41
+ color: "var(--ds-text, #292A2E)"
43
42
  });
44
43
 
45
44
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
@@ -66,14 +65,14 @@ export const InfoSectionStyle = styled.div(props => ({
66
65
  export const TimeStyle = styled.div({
67
66
  marginLeft: "var(--ds-space-250, 20px)",
68
67
  flex: 'none',
69
- color: `var(--ds-text-subtlest, ${N100})`,
68
+ color: "var(--ds-text-subtlest, #6B6E76)",
70
69
  font: "var(--ds-font-body-small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)"
71
70
  });
72
71
  export const MENTION_ITEM_HEIGHT = 48;
73
72
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
74
73
  export const MentionItemStyle = styled.div(props => ({
75
74
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
76
- backgroundColor: props.selected ? `var(--ds-background-selected, ${N30})` : 'transparent',
75
+ backgroundColor: props.selected ? "var(--ds-background-selected, #E9F2FE)" : 'transparent',
77
76
  display: 'block',
78
77
  overflow: 'hidden',
79
78
  listStyleType: 'none',
@@ -86,5 +85,5 @@ export const MentionItemStyle = styled.div(props => ({
86
85
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
87
86
  export const AccessSectionStyle = styled.div({
88
87
  paddingLeft: "var(--ds-space-050, 4px)",
89
- color: `var(--ds-text-subtle, ${N500})`
88
+ color: "var(--ds-text-subtle, #505258)"
90
89
  });
package/dist/es2019/components/MentionList/styles.js CHANGED
@@ -10,7 +10,7 @@ export const MentionListStyle = styled.div(props => ({
10
10
  /* list style */
11
11
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
12
12
  width: mentionListWidth,
13
- color: "var(--ds-text-subtle, #333)",
13
+ color: "var(--ds-text-subtle, #505258)",
14
14
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
15
15
  border: `1px solid ${noDialogContainerBorderColor}`,
16
16
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
package/dist/es2019/components/MentionPicker/styles.js CHANGED
@@ -2,7 +2,6 @@
2
2
  import styled from '@emotion/styled';
3
3
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
4
4
 
5
- import { N100 } from '@atlaskit/theme/colors';
6
5
  import { mentionListWidth, noDialogContainerBorderColor, noDialogContainerBorderRadius, noDialogContainerBoxShadow } from '../../shared-styles';
7
6
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
8
7
  export const MentionPickerStyle = styled.div(props => ({
@@ -12,8 +11,8 @@ export const MentionPickerStyle = styled.div(props => ({
12
11
 
13
12
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
14
13
  export const MentionPickerInfoStyle = styled.div({
15
- background: "var(--ds-surface, #fff)",
16
- color: `var(--ds-text-subtlest, ${N100})`,
14
+ background: "var(--ds-surface, #FFFFFF)",
15
+ color: "var(--ds-text-subtlest, #6B6E76)",
17
16
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
18
17
  border: `1px solid ${noDialogContainerBorderColor}`,
19
18
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
package/dist/es2019/components/Scrollable/styles.js CHANGED
@@ -10,7 +10,7 @@ export const ScrollableStyle = styled.div({
10
10
  overflowY: 'auto',
11
11
  padding: `${"var(--ds-space-050, 4px)"} 0`,
12
12
  margin: 0,
13
- background: "var(--ds-surface, white)",
13
+ background: "var(--ds-surface, #FFFFFF)",
14
14
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
15
15
  maxHeight: scrollableMaxHeight,
16
16
  borderRadius: "var(--ds-radius-small, 3px)"
package/dist/es2019/shared-styles.js CHANGED
@@ -1,7 +1,6 @@
1
- import { N40 } from '@atlaskit/theme/colors';
2
- export const noDialogContainerBorderColor = `var(--ds-border, ${N40})`; // This has not been confirmed by the ADG yet
1
+ export const noDialogContainerBorderColor = "var(--ds-border, #0B120E24)"; // This has not been confirmed by the ADG yet
3
2
  export const noDialogContainerBorderRadius = "var(--ds-radius-small, 3px)";
4
- export const noDialogContainerBoxShadow = "var(--ds-shadow-overlay, 0 4px 8px -2px rgba(9, 30, 66, 0.25), 0 0 1px rgba(9, 30, 66, 0.31))"; // Copied from droplist style
3
+ export const noDialogContainerBoxShadow = "var(--ds-shadow-overlay, 0px 8px 12px #1E1F2126, 0px 0px 1px #1E1F214f)"; // Copied from droplist style
5
4
 
6
5
  export const scrollableMaxHeight = '264px';
7
6
  export const mentionListWidth = '340px';
package/dist/esm/components/Mention/PrimitiveMention.js CHANGED
@@ -11,27 +11,26 @@ var _excluded = ["mentionType"];
11
11
  */
12
12
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
13
13
  import { jsx, css } from '@emotion/react';
14
- import { B400, N500, N30A, N20 } from '@atlaskit/theme/colors';
15
14
  import { MentionType } from '../../types';
16
15
  import { forwardRef } from 'react';
17
16
  var mentionStyle = _defineProperty(_defineProperty(_defineProperty({}, MentionType.SELF, {
18
- background: "var(--ds-background-brand-bold, ".concat(B400, ")"),
17
+ background: "var(--ds-background-brand-bold, #1868DB)",
19
18
  borderColor: 'transparent',
20
- text: "var(--ds-text-inverse, ".concat(N20, ")"),
21
- hoveredBackground: "var(--ds-background-brand-bold-hovered, ".concat(B400, ")"),
22
- pressedBackground: "var(--ds-background-brand-bold-pressed, ".concat(B400, ")")
19
+ text: "var(--ds-text-inverse, #FFFFFF)",
20
+ hoveredBackground: "var(--ds-background-brand-bold-hovered, #1558BC)",
21
+ pressedBackground: "var(--ds-background-brand-bold-pressed, #144794)"
23
22
  }), MentionType.RESTRICTED, {
24
23
  background: 'transparent',
25
- borderColor: "var(--ds-border-bold, ".concat(N500, ")"),
26
- text: "var(--ds-text, ".concat(N500, ")"),
24
+ borderColor: "var(--ds-border-bold, #7D818A)",
25
+ text: "var(--ds-text, #292A2E)",
27
26
  hoveredBackground: 'transparent',
28
27
  pressedBackground: 'transparent'
29
28
  }), MentionType.DEFAULT, {
30
- background: "var(--ds-background-neutral, ".concat(N30A, ")"),
29
+ background: "var(--ds-background-neutral, #0515240F)",
31
30
  borderColor: 'transparent',
32
- text: "var(--ds-text-subtle, ".concat(N500, ")"),
33
- hoveredBackground: "var(--ds-background-neutral-hovered, ".concat(N30A, ")"),
34
- pressedBackground: "var(--ds-background-neutral-pressed, ".concat(N30A, ")")
31
+ text: "var(--ds-text-subtle, #505258)",
32
+ hoveredBackground: "var(--ds-background-neutral-hovered, #0B120E24)",
33
+ pressedBackground: "var(--ds-background-neutral-pressed, #080F214A)"
35
34
  });
36
35
  var getStyle = function getStyle(_ref, property) {
37
36
  var mentionType = _ref.mentionType;
package/dist/esm/components/MentionDescriptionByline/styles.js CHANGED
@@ -2,11 +2,10 @@
2
2
  import styled from '@emotion/styled';
3
3
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
4
4
 
5
- import { N100 } from '@atlaskit/theme/colors';
6
5
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
7
6
  export var DescriptionBylineStyle = styled.span({
8
- color: "var(--ds-text-subtlest, ".concat(N100, ")"),
9
- font: "var(--ds-font-body-UNSAFE_small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
7
+ color: "var(--ds-text-subtlest, #6B6E76)",
8
+ font: "var(--ds-font-body-small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)",
10
9
  marginTop: "var(--ds-space-025, 2px)",
11
10
  display: 'block',
12
11
  overflow: 'hidden',
package/dist/esm/components/MentionItem/index.js CHANGED
@@ -120,7 +120,7 @@ var MentionItem = /*#__PURE__*/function (_React$PureComponent) {
120
120
  time = _ref.time;
121
121
  var restricted = isRestricted(accessLevel);
122
122
  var nameHighlights = highlight && highlight.name;
123
- var xProductUserInfoIconColor = selected ? "var(--ds-icon-selected, #0C66E4)" : "var(--ds-icon, #44546F)";
123
+ var xProductUserInfoIconColor = selected ? "var(--ds-icon-selected, #1868DB)" : "var(--ds-icon, #292A2E)";
124
124
  return /*#__PURE__*/React.createElement(MessagesIntlProvider, null, /*#__PURE__*/React.createElement(MentionItemStyle, {
125
125
  selected: selected,
126
126
  onMouseDown: this.onMentionSelected,
package/dist/esm/components/MentionItem/styles.js CHANGED
@@ -3,7 +3,6 @@ import styled from '@emotion/styled';
3
3
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
4
4
 
5
5
  import { fg } from '@atlaskit/platform-feature-flags';
6
- import { N900, N100, N30, N500 } from '@atlaskit/theme/colors';
7
6
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
8
7
  export var RowStyle = styled.div({
9
8
  alignItems: 'center',
@@ -43,7 +42,7 @@ export var FullNameStyle = styled.span({
43
42
  overflow: 'hidden',
44
43
  textOverflow: 'ellipsis',
45
44
  whiteSpace: 'nowrap',
46
- color: "var(--ds-text, ".concat(N900, ")")
45
+ color: "var(--ds-text, #292A2E)"
47
46
  });
48
47
 
49
48
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
@@ -72,7 +71,7 @@ export var InfoSectionStyle = styled.div(function (props) {
72
71
  export var TimeStyle = styled.div({
73
72
  marginLeft: "var(--ds-space-250, 20px)",
74
73
  flex: 'none',
75
- color: "var(--ds-text-subtlest, ".concat(N100, ")"),
74
+ color: "var(--ds-text-subtlest, #6B6E76)",
76
75
  font: "var(--ds-font-body-small, normal 400 12px/16px \"Atlassian Sans\", ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)"
77
76
  });
78
77
  export var MENTION_ITEM_HEIGHT = 48;
@@ -80,7 +79,7 @@ export var MENTION_ITEM_HEIGHT = 48;
80
79
  export var MentionItemStyle = styled.div(function (props) {
81
80
  return {
82
81
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
83
- backgroundColor: props.selected ? "var(--ds-background-selected, ".concat(N30, ")") : 'transparent',
82
+ backgroundColor: props.selected ? "var(--ds-background-selected, #E9F2FE)" : 'transparent',
84
83
  display: 'block',
85
84
  overflow: 'hidden',
86
85
  listStyleType: 'none',
@@ -94,5 +93,5 @@ export var MentionItemStyle = styled.div(function (props) {
94
93
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
95
94
  export var AccessSectionStyle = styled.div({
96
95
  paddingLeft: "var(--ds-space-050, 4px)",
97
- color: "var(--ds-text-subtle, ".concat(N500, ")")
96
+ color: "var(--ds-text-subtle, #505258)"
98
97
  });
package/dist/esm/components/MentionList/styles.js CHANGED
@@ -11,7 +11,7 @@ export var MentionListStyle = styled.div(function (props) {
11
11
  /* list style */
12
12
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
13
13
  width: mentionListWidth,
14
- color: "var(--ds-text-subtle, #333)",
14
+ color: "var(--ds-text-subtle, #505258)",
15
15
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
16
16
  border: "1px solid ".concat(noDialogContainerBorderColor),
17
17
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
package/dist/esm/components/MentionPicker/styles.js CHANGED
@@ -2,7 +2,6 @@
2
2
  import styled from '@emotion/styled';
3
3
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
4
4
 
5
- import { N100 } from '@atlaskit/theme/colors';
6
5
  import { mentionListWidth, noDialogContainerBorderColor, noDialogContainerBorderRadius, noDialogContainerBoxShadow } from '../../shared-styles';
7
6
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles, @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
8
7
  export var MentionPickerStyle = styled.div(function (props) {
@@ -14,8 +13,8 @@ export var MentionPickerStyle = styled.div(function (props) {
14
13
 
15
14
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
16
15
  export var MentionPickerInfoStyle = styled.div({
17
- background: "var(--ds-surface, #fff)",
18
- color: "var(--ds-text-subtlest, ".concat(N100, ")"),
16
+ background: "var(--ds-surface, #FFFFFF)",
17
+ color: "var(--ds-text-subtlest, #6B6E76)",
19
18
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
20
19
  border: "1px solid ".concat(noDialogContainerBorderColor),
21
20
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
package/dist/esm/components/Scrollable/styles.js CHANGED
@@ -10,7 +10,7 @@ export var ScrollableStyle = styled.div({
10
10
  overflowY: 'auto',
11
11
  padding: "var(--ds-space-050, 4px)".concat(" 0"),
12
12
  margin: 0,
13
- background: "var(--ds-surface, white)",
13
+ background: "var(--ds-surface, #FFFFFF)",
14
14
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
15
15
  maxHeight: scrollableMaxHeight,
16
16
  borderRadius: "var(--ds-radius-small, 3px)"
package/dist/esm/shared-styles.js CHANGED
@@ -1,7 +1,6 @@
1
- import { N40 } from '@atlaskit/theme/colors';
2
- export var noDialogContainerBorderColor = "var(--ds-border, ".concat(N40, ")"); // This has not been confirmed by the ADG yet
1
+ export var noDialogContainerBorderColor = "var(--ds-border, #0B120E24)"; // This has not been confirmed by the ADG yet
3
2
  export var noDialogContainerBorderRadius = "var(--ds-radius-small, 3px)";
4
- export var noDialogContainerBoxShadow = "var(--ds-shadow-overlay, 0 4px 8px -2px rgba(9, 30, 66, 0.25), 0 0 1px rgba(9, 30, 66, 0.31))"; // Copied from droplist style
3
+ export var noDialogContainerBoxShadow = "var(--ds-shadow-overlay, 0px 8px 12px #1E1F2126, 0px 0px 1px #1E1F214f)"; // Copied from droplist style
5
4
 
6
5
  export var scrollableMaxHeight = '264px';
7
6
  export var mentionListWidth = '340px';
package/package.json CHANGED
@@ -21,18 +21,17 @@
21
21
  "dependencies": {
22
22
  "@atlaskit/afm-i18n-platform-elements-mention": "2.7.0",
23
23
  "@atlaskit/analytics-gas-types": "^5.1.0",
24
- "@atlaskit/analytics-next": "^11.1.0",
24
+ "@atlaskit/analytics-next": "^11.2.0",
25
25
  "@atlaskit/avatar": "^25.10.0",
26
26
  "@atlaskit/focus-ring": "^3.0.0",
27
27
  "@atlaskit/heading": "^5.3.0",
28
- "@atlaskit/icon": "^33.0.0",
28
+ "@atlaskit/icon": "^33.1.0",
29
29
  "@atlaskit/lozenge": "^13.5.0",
30
30
  "@atlaskit/platform-feature-flags": "^1.1.0",
31
- "@atlaskit/primitives": "^18.0.0",
32
- "@atlaskit/tag": "^14.5.0",
31
+ "@atlaskit/primitives": "^18.1.0",
32
+ "@atlaskit/tag": "^14.6.0",
33
33
  "@atlaskit/teams-avatar": "^2.4.0",
34
- "@atlaskit/theme": "^22.0.0",
35
- "@atlaskit/tokens": "^11.1.0",
34
+ "@atlaskit/tokens": "^11.3.0",
36
35
  "@atlaskit/tooltip": "^21.0.0",
37
36
  "@atlaskit/ufo": "^0.4.0",
38
37
  "@atlaskit/util-service-support": "^6.3.0",
@@ -113,5 +112,5 @@
113
112
  ]
114
113
  }
115
114
  },
116
- "version": "24.6.0"
115
+ "version": "24.6.1"
117
116
  }