@atlaskit/jql-editor 5.8.0 → 5.8.2

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/jql-editor
 
+## 5.8.2
+
+### Patch Changes
+
+- Updated dependencies
+
+## 5.8.1
+
+### Patch Changes
+
+- [`9b64a2eecf044`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/9b64a2eecf044) -
+  Fix for team rich node on autocomplete
+- Updated dependencies
+
 ## 5.8.0
 
 ### Minor Changes

package/dist/cjs/analytics/util.js

@@ -6,5 +6,5 @@ Object.defineProperty(exports, "__esModule", {
 exports.useJqlEditorAnalytics = void 0;
 var _jqlEditorCommon = require("@atlaskit/jql-editor-common");
 var useJqlEditorAnalytics = exports.useJqlEditorAnalytics = function useJqlEditorAnalytics(analyticsSource) {
-  return (0, _jqlEditorCommon.useJqlPackageAnalytics)(analyticsSource, "@atlaskit/jql-editor", "5.7.1", _jqlEditorCommon.ANALYTICS_CHANNEL);
+  return (0, _jqlEditorCommon.useJqlPackageAnalytics)(analyticsSource, "@atlaskit/jql-editor", "0.0.0-development", _jqlEditorCommon.ANALYTICS_CHANNEL);
 };

package/dist/cjs/plugins/autocomplete/view.js

@@ -102,6 +102,21 @@ var AutocompletePluginView = exports.default = /*#__PURE__*/function (_ReactPlug
               nodes.push(_this.view.state.schema.nodes.user.create(attributes, textContent));
               break;
             }
+          case 'team':
+            {
+              if ((0, _platformFeatureFlags.fg)('jira_update_jql_teams')) {
+                var _attributes = {
+                  type: 'team',
+                  id: value,
+                  name: nameOnRichInlineNode !== null && nameOnRichInlineNode !== void 0 ? nameOnRichInlineNode : name,
+                  fieldName: context === null || context === void 0 ? void 0 : context.field
+                };
+                nodes.push(_this.view.state.schema.nodes.team.create(_attributes, textContent));
+              } else {
+                nodes.push(textContent);
+              }
+              break;
+            }
           default:
             {
               nodes.push(textContent);

package/dist/cjs/plugins/rich-inline-nodes/nodes/team/index.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.team = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireDefault(require("react"));
-var _avatar = _interopRequireDefault(require("@atlaskit/avatar"));
+var _teamsAvatar = _interopRequireDefault(require("@atlaskit/teams-avatar"));
 var _state = require("../../../../state");
 var _styled = require("./styled");
 var Team = function Team(_ref) {
@@ -25,11 +25,14 @@ var Team = function Team(_ref) {
   return /*#__PURE__*/_react.default.createElement(_styled.TeamContainer, {
     selected: selected,
     error: error
-  }, /*#__PURE__*/_react.default.createElement(_styled.AvatarWrapper, null, /*#__PURE__*/_react.default.createElement(_avatar.default, {
+  }, /*#__PURE__*/_react.default.createElement(_styled.AvatarWrapper, {
+    "data-testid": "team-avatar-wrapper"
+  }, /*#__PURE__*/_react.default.createElement(_teamsAvatar.default, {
+    teamId: id,
     src: team === null || team === void 0 ? void 0 : team.avatarUrl,
-    appearance: "square",
     borderColor: "transparent",
-    size: "xsmall"
+    size: "xsmall",
+    compact: true
   })), /*#__PURE__*/_react.default.createElement(_styled.NameContainer, null, name));
 };
 var team = exports.team = {

package/dist/cjs/plugins/rich-inline-nodes/nodes/team/styled.js

@@ -84,16 +84,5 @@ var NameContainer = exports.NameContainer = _styled.default.span({
 var AvatarWrapper = exports.AvatarWrapper = _styled.default.div({
   height: "var(--ds-space-200, 16px)",
   width: "var(--ds-space-200, 16px)",
-  alignSelf: 'center',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '> div span': {
-    margin: "var(--ds-space-0, 0px)"
-  },
-  // Fix fallback icon alignment by targeting the outer AvatarContent span
-  // This contains the icon background and needs to move as a unit
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-  '> div > span:has(> span)': {
-    position: 'relative',
-    top: '-2px'
-  }
+  alignSelf: 'center'
 });

package/dist/cjs/plugins/rich-inline-nodes/util/react-node-view.js

@@ -18,7 +18,7 @@ var _state = require("../../../state");
 var _constants = require("../constants");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
 var ReactNodeView = exports.ReactNodeView = /*#__PURE__*/function () {
   function ReactNodeView(component, portalActions, _node) {
     var _this = this;
@@ -113,6 +113,7 @@ var ReactNodeView = exports.ReactNodeView = /*#__PURE__*/function () {
     // Generate unique portal identifier
     // If you read this comment in the future and TypeScript has added support for Symbols as object keys, please do
     // JQL Editor a favor and replace this library with the native JS functionality that TS was supposed to support.
+    // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
     this.portalKey = (0, _uuid.v4)();
     // Creating span under the assumption that all node views will be inline elements in JQL Editor
     this.dom = document.createElement('span');

package/dist/cjs/state/index.js

@@ -30,7 +30,7 @@ var _autocomplete = require("./autocomplete");
 var _hydration = require("./hydration");
 var _util = require("./util");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
 var initialIntl = (0, _reactIntlNext.createIntl)({
   locale: 'en'
 });
@@ -972,6 +972,7 @@ var EditorStateContainer = exports.EditorStateContainer = (0, _reactSweetState.c
         autocompleteProvider: autocompleteProvider,
         enableRichInlineNodes: enableRichInlineNodes,
         // Generate unique identifiers for each JQL editor instance
+        // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
         idPrefix: (0, _uuid.v4)(),
         resizeObserver: window.ResizeObserver !== undefined ? new window.ResizeObserver(function () {
           var _getState$editorViewC;

package/dist/cjs/ui/jql-editor-controls-content/base-syntax-help/index.js

@@ -38,7 +38,7 @@ var BaseSyntaxHelp = exports.BaseSyntaxHelp = function BaseSyntaxHelp(_ref) {
     href: "https://confluence.atlassian.com/display/SERVICEDESKCLOUD/Advanced+searching",
     icon: function icon(iconProps) {
       return /*#__PURE__*/_react.default.createElement(_questionCircle.default, (0, _extends2.default)({}, iconProps, {
-        color: "var(--ds-icon-subtle, #626F86)"
+        color: "var(--ds-icon-subtle, #505258)"
       }));
     }
   }) : /*#__PURE__*/_react.default.createElement(_styled.SyntaxHelpContainer, null, /*#__PURE__*/_react.default.createElement(_button.default, {

package/dist/es2019/analytics/util.js

@@ -1,4 +1,4 @@
 import { ANALYTICS_CHANNEL, useJqlPackageAnalytics } from '@atlaskit/jql-editor-common';
 export const useJqlEditorAnalytics = analyticsSource => {
-  return useJqlPackageAnalytics(analyticsSource, "@atlaskit/jql-editor", "5.7.1", ANALYTICS_CHANNEL);
+  return useJqlPackageAnalytics(analyticsSource, "@atlaskit/jql-editor", "0.0.0-development", ANALYTICS_CHANNEL);
 };

package/dist/es2019/plugins/autocomplete/view.js

@@ -87,6 +87,21 @@ export default class AutocompletePluginView extends ReactPluginView {
               nodes.push(this.view.state.schema.nodes.user.create(attributes, textContent));
               break;
             }
+          case 'team':
+            {
+              if (fg('jira_update_jql_teams')) {
+                const attributes = {
+                  type: 'team',
+                  id: value,
+                  name: nameOnRichInlineNode !== null && nameOnRichInlineNode !== void 0 ? nameOnRichInlineNode : name,
+                  fieldName: context === null || context === void 0 ? void 0 : context.field
+                };
+                nodes.push(this.view.state.schema.nodes.team.create(attributes, textContent));
+              } else {
+                nodes.push(textContent);
+              }
+              break;
+            }
           default:
             {
               nodes.push(textContent);

package/dist/es2019/plugins/rich-inline-nodes/nodes/team/index.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import Avatar from '@atlaskit/avatar';
+import TeamsAvatar from '@atlaskit/teams-avatar';
 import { useHydratedTeam } from '../../../../state';
 import { AvatarWrapper, NameContainer, TeamContainer } from './styled';
 const Team = ({
@@ -16,11 +16,14 @@ const Team = ({
   return /*#__PURE__*/React.createElement(TeamContainer, {
     selected: selected,
     error: error
-  }, /*#__PURE__*/React.createElement(AvatarWrapper, null, /*#__PURE__*/React.createElement(Avatar, {
+  }, /*#__PURE__*/React.createElement(AvatarWrapper, {
+    "data-testid": "team-avatar-wrapper"
+  }, /*#__PURE__*/React.createElement(TeamsAvatar, {
+    teamId: id,
     src: team === null || team === void 0 ? void 0 : team.avatarUrl,
-    appearance: "square",
     borderColor: "transparent",
-    size: "xsmall"
+    size: "xsmall",
+    compact: true
   })), /*#__PURE__*/React.createElement(NameContainer, null, name));
 };
 export const team = {

package/dist/es2019/plugins/rich-inline-nodes/nodes/team/styled.js

@@ -76,16 +76,5 @@ export const NameContainer = styled.span({
 export const AvatarWrapper = styled.div({
   height: "var(--ds-space-200, 16px)",
   width: "var(--ds-space-200, 16px)",
-  alignSelf: 'center',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '> div span': {
-    margin: "var(--ds-space-0, 0px)"
-  },
-  // Fix fallback icon alignment by targeting the outer AvatarContent span
-  // This contains the icon background and needs to move as a unit
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-  '> div > span:has(> span)': {
-    position: 'relative',
-    top: '-2px'
-  }
+  alignSelf: 'center'
 });

package/dist/es2019/plugins/rich-inline-nodes/util/react-node-view.js

@@ -2,6 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import React, { useEffect, useLayoutEffect, useState } from 'react';
 import { Subject } from 'rxjs/Subject';
+// eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
 import { v4 as uuid } from 'uuid';
 import { useEditorViewHasFocus } from '../../../state';
 import { ERROR_NODE, SELECTED_NODE } from '../constants';
@@ -90,6 +91,7 @@ export class ReactNodeView {
     // Generate unique portal identifier
     // If you read this comment in the future and TypeScript has added support for Symbols as object keys, please do
     // JQL Editor a favor and replace this library with the native JS functionality that TS was supposed to support.
+    // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
     this.portalKey = uuid();
     // Creating span under the assumption that all node views will be inline elements in JQL Editor
     this.dom = document.createElement('span');

package/dist/es2019/state/index.js

@@ -4,6 +4,7 @@ import { createIntl } from 'react-intl-next';
 import { createContainer, createHook, createSelector, createStore } from 'react-sweet-state';
 import { merge } from 'rxjs/observable/merge';
 import { tap } from 'rxjs/operators/tap';
+// eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
 import { v4 as uuidv4 } from 'uuid';
 import { EditorView } from '@atlaskit/editor-prosemirror/view';
 import { computeJqlInsights, isListOperator } from '@atlaskit/jql-ast';
@@ -941,6 +942,7 @@ export const EditorStateContainer = createContainer(Store, {
       autocompleteProvider,
       enableRichInlineNodes,
       // Generate unique identifiers for each JQL editor instance
+      // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
       idPrefix: uuidv4(),
       resizeObserver: window.ResizeObserver !== undefined ? new window.ResizeObserver(() => {
         var _getState$editorViewC;

package/dist/es2019/ui/jql-editor-controls-content/base-syntax-help/index.js

@@ -31,7 +31,7 @@ export const BaseSyntaxHelp = ({
     target: "blank",
     href: "https://confluence.atlassian.com/display/SERVICEDESKCLOUD/Advanced+searching",
     icon: iconProps => /*#__PURE__*/React.createElement(QuestionCircleIcon, _extends({}, iconProps, {
-      color: "var(--ds-icon-subtle, #626F86)"
+      color: "var(--ds-icon-subtle, #505258)"
     }))
   }) : /*#__PURE__*/React.createElement(SyntaxHelpContainer, null, /*#__PURE__*/React.createElement(Button, {
     "aria-describedby": describedby,

package/dist/esm/analytics/util.js

@@ -1,4 +1,4 @@
 import { ANALYTICS_CHANNEL, useJqlPackageAnalytics } from '@atlaskit/jql-editor-common';
 export var useJqlEditorAnalytics = function useJqlEditorAnalytics(analyticsSource) {
-  return useJqlPackageAnalytics(analyticsSource, "@atlaskit/jql-editor", "5.7.1", ANALYTICS_CHANNEL);
+  return useJqlPackageAnalytics(analyticsSource, "@atlaskit/jql-editor", "0.0.0-development", ANALYTICS_CHANNEL);
 };

package/dist/esm/plugins/autocomplete/view.js

@@ -96,6 +96,21 @@ var AutocompletePluginView = /*#__PURE__*/function (_ReactPluginView) {
               nodes.push(_this.view.state.schema.nodes.user.create(attributes, textContent));
               break;
             }
+          case 'team':
+            {
+              if (fg('jira_update_jql_teams')) {
+                var _attributes = {
+                  type: 'team',
+                  id: value,
+                  name: nameOnRichInlineNode !== null && nameOnRichInlineNode !== void 0 ? nameOnRichInlineNode : name,
+                  fieldName: context === null || context === void 0 ? void 0 : context.field
+                };
+                nodes.push(_this.view.state.schema.nodes.team.create(_attributes, textContent));
+              } else {
+                nodes.push(textContent);
+              }
+              break;
+            }
           default:
             {
               nodes.push(textContent);

package/dist/esm/plugins/rich-inline-nodes/nodes/team/index.js

@@ -1,6 +1,6 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React from 'react';
-import Avatar from '@atlaskit/avatar';
+import TeamsAvatar from '@atlaskit/teams-avatar';
 import { useHydratedTeam } from '../../../../state';
 import { AvatarWrapper, NameContainer, TeamContainer } from './styled';
 var Team = function Team(_ref) {
@@ -18,11 +18,14 @@ var Team = function Team(_ref) {
   return /*#__PURE__*/React.createElement(TeamContainer, {
     selected: selected,
     error: error
-  }, /*#__PURE__*/React.createElement(AvatarWrapper, null, /*#__PURE__*/React.createElement(Avatar, {
+  }, /*#__PURE__*/React.createElement(AvatarWrapper, {
+    "data-testid": "team-avatar-wrapper"
+  }, /*#__PURE__*/React.createElement(TeamsAvatar, {
+    teamId: id,
     src: team === null || team === void 0 ? void 0 : team.avatarUrl,
-    appearance: "square",
     borderColor: "transparent",
-    size: "xsmall"
+    size: "xsmall",
+    compact: true
   })), /*#__PURE__*/React.createElement(NameContainer, null, name));
 };
 export var team = {

package/dist/esm/plugins/rich-inline-nodes/nodes/team/styled.js

@@ -75,16 +75,5 @@ export var NameContainer = styled.span({
 export var AvatarWrapper = styled.div({
   height: "var(--ds-space-200, 16px)",
   width: "var(--ds-space-200, 16px)",
-  alignSelf: 'center',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '> div span': {
-    margin: "var(--ds-space-0, 0px)"
-  },
-  // Fix fallback icon alignment by targeting the outer AvatarContent span
-  // This contains the icon background and needs to move as a unit
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-  '> div > span:has(> span)': {
-    position: 'relative',
-    top: '-2px'
-  }
+  alignSelf: 'center'
 });

package/dist/esm/plugins/rich-inline-nodes/util/react-node-view.js

@@ -7,6 +7,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import React, { useEffect, useLayoutEffect, useState } from 'react';
 import { Subject } from 'rxjs/Subject';
+// eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
 import { v4 as uuid } from 'uuid';
 import { useEditorViewHasFocus } from '../../../state';
 import { ERROR_NODE, SELECTED_NODE } from '../constants';
@@ -104,6 +105,7 @@ export var ReactNodeView = /*#__PURE__*/function () {
     // Generate unique portal identifier
     // If you read this comment in the future and TypeScript has added support for Symbols as object keys, please do
     // JQL Editor a favor and replace this library with the native JS functionality that TS was supposed to support.
+    // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
     this.portalKey = uuid();
     // Creating span under the assumption that all node views will be inline elements in JQL Editor
     this.dom = document.createElement('span');

package/dist/esm/state/index.js

@@ -9,6 +9,7 @@ import { createIntl } from 'react-intl-next';
 import { createContainer, createHook, createSelector, createStore } from 'react-sweet-state';
 import { merge } from 'rxjs/observable/merge';
 import { tap } from 'rxjs/operators/tap';
+// eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
 import { v4 as uuidv4 } from 'uuid';
 import { EditorView } from '@atlaskit/editor-prosemirror/view';
 import { computeJqlInsights, isListOperator } from '@atlaskit/jql-ast';
@@ -965,6 +966,7 @@ export var EditorStateContainer = createContainer(Store, {
         autocompleteProvider: autocompleteProvider,
         enableRichInlineNodes: enableRichInlineNodes,
         // Generate unique identifiers for each JQL editor instance
+        // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
         idPrefix: uuidv4(),
         resizeObserver: window.ResizeObserver !== undefined ? new window.ResizeObserver(function () {
           var _getState$editorViewC;

package/dist/esm/ui/jql-editor-controls-content/base-syntax-help/index.js

@@ -31,7 +31,7 @@ export var BaseSyntaxHelp = function BaseSyntaxHelp(_ref) {
     href: "https://confluence.atlassian.com/display/SERVICEDESKCLOUD/Advanced+searching",
     icon: function icon(iconProps) {
       return /*#__PURE__*/React.createElement(QuestionCircleIcon, _extends({}, iconProps, {
-        color: "var(--ds-icon-subtle, #626F86)"
+        color: "var(--ds-icon-subtle, #505258)"
       }));
     }
   }) : /*#__PURE__*/React.createElement(SyntaxHelpContainer, null, /*#__PURE__*/React.createElement(Button, {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/jql-editor",
-	"version": "5.8.0",
+	"version": "5.8.2",
 	"description": "This package allows consumers to render an advanced JQL editor component to enable autocomplete-assisted authoring and validation of JQL queries.",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -36,7 +36,7 @@
 		"@atlaskit/analytics-gas-types": "^5.1.0",
 		"@atlaskit/analytics-next": "^11.1.0",
 		"@atlaskit/avatar": "^25.5.0",
-		"@atlaskit/button": "^23.5.0",
+		"@atlaskit/button": "^23.6.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
 		"@atlaskit/form": "^14.2.0",
 		"@atlaskit/icon": "^28.5.0",
@@ -51,9 +51,10 @@
 		"@atlaskit/primitives": "^16.1.0",
 		"@atlaskit/prosemirror-history": "^0.2.0",
 		"@atlaskit/spinner": "^19.0.0",
+		"@atlaskit/teams-avatar": "^2.4.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tokens": "^7.0.0",
-		"@atlaskit/tooltip": "^20.7.0",
+		"@atlaskit/tokens": "^8.0.0",
+		"@atlaskit/tooltip": "^20.8.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
 		"@emotion/styled": "^11.0.0",