@atlaskit/editor-common 83.5.0 → 83.6.0

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,22 @@
1
1
  # @atlaskit/editor-common
2
2
 
3
+ ## 83.6.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#116586](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/116586)
8
+ [`3e6333e4a0fbd`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/3e6333e4a0fbd) -
9
+ [ED-23761] Add analytics for floating toolbar text highlighting experiment
10
+
11
+ ## 83.5.1
12
+
13
+ ### Patch Changes
14
+
15
+ - [#116194](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/116194)
16
+ [`a6ac14257c10a`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/a6ac14257c10a) -
17
+ [ux] Update button interactions: non-bodied macros stay flush with macro, bodied macros show
18
+ config icon on hover/select, have default white background, and maintain the indentaion
19
+
3
20
  ## 83.5.0
4
21
 
5
22
  ### Minor Changes
@@ -32,6 +32,9 @@
32
32
  {
33
33
  "path": "../../../analytics/analytics-next/afm-jira/tsconfig.json"
34
34
  },
35
+ {
36
+ "path": "../../../uip/atlassian-context/afm-jira/tsconfig.json"
37
+ },
35
38
  {
36
39
  "path": "../../../design-system/button/afm-jira/tsconfig.json"
37
40
  },
@@ -48,20 +48,38 @@ var sharedLabelStyles = (0, _react2.css)({
48
48
  },
49
49
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
50
50
  '&.inline': {
51
- marginLeft: "var(--ds-space-150, 12px)",
52
51
  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
53
52
  top: '-18px'
53
+ },
54
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
55
+ '&.bodied-background': {
56
+ background: "var(--ds-surface, ".concat(_colors.N0, ")")
57
+ },
58
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
59
+ '&.bodied-border': {
60
+ boxShadow: "0 0 0 1px ".concat("var(--ds-border, ".concat(_colors.N30, ")"))
54
61
  }
55
62
  });
56
63
  var buttonLabelStyles = (0, _react2.css)({
64
+ // Need this exact number since this is size with icon
65
+ // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
66
+ minHeight: '26px',
57
67
  alignItems: 'center',
58
68
  borderRadius: "var(--ds-border-radius, 3px)",
59
69
  paddingLeft: "var(--ds-space-050, 4px)",
60
70
  paddingRight: "var(--ds-space-050, 4px)",
61
71
  color: "var(--ds-text-subtle, ".concat(_colors.N800, ")"),
62
- backgroundColor: "var(--ds-background-accent-gray-subtlest, ".concat(_colors.N30, ")")
72
+ backgroundColor: "var(--ds-background-accent-gray-subtlest, ".concat(_colors.N30, ")"),
73
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
74
+ '&.remove-left-margin': {
75
+ marginLeft: "var(--ds-space-negative-150, -12px)"
76
+ },
77
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
78
+ '&.remove-nested-left-margin': {
79
+ marginLeft: 0
80
+ }
63
81
  });
64
- var placeholderStyles = (0, _react2.css)({
82
+ var spacerStyles = (0, _react2.css)({
65
83
  height: "var(--ds-space-150, 12px)"
66
84
  });
67
85
  var textStyles = (0, _react2.css)({
@@ -70,19 +88,22 @@ var textStyles = (0, _react2.css)({
70
88
  padding: "var(--ds-space-025, 2px)".concat(" ", "var(--ds-space-050, 4px)")
71
89
  });
72
90
  var originalLabelStyles = (0, _react2.css)({
91
+ background: "var(--ds-background-accent-gray-subtle-pressed, ".concat(_colors.N40, ")"),
73
92
  borderRadius: "var(--ds-border-radius, 3px)".concat(" ", "var(--ds-border-radius, 3px)", " 0 0"),
74
93
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
75
94
  '&.show-label': {
76
- background: "var(--ds-background-accent-gray-subtle-pressed, ".concat(_colors.N40, ")"),
77
95
  color: "var(--ds-text-subtle, ".concat(_colors.N500, ")")
78
96
  },
79
97
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
80
- '&.bodied-background': {
81
- background: "var(--ds-surface, ".concat(_colors.N0, ")")
82
- },
98
+ '&.inline': {
99
+ // need to add margin since we don't get it for free like block ones via the padding to make it flush with editor elements
100
+ marginLeft: "var(--ds-space-150, 12px)"
101
+ }
102
+ });
103
+ var iconStyles = (0, _react2.css)({
83
104
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
84
- '&.bodied-border': {
85
- boxShadow: "0 0 0 1px ".concat("var(--ds-border, ".concat(_colors.N30, ")"))
105
+ '&.hide-icon': {
106
+ display: 'none'
86
107
  }
87
108
  });
88
109
  var i18n = (0, _reactIntlNext.defineMessages)({
@@ -103,17 +124,26 @@ var ExtensionLabel = exports.ExtensionLabel = function ExtensionLabel(_ref) {
103
124
  showMacroButtonUpdates = _ref.showMacroButtonUpdates;
104
125
  var intl = (0, _reactIntlNext.useIntl)();
105
126
  var tooltipText = "".concat(intl.formatMessage(i18n.configure), " ").concat(text);
127
+ var isInlineExtension = extensionName === 'inlineExtension';
106
128
  var containerClassNames = (0, _classnames.default)({
107
129
  bodied: isBodiedMacro
108
130
  });
109
- var labelClassNames = (0, _classnames.default)('extension-label', {
131
+ var sharedLabelClassNames = (0, _classnames.default)('extension-label', {
110
132
  nested: isNodeNested,
111
- inline: extensionName === 'inlineExtension',
133
+ inline: isInlineExtension,
112
134
  bodied: isBodiedMacro,
113
- 'bodied-border': isBodiedMacro && !isNodeHovered && !showMacroButtonUpdates,
114
- 'bodied-background': isBodiedMacro && !isNodeHovered && !showMacroButtonUpdates,
135
+ 'bodied-border': isBodiedMacro && !isNodeHovered,
136
+ 'bodied-background': isBodiedMacro && !isNodeHovered,
115
137
  'show-label': isNodeHovered || isBodiedMacro
116
138
  });
139
+ var newButtonLabelClassNames = (0, _classnames.default)({
140
+ // For new button design, non-bodied macros should have a flush label. Inline macros don't need this since they never had the margin-left applied.
141
+ 'remove-left-margin': !isBodiedMacro && !isInlineExtension && !isNodeNested,
142
+ 'remove-nested-left-margin': isNodeNested && !isBodiedMacro && !isInlineExtension
143
+ });
144
+ var iconClassNames = (0, _classnames.default)({
145
+ 'hide-icon': isBodiedMacro && !isNodeHovered
146
+ });
117
147
  return (0, _react2.jsx)("div", {
118
148
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
119
149
  css: containerStyles
@@ -140,19 +170,22 @@ var ExtensionLabel = exports.ExtensionLabel = function ExtensionLabel(_ref) {
140
170
  css: [sharedLabelStyles, buttonLabelStyles]
141
171
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
142
172
  ,
143
- className: labelClassNames
144
- }), text, " ", (0, _react2.jsx)(_preferences.default, {
173
+ className: "".concat(sharedLabelClassNames, " ").concat(newButtonLabelClassNames)
174
+ }), text, (0, _react2.jsx)("span", {
175
+ css: iconStyles,
176
+ className: iconClassNames,
177
+ "data-testid": "config-icon"
178
+ }, (0, _react2.jsx)(_preferences.default, {
145
179
  label: ""
146
- }));
180
+ })));
147
181
  }), (0, _react2.jsx)("div", {
148
- "data-testid": "placeholder",
149
- css: placeholderStyles
182
+ css: spacerStyles
150
183
  })) : (0, _react2.jsx)("span", {
151
184
  "data-testid": "new-lozenge",
152
185
  css: [sharedLabelStyles, originalLabelStyles]
153
186
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
154
187
  ,
155
- className: labelClassNames
188
+ className: sharedLabelClassNames
156
189
  }, (0, _react2.jsx)("span", {
157
190
  css: textStyles
158
191
  }, text)));
@@ -17,7 +17,7 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
17
17
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
18
18
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
19
19
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
20
- var packageVersion = "83.5.0";
20
+ var packageVersion = "83.6.0";
21
21
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
22
22
  // Remove URL as it has UGC
23
23
  // TODO: Sanitise the URL instead of just removing it
@@ -20,7 +20,7 @@ var _Layer = _interopRequireDefault(require("../Layer"));
20
20
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
21
21
  function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /** @jsx jsx */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
22
22
  var packageName = "@atlaskit/editor-common";
23
- var packageVersion = "83.5.0";
23
+ var packageVersion = "83.6.0";
24
24
  var halfFocusRing = 1;
25
25
  var dropOffset = '0, 8';
26
26
  var DropList = /*#__PURE__*/function (_Component) {
@@ -39,20 +39,38 @@ const sharedLabelStyles = css({
39
39
  },
40
40
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
41
41
  '&.inline': {
42
- marginLeft: "var(--ds-space-150, 12px)",
43
42
  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
44
43
  top: '-18px'
44
+ },
45
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
46
+ '&.bodied-background': {
47
+ background: `var(--ds-surface, ${N0})`
48
+ },
49
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
50
+ '&.bodied-border': {
51
+ boxShadow: `0 0 0 1px ${`var(--ds-border, ${N30})`}`
45
52
  }
46
53
  });
47
54
  const buttonLabelStyles = css({
55
+ // Need this exact number since this is size with icon
56
+ // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
57
+ minHeight: '26px',
48
58
  alignItems: 'center',
49
59
  borderRadius: "var(--ds-border-radius, 3px)",
50
60
  paddingLeft: "var(--ds-space-050, 4px)",
51
61
  paddingRight: "var(--ds-space-050, 4px)",
52
62
  color: `var(--ds-text-subtle, ${N800})`,
53
- backgroundColor: `var(--ds-background-accent-gray-subtlest, ${N30})`
63
+ backgroundColor: `var(--ds-background-accent-gray-subtlest, ${N30})`,
64
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
65
+ '&.remove-left-margin': {
66
+ marginLeft: "var(--ds-space-negative-150, -12px)"
67
+ },
68
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
69
+ '&.remove-nested-left-margin': {
70
+ marginLeft: 0
71
+ }
54
72
  });
55
- const placeholderStyles = css({
73
+ const spacerStyles = css({
56
74
  height: "var(--ds-space-150, 12px)"
57
75
  });
58
76
  const textStyles = css({
@@ -61,19 +79,22 @@ const textStyles = css({
61
79
  padding: `${"var(--ds-space-025, 2px)"} ${"var(--ds-space-050, 4px)"}`
62
80
  });
63
81
  const originalLabelStyles = css({
82
+ background: `var(--ds-background-accent-gray-subtle-pressed, ${N40})`,
64
83
  borderRadius: `${"var(--ds-border-radius, 3px)"} ${"var(--ds-border-radius, 3px)"} 0 0`,
65
84
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
66
85
  '&.show-label': {
67
- background: `var(--ds-background-accent-gray-subtle-pressed, ${N40})`,
68
86
  color: `var(--ds-text-subtle, ${N500})`
69
87
  },
70
88
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
71
- '&.bodied-background': {
72
- background: `var(--ds-surface, ${N0})`
73
- },
89
+ '&.inline': {
90
+ // need to add margin since we don't get it for free like block ones via the padding to make it flush with editor elements
91
+ marginLeft: "var(--ds-space-150, 12px)"
92
+ }
93
+ });
94
+ const iconStyles = css({
74
95
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
75
- '&.bodied-border': {
76
- boxShadow: `0 0 0 1px ${`var(--ds-border, ${N30})`}`
96
+ '&.hide-icon': {
97
+ display: 'none'
77
98
  }
78
99
  });
79
100
  const i18n = defineMessages({
@@ -95,17 +116,26 @@ export const ExtensionLabel = ({
95
116
  }) => {
96
117
  const intl = useIntl();
97
118
  const tooltipText = `${intl.formatMessage(i18n.configure)} ${text}`;
119
+ const isInlineExtension = extensionName === 'inlineExtension';
98
120
  const containerClassNames = classnames({
99
121
  bodied: isBodiedMacro
100
122
  });
101
- const labelClassNames = classnames('extension-label', {
123
+ const sharedLabelClassNames = classnames('extension-label', {
102
124
  nested: isNodeNested,
103
- inline: extensionName === 'inlineExtension',
125
+ inline: isInlineExtension,
104
126
  bodied: isBodiedMacro,
105
- 'bodied-border': isBodiedMacro && !isNodeHovered && !showMacroButtonUpdates,
106
- 'bodied-background': isBodiedMacro && !isNodeHovered && !showMacroButtonUpdates,
127
+ 'bodied-border': isBodiedMacro && !isNodeHovered,
128
+ 'bodied-background': isBodiedMacro && !isNodeHovered,
107
129
  'show-label': isNodeHovered || isBodiedMacro
108
130
  });
131
+ const newButtonLabelClassNames = classnames({
132
+ // For new button design, non-bodied macros should have a flush label. Inline macros don't need this since they never had the margin-left applied.
133
+ 'remove-left-margin': !isBodiedMacro && !isInlineExtension && !isNodeNested,
134
+ 'remove-nested-left-margin': isNodeNested && !isBodiedMacro && !isInlineExtension
135
+ });
136
+ const iconClassNames = classnames({
137
+ 'hide-icon': isBodiedMacro && !isNodeHovered
138
+ });
109
139
  return jsx("div", {
110
140
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
111
141
  css: containerStyles
@@ -131,18 +161,21 @@ export const ExtensionLabel = ({
131
161
  css: [sharedLabelStyles, buttonLabelStyles]
132
162
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
133
163
  ,
134
- className: labelClassNames
135
- }), text, " ", jsx(PreferencesIcon, {
164
+ className: `${sharedLabelClassNames} ${newButtonLabelClassNames}`
165
+ }), text, jsx("span", {
166
+ css: iconStyles,
167
+ className: iconClassNames,
168
+ "data-testid": "config-icon"
169
+ }, jsx(PreferencesIcon, {
136
170
  label: ""
137
- }))), jsx("div", {
138
- "data-testid": "placeholder",
139
- css: placeholderStyles
171
+ })))), jsx("div", {
172
+ css: spacerStyles
140
173
  })) : jsx("span", {
141
174
  "data-testid": "new-lozenge",
142
175
  css: [sharedLabelStyles, originalLabelStyles]
143
176
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
144
177
  ,
145
- className: labelClassNames
178
+ className: sharedLabelClassNames
146
179
  }, jsx("span", {
147
180
  css: textStyles
148
181
  }, text)));
@@ -1,7 +1,7 @@
1
1
  import { isFedRamp } from './environment';
2
2
  const SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
3
3
  const packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
4
- const packageVersion = "83.5.0";
4
+ const packageVersion = "83.6.0";
5
5
  const sanitiseSentryEvents = (data, _hint) => {
6
6
  // Remove URL as it has UGC
7
7
  // TODO: Sanitise the URL instead of just removing it
@@ -9,7 +9,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
9
9
  import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
10
10
  import Layer from '../Layer';
11
11
  const packageName = "@atlaskit/editor-common";
12
- const packageVersion = "83.5.0";
12
+ const packageVersion = "83.6.0";
13
13
  const halfFocusRing = 1;
14
14
  const dropOffset = '0, 8';
15
15
  class DropList extends Component {
@@ -39,20 +39,38 @@ var sharedLabelStyles = css({
39
39
  },
40
40
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
41
41
  '&.inline': {
42
- marginLeft: "var(--ds-space-150, 12px)",
43
42
  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
44
43
  top: '-18px'
44
+ },
45
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
46
+ '&.bodied-background': {
47
+ background: "var(--ds-surface, ".concat(N0, ")")
48
+ },
49
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
50
+ '&.bodied-border': {
51
+ boxShadow: "0 0 0 1px ".concat("var(--ds-border, ".concat(N30, ")"))
45
52
  }
46
53
  });
47
54
  var buttonLabelStyles = css({
55
+ // Need this exact number since this is size with icon
56
+ // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage/preview
57
+ minHeight: '26px',
48
58
  alignItems: 'center',
49
59
  borderRadius: "var(--ds-border-radius, 3px)",
50
60
  paddingLeft: "var(--ds-space-050, 4px)",
51
61
  paddingRight: "var(--ds-space-050, 4px)",
52
62
  color: "var(--ds-text-subtle, ".concat(N800, ")"),
53
- backgroundColor: "var(--ds-background-accent-gray-subtlest, ".concat(N30, ")")
63
+ backgroundColor: "var(--ds-background-accent-gray-subtlest, ".concat(N30, ")"),
64
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
65
+ '&.remove-left-margin': {
66
+ marginLeft: "var(--ds-space-negative-150, -12px)"
67
+ },
68
+ // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
69
+ '&.remove-nested-left-margin': {
70
+ marginLeft: 0
71
+ }
54
72
  });
55
- var placeholderStyles = css({
73
+ var spacerStyles = css({
56
74
  height: "var(--ds-space-150, 12px)"
57
75
  });
58
76
  var textStyles = css({
@@ -61,19 +79,22 @@ var textStyles = css({
61
79
  padding: "var(--ds-space-025, 2px)".concat(" ", "var(--ds-space-050, 4px)")
62
80
  });
63
81
  var originalLabelStyles = css({
82
+ background: "var(--ds-background-accent-gray-subtle-pressed, ".concat(N40, ")"),
64
83
  borderRadius: "var(--ds-border-radius, 3px)".concat(" ", "var(--ds-border-radius, 3px)", " 0 0"),
65
84
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
66
85
  '&.show-label': {
67
- background: "var(--ds-background-accent-gray-subtle-pressed, ".concat(N40, ")"),
68
86
  color: "var(--ds-text-subtle, ".concat(N500, ")")
69
87
  },
70
88
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
71
- '&.bodied-background': {
72
- background: "var(--ds-surface, ".concat(N0, ")")
73
- },
89
+ '&.inline': {
90
+ // need to add margin since we don't get it for free like block ones via the padding to make it flush with editor elements
91
+ marginLeft: "var(--ds-space-150, 12px)"
92
+ }
93
+ });
94
+ var iconStyles = css({
74
95
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
75
- '&.bodied-border': {
76
- boxShadow: "0 0 0 1px ".concat("var(--ds-border, ".concat(N30, ")"))
96
+ '&.hide-icon': {
97
+ display: 'none'
77
98
  }
78
99
  });
79
100
  var i18n = defineMessages({
@@ -94,17 +115,26 @@ export var ExtensionLabel = function ExtensionLabel(_ref) {
94
115
  showMacroButtonUpdates = _ref.showMacroButtonUpdates;
95
116
  var intl = useIntl();
96
117
  var tooltipText = "".concat(intl.formatMessage(i18n.configure), " ").concat(text);
118
+ var isInlineExtension = extensionName === 'inlineExtension';
97
119
  var containerClassNames = classnames({
98
120
  bodied: isBodiedMacro
99
121
  });
100
- var labelClassNames = classnames('extension-label', {
122
+ var sharedLabelClassNames = classnames('extension-label', {
101
123
  nested: isNodeNested,
102
- inline: extensionName === 'inlineExtension',
124
+ inline: isInlineExtension,
103
125
  bodied: isBodiedMacro,
104
- 'bodied-border': isBodiedMacro && !isNodeHovered && !showMacroButtonUpdates,
105
- 'bodied-background': isBodiedMacro && !isNodeHovered && !showMacroButtonUpdates,
126
+ 'bodied-border': isBodiedMacro && !isNodeHovered,
127
+ 'bodied-background': isBodiedMacro && !isNodeHovered,
106
128
  'show-label': isNodeHovered || isBodiedMacro
107
129
  });
130
+ var newButtonLabelClassNames = classnames({
131
+ // For new button design, non-bodied macros should have a flush label. Inline macros don't need this since they never had the margin-left applied.
132
+ 'remove-left-margin': !isBodiedMacro && !isInlineExtension && !isNodeNested,
133
+ 'remove-nested-left-margin': isNodeNested && !isBodiedMacro && !isInlineExtension
134
+ });
135
+ var iconClassNames = classnames({
136
+ 'hide-icon': isBodiedMacro && !isNodeHovered
137
+ });
108
138
  return jsx("div", {
109
139
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
110
140
  css: containerStyles
@@ -131,19 +161,22 @@ export var ExtensionLabel = function ExtensionLabel(_ref) {
131
161
  css: [sharedLabelStyles, buttonLabelStyles]
132
162
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
133
163
  ,
134
- className: labelClassNames
135
- }), text, " ", jsx(PreferencesIcon, {
164
+ className: "".concat(sharedLabelClassNames, " ").concat(newButtonLabelClassNames)
165
+ }), text, jsx("span", {
166
+ css: iconStyles,
167
+ className: iconClassNames,
168
+ "data-testid": "config-icon"
169
+ }, jsx(PreferencesIcon, {
136
170
  label: ""
137
- }));
171
+ })));
138
172
  }), jsx("div", {
139
- "data-testid": "placeholder",
140
- css: placeholderStyles
173
+ css: spacerStyles
141
174
  })) : jsx("span", {
142
175
  "data-testid": "new-lozenge",
143
176
  css: [sharedLabelStyles, originalLabelStyles]
144
177
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
145
178
  ,
146
- className: labelClassNames
179
+ className: sharedLabelClassNames
147
180
  }, jsx("span", {
148
181
  css: textStyles
149
182
  }, text)));
@@ -7,7 +7,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
7
7
  import { isFedRamp } from './environment';
8
8
  var SENTRY_DSN = 'https://0b10c8e02fb44d8796c047b102c9bee8@o55978.ingest.sentry.io/4505129224110080';
9
9
  var packageName = 'editor-common'; // Sentry doesn't accept '/' in its releases https://docs.sentry.io/platforms/javascript/configuration/releases/
10
- var packageVersion = "83.5.0";
10
+ var packageVersion = "83.6.0";
11
11
  var sanitiseSentryEvents = function sanitiseSentryEvents(data, _hint) {
12
12
  // Remove URL as it has UGC
13
13
  // TODO: Sanitise the URL instead of just removing it
@@ -17,7 +17,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
17
17
  import { N0, N50A, N60A, N900 } from '@atlaskit/theme/colors';
18
18
  import Layer from '../Layer';
19
19
  var packageName = "@atlaskit/editor-common";
20
- var packageVersion = "83.5.0";
20
+ var packageVersion = "83.6.0";
21
21
  var halfFocusRing = 1;
22
22
  var dropOffset = '0, 8';
23
23
  var DropList = /*#__PURE__*/function (_Component) {
@@ -1,10 +1,11 @@
1
1
  import type { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, INPUT_METHOD } from './enums';
2
2
  import type { TrackAEP } from './utils';
3
3
  export type HighlightToolbarToggleAEP = TrackAEP<ACTION.OPENED | ACTION.CLOSED, ACTION_SUBJECT.TOOLBAR, ACTION_SUBJECT_ID.FORMAT_BACKGROUND_COLOR, {
4
- inputMethod: INPUT_METHOD.TOOLBAR | INPUT_METHOD.SHORTCUT;
4
+ inputMethod: INPUT_METHOD;
5
5
  }, undefined>;
6
6
  export type HighlightTextAEP = TrackAEP<ACTION.FORMATTED, ACTION_SUBJECT.TEXT, ACTION_SUBJECT_ID.FORMAT_BACKGROUND_COLOR, {
7
7
  newColor: string;
8
8
  previousColor: string;
9
+ inputMethod: INPUT_METHOD;
9
10
  }, undefined>;
10
11
  export type HighlightEventPayload = HighlightToolbarToggleAEP | HighlightTextAEP;
@@ -1,10 +1,11 @@
1
1
  import type { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, INPUT_METHOD } from './enums';
2
2
  import type { TrackAEP } from './utils';
3
3
  export type HighlightToolbarToggleAEP = TrackAEP<ACTION.OPENED | ACTION.CLOSED, ACTION_SUBJECT.TOOLBAR, ACTION_SUBJECT_ID.FORMAT_BACKGROUND_COLOR, {
4
- inputMethod: INPUT_METHOD.TOOLBAR | INPUT_METHOD.SHORTCUT;
4
+ inputMethod: INPUT_METHOD;
5
5
  }, undefined>;
6
6
  export type HighlightTextAEP = TrackAEP<ACTION.FORMATTED, ACTION_SUBJECT.TEXT, ACTION_SUBJECT_ID.FORMAT_BACKGROUND_COLOR, {
7
7
  newColor: string;
8
8
  previousColor: string;
9
+ inputMethod: INPUT_METHOD;
9
10
  }, undefined>;
10
11
  export type HighlightEventPayload = HighlightToolbarToggleAEP | HighlightTextAEP;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-common",
3
- "version": "83.5.0",
3
+ "version": "83.6.0",
4
4
  "description": "A package that contains common classes and components for editor and renderer",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"