@atlaskit/jql-editor 5.6.4 → 5.7.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @atlaskit/jql-editor
 
+## 5.7.0
+
+### Minor Changes
+
+- [`8e600a4218a79`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8e600a4218a79) -
+  [ux] Fixed offset of anonymous user icon in jqlEditor and edited user example to showcase the
+  anonymous user icon
+
+## 5.6.5
+
+### Patch Changes
+
+- [`6cf4b64a5d781`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6cf4b64a5d781) -
+  Update team JQl to show rich text node (and hydrate)
+- Updated dependencies
+
 ## 5.6.4
 
 ### Patch 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.6.3", _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

@@ -15,6 +15,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _model = require("@atlaskit/editor-prosemirror/model");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _jqlAst = require("@atlaskit/jql-ast");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _getDocumentPosition = _interopRequireDefault(require("../common/get-document-position"));
 var _reactPluginView = _interopRequireDefault(require("../common/react-plugin-view"));
 var _autocomplete = _interopRequireDefault(require("./components/autocomplete"));
@@ -61,6 +62,9 @@ var AutocompletePluginView = exports.default = /*#__PURE__*/function (_ReactPlug
       if (_this.enableRichInlineNodes && option.type === 'value' && option.valueType === 'user') {
         transaction.setMeta('hydrate', true);
       }
+      if (_this.enableRichInlineNodes && option.type === 'value' && option.valueType === 'team' && (0, _platformFeatureFlags.fg)('jira_update_jql_teams')) {
+        transaction.setMeta('hydrate', true);
+      }
       var documentFrom = (0, _getDocumentPosition.default)(transaction.doc, from);
       var documentTo = (0, _getDocumentPosition.default)(transaction.doc, to);
 

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

@@ -4,7 +4,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.richInlineNodes = void 0;
+var _team = require("./team");
 var _user = require("./user");
 var richInlineNodes = exports.richInlineNodes = {
-  user: _user.user
+  user: _user.user,
+  team: _team.team
 };

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

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.team = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireDefault(require("react"));
+var _avatar = _interopRequireDefault(require("@atlaskit/avatar"));
+var _state = require("../../../../state");
+var _styled = require("./styled");
+var Team = function Team(_ref) {
+  var id = _ref.id,
+    name = _ref.name,
+    fieldName = _ref.fieldName,
+    selected = _ref.selected,
+    error = _ref.error;
+  var _useHydratedTeam = (0, _state.useHydratedTeam)({
+      id: id,
+      fieldName: fieldName
+    }),
+    _useHydratedTeam2 = (0, _slicedToArray2.default)(_useHydratedTeam, 1),
+    team = _useHydratedTeam2[0];
+  return /*#__PURE__*/_react.default.createElement(_styled.TeamContainer, {
+    selected: selected,
+    error: error
+  }, /*#__PURE__*/_react.default.createElement(_styled.AvatarWrapper, null, /*#__PURE__*/_react.default.createElement(_avatar.default, {
+    src: team === null || team === void 0 ? void 0 : team.avatarUrl,
+    borderColor: "transparent",
+    size: "xsmall"
+  })), /*#__PURE__*/_react.default.createElement(_styled.NameContainer, null, name));
+};
+var team = exports.team = {
+  component: Team,
+  attrs: {
+    id: {},
+    name: {},
+    fieldName: {}
+  }
+};

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

@@ -0,0 +1,99 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TeamContainer = exports.NameContainer = exports.AvatarWrapper = void 0;
+var _react = require("@emotion/react");
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _colors = require("@atlaskit/theme/colors");
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+var TeamContainer = exports.TeamContainer = _styled.default.span({
+  display: 'inline-flex',
+  alignItems: 'baseline',
+  paddingLeft: "var(--ds-space-025, 2px)",
+  borderRadius: "var(--ds-radius-xlarge, 12px)",
+  cursor: 'pointer',
+  userSelect: 'none'
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
+function (_ref) {
+  var selected = _ref.selected,
+    error = _ref.error;
+  if (selected) {
+    if (error) {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      return (0, _react.css)({
+        color: "var(--ds-text-inverse, ".concat(_colors.N0, ")"),
+        backgroundColor: "var(--ds-background-danger-bold, ".concat(_colors.R400, ")"),
+        textDecoration: 'wavy underline',
+        textDecorationThickness: '1px',
+        textDecorationSkipInk: 'none',
+        textDecorationColor: "var(--ds-text-inverse, ".concat(_colors.N0, ")")
+      });
+    } else {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      return (0, _react.css)({
+        color: "var(--ds-text, ".concat(_colors.N0, ")"),
+        backgroundColor: "var(--ds-background-selected, ".concat(_colors.N500, ")"),
+        boxShadow: "0 0 0 1px ".concat("var(--ds-border-selected, transparent)")
+      });
+    }
+  } else {
+    if (error) {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      return (0, _react.css)({
+        color: "var(--ds-text-subtle, ".concat(_colors.N500, ")"),
+        backgroundColor: "var(--ds-background-neutral, ".concat(_colors.N40, ")"),
+        textDecoration: 'wavy underline',
+        textDecorationThickness: '1px',
+        textDecorationSkipInk: 'none',
+        textDecorationColor: "var(--ds-text-danger, ".concat(_colors.R400, ")"),
+        '&:hover': {
+          backgroundColor: "var(--ds-background-neutral-hovered, ".concat(_colors.N50, ")")
+        }
+      });
+    } else {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      return (0, _react.css)({
+        color: "var(--ds-text-subtle, ".concat(_colors.N500, ")"),
+        backgroundColor: "var(--ds-background-neutral, ".concat(_colors.N40, ")"),
+        '&:hover': {
+          backgroundColor: "var(--ds-background-neutral-hovered, ".concat(_colors.N50, ")")
+        }
+      });
+    }
+  }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+var NameContainer = exports.NameContainer = _styled.default.span({
+  marginLeft: "var(--ds-space-075, 6px)",
+  marginRight: "var(--ds-space-100, 8px)",
+  // eslint-disable-next-line -- Ignored via go/DSP-18766
+  lineHeight: "var(--ds-space-250, 20px)"
+});
+
+/* Override Avatar styles to match design spec */
+// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+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'
+  }
+});

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

@@ -88,5 +88,12 @@ var AvatarWrapper = exports.AvatarWrapper = _styled.default.div({
   // 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'
   }
 });

package/dist/cjs/plugins/rich-inline-nodes/util/replace-nodes-transaction.js

@@ -14,6 +14,7 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _jqlAst = require("@atlaskit/jql-ast");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _schema = require("../../../schema");
 var _getDocumentPosition = _interopRequireDefault(require("../../common/get-document-position"));
 var _jqlAst2 = require("../../jql-ast");
@@ -32,7 +33,7 @@ var replaceRichInlineNodes = exports.replaceRichInlineNodes = function replaceRi
       fieldName = _ref2[0],
       values = _ref2[1];
     values.forEach(function (value) {
-      if (value.type === 'user') {
+      if (value.type === 'user' || value.type === 'team' && (0, _platformFeatureFlags.fg)('jira_update_jql_teams')) {
         var astNodes = getValueNodes(ast, fieldName, value.id);
         astNodes.forEach(function (astNode) {
           if (astNode.position) {
@@ -61,6 +62,13 @@ var getRichInlineNode = function getRichInlineNode(fieldName, value, text) {
           fieldName: fieldName
         }), textContent);
       }
+    case 'team':
+      {
+        var _textContent = _schema.JQLEditorSchema.text(text);
+        return _schema.JQLEditorSchema.nodes.team.create(_objectSpread(_objectSpread({}, value), {}, {
+          fieldName: fieldName
+        }), _textContent);
+      }
     default:
       {
         throw new Error("Unsupported hydrated value type ".concat(value.type));

package/dist/cjs/state/index.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useStoreActions = exports.useScopedId = exports.useRichInlineNodesEnabled = exports.useOnSyntaxHelp = exports.useLineNumbersVisible = exports.useJqlError = exports.useIsSearching = exports.useIntl = exports.useIdPrefix = exports.useHydratedValue = exports.useHydratedUser = exports.useHydratedDeprecations = exports.useExternalMessages = exports.useEditorViewHasFocus = exports.useEditorView = exports.useEditorStateHasJqlError = exports.useEditorState = exports.useCustomErrorComponent = exports.useAutocompleteProvider = exports.useAutocompletePosition = exports.useAutocompleteOptions = exports.useAutocompleteLoading = exports.useAutocompleteIsOpen = exports.useAutocomplete = exports.initialState = exports.actions = exports.EditorStateContainer = void 0;
+exports.useStoreActions = exports.useScopedId = exports.useRichInlineNodesEnabled = exports.useOnSyntaxHelp = exports.useLineNumbersVisible = exports.useJqlError = exports.useIsSearching = exports.useIntl = exports.useIdPrefix = exports.useHydratedValue = exports.useHydratedUser = exports.useHydratedTeam = exports.useHydratedDeprecations = exports.useExternalMessages = exports.useEditorViewHasFocus = exports.useEditorView = exports.useEditorStateHasJqlError = exports.useEditorState = exports.useCustomErrorComponent = exports.useAutocompleteProvider = exports.useAutocompletePosition = exports.useAutocompleteOptions = exports.useAutocompleteLoading = exports.useAutocompleteIsOpen = exports.useAutocomplete = exports.initialState = exports.actions = exports.EditorStateContainer = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
@@ -909,16 +909,25 @@ var useHydratedUser = exports.useHydratedUser = (0, _reactSweetState.createHook)
     return user && user.type === 'user' ? user : undefined;
   }
 });
+var useHydratedTeam = exports.useHydratedTeam = (0, _reactSweetState.createHook)(Store, {
+  selector: function selector(state, _ref40) {
+    var _state$hydratedValues3;
+    var id = _ref40.id,
+      fieldName = _ref40.fieldName;
+    var team = (_state$hydratedValues3 = state.hydratedValues[fieldName]) === null || _state$hydratedValues3 === void 0 ? void 0 : _state$hydratedValues3.get(id);
+    return team && team.type === 'team' ? team : undefined;
+  }
+});
 var useHydratedDeprecations = exports.useHydratedDeprecations = (0, _reactSweetState.createHook)(Store, {
   selector: function selector(state) {
     var ast = (0, _jqlAst2.getJastFromState)(state.editorState);
     var fieldsInQuery = (0, _util.getFieldNodes)(ast);
     var toReturn = [];
-    Object.entries(state.hydratedValues).forEach(function (_ref40) {
-      var _state$hydratedValues3;
-      var _ref41 = (0, _slicedToArray2.default)(_ref40, 1),
-        fieldName = _ref41[0];
-      (_state$hydratedValues3 = state.hydratedValues[fieldName]) === null || _state$hydratedValues3 === void 0 || _state$hydratedValues3.forEach(function (value) {
+    Object.entries(state.hydratedValues).forEach(function (_ref41) {
+      var _state$hydratedValues4;
+      var _ref42 = (0, _slicedToArray2.default)(_ref41, 1),
+        fieldName = _ref42[0];
+      (_state$hydratedValues4 = state.hydratedValues[fieldName]) === null || _state$hydratedValues4 === void 0 || _state$hydratedValues4.forEach(function (value) {
         if (value.type === 'deprecated-field') {
           if (fieldsInQuery.has(value.id.toLowerCase())) {
             toReturn.push(value);
@@ -941,19 +950,19 @@ var useOnSyntaxHelp = exports.useOnSyntaxHelp = (0, _reactSweetState.createHook)
 });
 var EditorStateContainer = exports.EditorStateContainer = (0, _reactSweetState.createContainer)(Store, {
   onInit: function onInit() {
-    return function (_ref42, _ref43) {
-      var getState = _ref42.getState,
-        setState = _ref42.setState,
-        dispatch = _ref42.dispatch;
-      var intlRef = _ref43.intlRef,
-        query = _ref43.query,
-        isSearching = _ref43.isSearching,
-        autocompleteProvider = _ref43.autocompleteProvider,
-        externalMessages = _ref43.externalMessages,
-        enableRichInlineNodes = _ref43.enableRichInlineNodes,
-        onDebugUnsafeMessage = _ref43.onDebugUnsafeMessage,
-        onSyntaxHelp = _ref43.onSyntaxHelp,
-        customComponents = _ref43.customComponents;
+    return function (_ref43, _ref44) {
+      var getState = _ref43.getState,
+        setState = _ref43.setState,
+        dispatch = _ref43.dispatch;
+      var intlRef = _ref44.intlRef,
+        query = _ref44.query,
+        isSearching = _ref44.isSearching,
+        autocompleteProvider = _ref44.autocompleteProvider,
+        externalMessages = _ref44.externalMessages,
+        enableRichInlineNodes = _ref44.enableRichInlineNodes,
+        onDebugUnsafeMessage = _ref44.onDebugUnsafeMessage,
+        onSyntaxHelp = _ref44.onSyntaxHelp,
+        customComponents = _ref44.customComponents;
       setState({
         controlledQuery: query,
         query: query,
@@ -981,18 +990,18 @@ var EditorStateContainer = exports.EditorStateContainer = (0, _reactSweetState.c
     };
   },
   onUpdate: function onUpdate() {
-    return function (_ref44, _ref45) {
-      var getState = _ref44.getState,
-        setState = _ref44.setState,
-        dispatch = _ref44.dispatch;
-      var controlledQueryProp = _ref45.query,
-        isSearching = _ref45.isSearching,
-        autocompleteProvider = _ref45.autocompleteProvider,
-        externalMessages = _ref45.externalMessages,
-        enableRichInlineNodes = _ref45.enableRichInlineNodes,
-        onDebugUnsafeMessage = _ref45.onDebugUnsafeMessage,
-        onSyntaxHelp = _ref45.onSyntaxHelp,
-        customComponents = _ref45.customComponents;
+    return function (_ref45, _ref46) {
+      var getState = _ref45.getState,
+        setState = _ref45.setState,
+        dispatch = _ref45.dispatch;
+      var controlledQueryProp = _ref46.query,
+        isSearching = _ref46.isSearching,
+        autocompleteProvider = _ref46.autocompleteProvider,
+        externalMessages = _ref46.externalMessages,
+        enableRichInlineNodes = _ref46.enableRichInlineNodes,
+        onDebugUnsafeMessage = _ref46.onDebugUnsafeMessage,
+        onSyntaxHelp = _ref46.onSyntaxHelp,
+        customComponents = _ref46.customComponents;
       var _getState12 = getState(),
         controlledQuery = _getState12.controlledQuery,
         query = _getState12.query;

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.6.3", ANALYTICS_CHANNEL);
+  return useJqlPackageAnalytics(analyticsSource, "@atlaskit/jql-editor", "0.0.0-development", ANALYTICS_CHANNEL);
 };

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

@@ -2,6 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { isListOperator } from '@atlaskit/jql-ast';
+import { fg } from '@atlaskit/platform-feature-flags';
 import getDocumentPosition from '../common/get-document-position';
 import ReactPluginView from '../common/react-plugin-view';
 import Autocomplete from './components/autocomplete';
@@ -44,6 +45,9 @@ export default class AutocompletePluginView extends ReactPluginView {
       if (this.enableRichInlineNodes && option.type === 'value' && option.valueType === 'user') {
         transaction.setMeta('hydrate', true);
       }
+      if (this.enableRichInlineNodes && option.type === 'value' && option.valueType === 'team' && fg('jira_update_jql_teams')) {
+        transaction.setMeta('hydrate', true);
+      }
       const documentFrom = getDocumentPosition(transaction.doc, from);
       const documentTo = getDocumentPosition(transaction.doc, to);
 

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

@@ -1,4 +1,6 @@
+import { team } from './team';
 import { user } from './user';
 export const richInlineNodes = {
-  user
+  user,
+  team
 };

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

@@ -0,0 +1,32 @@
+import React from 'react';
+import Avatar from '@atlaskit/avatar';
+import { useHydratedTeam } from '../../../../state';
+import { AvatarWrapper, NameContainer, TeamContainer } from './styled';
+const Team = ({
+  id,
+  name,
+  fieldName,
+  selected,
+  error
+}) => {
+  const [team] = useHydratedTeam({
+    id,
+    fieldName
+  });
+  return /*#__PURE__*/React.createElement(TeamContainer, {
+    selected: selected,
+    error: error
+  }, /*#__PURE__*/React.createElement(AvatarWrapper, null, /*#__PURE__*/React.createElement(Avatar, {
+    src: team === null || team === void 0 ? void 0 : team.avatarUrl,
+    borderColor: "transparent",
+    size: "xsmall"
+  })), /*#__PURE__*/React.createElement(NameContainer, null, name));
+};
+export const team = {
+  component: Team,
+  attrs: {
+    id: {},
+    name: {},
+    fieldName: {}
+  }
+};

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

@@ -0,0 +1,91 @@
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+import { css } from '@emotion/react';
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+import styled from '@emotion/styled';
+import { N0, N40, N50, N500, R400 } from '@atlaskit/theme/colors';
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export const TeamContainer = styled.span({
+  display: 'inline-flex',
+  alignItems: 'baseline',
+  paddingLeft: `${"var(--ds-space-025, 2px)"}`,
+  borderRadius: "var(--ds-radius-xlarge, 12px)",
+  cursor: 'pointer',
+  userSelect: 'none'
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
+({
+  selected,
+  error
+}) => {
+  if (selected) {
+    if (error) {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      return css({
+        color: `var(--ds-text-inverse, ${N0})`,
+        backgroundColor: `var(--ds-background-danger-bold, ${R400})`,
+        textDecoration: 'wavy underline',
+        textDecorationThickness: '1px',
+        textDecorationSkipInk: 'none',
+        textDecorationColor: `var(--ds-text-inverse, ${N0})`
+      });
+    } else {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      return css({
+        color: `var(--ds-text, ${N0})`,
+        backgroundColor: `var(--ds-background-selected, ${N500})`,
+        boxShadow: `0 0 0 1px ${"var(--ds-border-selected, transparent)"}`
+      });
+    }
+  } else {
+    if (error) {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      return css({
+        color: `var(--ds-text-subtle, ${N500})`,
+        backgroundColor: `var(--ds-background-neutral, ${N40})`,
+        textDecoration: 'wavy underline',
+        textDecorationThickness: '1px',
+        textDecorationSkipInk: 'none',
+        textDecorationColor: `var(--ds-text-danger, ${R400})`,
+        '&:hover': {
+          backgroundColor: `var(--ds-background-neutral-hovered, ${N50})`
+        }
+      });
+    } else {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      return css({
+        color: `var(--ds-text-subtle, ${N500})`,
+        backgroundColor: `var(--ds-background-neutral, ${N40})`,
+        '&:hover': {
+          backgroundColor: `var(--ds-background-neutral-hovered, ${N50})`
+        }
+      });
+    }
+  }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export const NameContainer = styled.span({
+  marginLeft: "var(--ds-space-075, 6px)",
+  marginRight: "var(--ds-space-100, 8px)",
+  // eslint-disable-next-line -- Ignored via go/DSP-18766
+  lineHeight: "var(--ds-space-250, 20px)"
+});
+
+/* Override Avatar styles to match design spec */
+// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+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'
+  }
+});

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

@@ -80,5 +80,12 @@ export const AvatarWrapper = styled.div({
   // 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'
   }
 });

package/dist/es2019/plugins/rich-inline-nodes/util/replace-nodes-transaction.js

@@ -1,5 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import { AbstractJastVisitor } from '@atlaskit/jql-ast';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { JQLEditorSchema } from '../../../schema';
 import getDocumentPosition from '../../common/get-document-position';
 import { getJastFromState } from '../../jql-ast';
@@ -11,7 +12,7 @@ export const replaceRichInlineNodes = (editorState, hydratedValues) => {
   transaction.setMeta('addToHistory', false);
   Object.entries(hydratedValues).forEach(([fieldName, values]) => {
     values.forEach(value => {
-      if (value.type === 'user') {
+      if (value.type === 'user' || value.type === 'team' && fg('jira_update_jql_teams')) {
         const astNodes = getValueNodes(ast, fieldName, value.id);
         astNodes.forEach(astNode => {
           if (astNode.position) {
@@ -39,6 +40,14 @@ const getRichInlineNode = (fieldName, value, text) => {
           fieldName
         }, textContent);
       }
+    case 'team':
+      {
+        const textContent = JQLEditorSchema.text(text);
+        return JQLEditorSchema.nodes.team.create({
+          ...value,
+          fieldName
+        }, textContent);
+      }
     default:
       {
         throw new Error(`Unsupported hydrated value type ${value.type}`);

package/dist/es2019/state/index.js

@@ -882,14 +882,24 @@ export const useHydratedUser = createHook(Store, {
     return user && user.type === 'user' ? user : undefined;
   }
 });
+export const useHydratedTeam = createHook(Store, {
+  selector: (state, {
+    id,
+    fieldName
+  }) => {
+    var _state$hydratedValues3;
+    const team = (_state$hydratedValues3 = state.hydratedValues[fieldName]) === null || _state$hydratedValues3 === void 0 ? void 0 : _state$hydratedValues3.get(id);
+    return team && team.type === 'team' ? team : undefined;
+  }
+});
 export const useHydratedDeprecations = createHook(Store, {
   selector: state => {
     const ast = getJastFromState(state.editorState);
     const fieldsInQuery = getFieldNodes(ast);
     const toReturn = [];
     Object.entries(state.hydratedValues).forEach(([fieldName]) => {
-      var _state$hydratedValues3;
-      (_state$hydratedValues3 = state.hydratedValues[fieldName]) === null || _state$hydratedValues3 === void 0 ? void 0 : _state$hydratedValues3.forEach(value => {
+      var _state$hydratedValues4;
+      (_state$hydratedValues4 = state.hydratedValues[fieldName]) === null || _state$hydratedValues4 === void 0 ? void 0 : _state$hydratedValues4.forEach(value => {
         if (value.type === 'deprecated-field') {
           if (fieldsInQuery.has(value.id.toLowerCase())) {
             toReturn.push(value);

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.6.3", ANALYTICS_CHANNEL);
+  return useJqlPackageAnalytics(analyticsSource, "@atlaskit/jql-editor", "0.0.0-development", ANALYTICS_CHANNEL);
 };

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

@@ -10,6 +10,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { isListOperator } from '@atlaskit/jql-ast';
+import { fg } from '@atlaskit/platform-feature-flags';
 import getDocumentPosition from '../common/get-document-position';
 import ReactPluginView from '../common/react-plugin-view';
 import Autocomplete from './components/autocomplete';
@@ -55,6 +56,9 @@ var AutocompletePluginView = /*#__PURE__*/function (_ReactPluginView) {
       if (_this.enableRichInlineNodes && option.type === 'value' && option.valueType === 'user') {
         transaction.setMeta('hydrate', true);
       }
+      if (_this.enableRichInlineNodes && option.type === 'value' && option.valueType === 'team' && fg('jira_update_jql_teams')) {
+        transaction.setMeta('hydrate', true);
+      }
       var documentFrom = getDocumentPosition(transaction.doc, from);
       var documentTo = getDocumentPosition(transaction.doc, to);
 

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

@@ -1,4 +1,6 @@
+import { team } from './team';
 import { user } from './user';
 export var richInlineNodes = {
-  user: user
+  user: user,
+  team: team
 };

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

@@ -0,0 +1,34 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import React from 'react';
+import Avatar from '@atlaskit/avatar';
+import { useHydratedTeam } from '../../../../state';
+import { AvatarWrapper, NameContainer, TeamContainer } from './styled';
+var Team = function Team(_ref) {
+  var id = _ref.id,
+    name = _ref.name,
+    fieldName = _ref.fieldName,
+    selected = _ref.selected,
+    error = _ref.error;
+  var _useHydratedTeam = useHydratedTeam({
+      id: id,
+      fieldName: fieldName
+    }),
+    _useHydratedTeam2 = _slicedToArray(_useHydratedTeam, 1),
+    team = _useHydratedTeam2[0];
+  return /*#__PURE__*/React.createElement(TeamContainer, {
+    selected: selected,
+    error: error
+  }, /*#__PURE__*/React.createElement(AvatarWrapper, null, /*#__PURE__*/React.createElement(Avatar, {
+    src: team === null || team === void 0 ? void 0 : team.avatarUrl,
+    borderColor: "transparent",
+    size: "xsmall"
+  })), /*#__PURE__*/React.createElement(NameContainer, null, name));
+};
+export var team = {
+  component: Team,
+  attrs: {
+    id: {},
+    name: {},
+    fieldName: {}
+  }
+};

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

@@ -0,0 +1,90 @@
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+import { css } from '@emotion/react';
+// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
+import styled from '@emotion/styled';
+import { N0, N40, N50, N500, R400 } from '@atlaskit/theme/colors';
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export var TeamContainer = styled.span({
+  display: 'inline-flex',
+  alignItems: 'baseline',
+  paddingLeft: "var(--ds-space-025, 2px)",
+  borderRadius: "var(--ds-radius-xlarge, 12px)",
+  cursor: 'pointer',
+  userSelect: 'none'
+},
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-dynamic-styles -- Ignored via go/DSP-18766
+function (_ref) {
+  var selected = _ref.selected,
+    error = _ref.error;
+  if (selected) {
+    if (error) {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      return css({
+        color: "var(--ds-text-inverse, ".concat(N0, ")"),
+        backgroundColor: "var(--ds-background-danger-bold, ".concat(R400, ")"),
+        textDecoration: 'wavy underline',
+        textDecorationThickness: '1px',
+        textDecorationSkipInk: 'none',
+        textDecorationColor: "var(--ds-text-inverse, ".concat(N0, ")")
+      });
+    } else {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      return css({
+        color: "var(--ds-text, ".concat(N0, ")"),
+        backgroundColor: "var(--ds-background-selected, ".concat(N500, ")"),
+        boxShadow: "0 0 0 1px ".concat("var(--ds-border-selected, transparent)")
+      });
+    }
+  } else {
+    if (error) {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      return css({
+        color: "var(--ds-text-subtle, ".concat(N500, ")"),
+        backgroundColor: "var(--ds-background-neutral, ".concat(N40, ")"),
+        textDecoration: 'wavy underline',
+        textDecorationThickness: '1px',
+        textDecorationSkipInk: 'none',
+        textDecorationColor: "var(--ds-text-danger, ".concat(R400, ")"),
+        '&:hover': {
+          backgroundColor: "var(--ds-background-neutral-hovered, ".concat(N50, ")")
+        }
+      });
+    } else {
+      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
+      return css({
+        color: "var(--ds-text-subtle, ".concat(N500, ")"),
+        backgroundColor: "var(--ds-background-neutral, ".concat(N40, ")"),
+        '&:hover': {
+          backgroundColor: "var(--ds-background-neutral-hovered, ".concat(N50, ")")
+        }
+      });
+    }
+  }
+});
+
+// eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+export var NameContainer = styled.span({
+  marginLeft: "var(--ds-space-075, 6px)",
+  marginRight: "var(--ds-space-100, 8px)",
+  // eslint-disable-next-line -- Ignored via go/DSP-18766
+  lineHeight: "var(--ds-space-250, 20px)"
+});
+
+/* Override Avatar styles to match design spec */
+// eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage, @atlaskit/ui-styling-standard/no-styled, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
+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'
+  }
+});

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

@@ -79,5 +79,12 @@ export var AvatarWrapper = styled.div({
   // 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'
   }
 });

package/dist/esm/plugins/rich-inline-nodes/util/replace-nodes-transaction.js

@@ -11,6 +11,7 @@ function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.
 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) { _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 { AbstractJastVisitor } from '@atlaskit/jql-ast';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { JQLEditorSchema } from '../../../schema';
 import getDocumentPosition from '../../common/get-document-position';
 import { getJastFromState } from '../../jql-ast';
@@ -25,7 +26,7 @@ export var replaceRichInlineNodes = function replaceRichInlineNodes(editorState,
       fieldName = _ref2[0],
       values = _ref2[1];
     values.forEach(function (value) {
-      if (value.type === 'user') {
+      if (value.type === 'user' || value.type === 'team' && fg('jira_update_jql_teams')) {
         var astNodes = getValueNodes(ast, fieldName, value.id);
         astNodes.forEach(function (astNode) {
           if (astNode.position) {
@@ -54,6 +55,13 @@ var getRichInlineNode = function getRichInlineNode(fieldName, value, text) {
           fieldName: fieldName
         }), textContent);
       }
+    case 'team':
+      {
+        var _textContent = JQLEditorSchema.text(text);
+        return JQLEditorSchema.nodes.team.create(_objectSpread(_objectSpread({}, value), {}, {
+          fieldName: fieldName
+        }), _textContent);
+      }
     default:
       {
         throw new Error("Unsupported hydrated value type ".concat(value.type));

package/dist/esm/state/index.js

@@ -902,16 +902,25 @@ export var useHydratedUser = createHook(Store, {
     return user && user.type === 'user' ? user : undefined;
   }
 });
+export var useHydratedTeam = createHook(Store, {
+  selector: function selector(state, _ref40) {
+    var _state$hydratedValues3;
+    var id = _ref40.id,
+      fieldName = _ref40.fieldName;
+    var team = (_state$hydratedValues3 = state.hydratedValues[fieldName]) === null || _state$hydratedValues3 === void 0 ? void 0 : _state$hydratedValues3.get(id);
+    return team && team.type === 'team' ? team : undefined;
+  }
+});
 export var useHydratedDeprecations = createHook(Store, {
   selector: function selector(state) {
     var ast = getJastFromState(state.editorState);
     var fieldsInQuery = getFieldNodes(ast);
     var toReturn = [];
-    Object.entries(state.hydratedValues).forEach(function (_ref40) {
-      var _state$hydratedValues3;
-      var _ref41 = _slicedToArray(_ref40, 1),
-        fieldName = _ref41[0];
-      (_state$hydratedValues3 = state.hydratedValues[fieldName]) === null || _state$hydratedValues3 === void 0 || _state$hydratedValues3.forEach(function (value) {
+    Object.entries(state.hydratedValues).forEach(function (_ref41) {
+      var _state$hydratedValues4;
+      var _ref42 = _slicedToArray(_ref41, 1),
+        fieldName = _ref42[0];
+      (_state$hydratedValues4 = state.hydratedValues[fieldName]) === null || _state$hydratedValues4 === void 0 || _state$hydratedValues4.forEach(function (value) {
         if (value.type === 'deprecated-field') {
           if (fieldsInQuery.has(value.id.toLowerCase())) {
             toReturn.push(value);
@@ -934,19 +943,19 @@ export var useOnSyntaxHelp = createHook(Store, {
 });
 export var EditorStateContainer = createContainer(Store, {
   onInit: function onInit() {
-    return function (_ref42, _ref43) {
-      var getState = _ref42.getState,
-        setState = _ref42.setState,
-        dispatch = _ref42.dispatch;
-      var intlRef = _ref43.intlRef,
-        query = _ref43.query,
-        isSearching = _ref43.isSearching,
-        autocompleteProvider = _ref43.autocompleteProvider,
-        externalMessages = _ref43.externalMessages,
-        enableRichInlineNodes = _ref43.enableRichInlineNodes,
-        onDebugUnsafeMessage = _ref43.onDebugUnsafeMessage,
-        onSyntaxHelp = _ref43.onSyntaxHelp,
-        customComponents = _ref43.customComponents;
+    return function (_ref43, _ref44) {
+      var getState = _ref43.getState,
+        setState = _ref43.setState,
+        dispatch = _ref43.dispatch;
+      var intlRef = _ref44.intlRef,
+        query = _ref44.query,
+        isSearching = _ref44.isSearching,
+        autocompleteProvider = _ref44.autocompleteProvider,
+        externalMessages = _ref44.externalMessages,
+        enableRichInlineNodes = _ref44.enableRichInlineNodes,
+        onDebugUnsafeMessage = _ref44.onDebugUnsafeMessage,
+        onSyntaxHelp = _ref44.onSyntaxHelp,
+        customComponents = _ref44.customComponents;
       setState({
         controlledQuery: query,
         query: query,
@@ -974,18 +983,18 @@ export var EditorStateContainer = createContainer(Store, {
     };
   },
   onUpdate: function onUpdate() {
-    return function (_ref44, _ref45) {
-      var getState = _ref44.getState,
-        setState = _ref44.setState,
-        dispatch = _ref44.dispatch;
-      var controlledQueryProp = _ref45.query,
-        isSearching = _ref45.isSearching,
-        autocompleteProvider = _ref45.autocompleteProvider,
-        externalMessages = _ref45.externalMessages,
-        enableRichInlineNodes = _ref45.enableRichInlineNodes,
-        onDebugUnsafeMessage = _ref45.onDebugUnsafeMessage,
-        onSyntaxHelp = _ref45.onSyntaxHelp,
-        customComponents = _ref45.customComponents;
+    return function (_ref45, _ref46) {
+      var getState = _ref45.getState,
+        setState = _ref45.setState,
+        dispatch = _ref45.dispatch;
+      var controlledQueryProp = _ref46.query,
+        isSearching = _ref46.isSearching,
+        autocompleteProvider = _ref46.autocompleteProvider,
+        externalMessages = _ref46.externalMessages,
+        enableRichInlineNodes = _ref46.enableRichInlineNodes,
+        onDebugUnsafeMessage = _ref46.onDebugUnsafeMessage,
+        onSyntaxHelp = _ref46.onSyntaxHelp,
+        customComponents = _ref46.customComponents;
       var _getState12 = getState(),
         controlledQuery = _getState12.controlledQuery,
         query = _getState12.query;

package/dist/types/index.d.ts

@@ -2,4 +2,4 @@ export { default as JQLEditor } from './ui';
 export { JQLEditorAsync, preloadJQLEditor } from './async';
 export { JQLEditorReadOnly } from './ui/jql-editor-layout';
 export { JQLEditorAnalyticsListener, ANALYTICS_CHANNEL, useJqlPackageAnalytics, EventType, } from './analytics';
-export type { ListenerProps, JqlAnalyticsEvent, JQLEditorUIProps, JQLEditorProps, HydratedValue, HydratedValues, HydratedUser, AutocompleteOption, AutocompleteValueType, AutocompleteOptions, AutocompleteProvider, JQLClause, ExternalMessage, ExternalError, ExternalWarning, ExternalInfo, CustomComponents, } from './types';
+export type { ListenerProps, JqlAnalyticsEvent, JQLEditorUIProps, JQLEditorProps, HydratedValue, HydratedValues, HydratedUser, HydratedTeam, AutocompleteOption, AutocompleteValueType, AutocompleteOptions, AutocompleteProvider, JQLClause, ExternalMessage, ExternalError, ExternalWarning, ExternalInfo, CustomComponents, } from './types';

package/dist/types/plugins/rich-inline-nodes/nodes/index.d.ts

@@ -1,3 +1,4 @@
 export declare const richInlineNodes: {
     user: import("./types").JQLNodeSpec<import("./user").Props>;
+    team: import("./types").JQLNodeSpec<import("./team").Props>;
 };

package/dist/types/plugins/rich-inline-nodes/nodes/team/index.d.ts

@@ -0,0 +1,7 @@
+import { type JQLNodeSpec } from '../types';
+export type Props = {
+    fieldName: string;
+    id: string;
+    name: string;
+};
+export declare const team: JQLNodeSpec<Props>;

package/dist/types/plugins/rich-inline-nodes/nodes/team/styled.d.ts

@@ -0,0 +1,15 @@
+export declare const TeamContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    error: boolean;
+    selected: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const NameContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const AvatarWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/types/state/index.d.ts

@@ -10,7 +10,7 @@ import { type JqlEditorAnalyticsEvent } from '../analytics';
 import { type AutocompleteOptionGroup, type AutocompleteOptions, type AutocompleteOptionType, type SelectableAutocompleteOption } from '../plugins/autocomplete/components/types';
 import { type AutocompleteProvider } from '../plugins/types';
 import { type PortalActions } from '../ui/jql-editor-portal-provider/types';
-import { type HydratedDeprecatedField, type HydratedUser, type HydratedValue } from '../ui/jql-editor/types';
+import { type HydratedDeprecatedField, type HydratedTeam, type HydratedUser, type HydratedValue } from '../ui/jql-editor/types';
 import { type AutocompletePosition, type AutocompleteState, type ContextAwareJQLSuggestions, type CustomErrorComponent, type ExternalMessagesNormalized, type OptionsKey, type Props, type State } from './types';
 export declare const initialState: State;
 export declare const actions: {
@@ -729,6 +729,41 @@ export declare const useHydratedUser: import("react-sweet-state").HookFunction<H
     fieldName: string;
     id: string;
 }>;
+export declare const useHydratedTeam: import("react-sweet-state").HookFunction<HydratedTeam | undefined, import("react-sweet-state").BoundActions<State, {
+    onEditorViewBlur: () => Action<State>;
+    onEditorViewFocus: (event: FocusEvent<HTMLElement>) => Action<State, Props>;
+    openAutocompleteOnNextUpdate: () => Action<State>;
+    closeAutocomplete: () => Action<State>;
+    setSelectedAutocompleteOptionId: (selectedOptionId: string | undefined) => Action<State>;
+    getAutocompleteSuggestions: (editorState: EditorState) => Action<State>;
+    getAutocompleteOptions: (suggestions: ContextAwareJQLSuggestions) => Action<State>;
+    appendOptionsForObservable: (key: OptionsKey, observable: Observable<AutocompleteOptions>, rule: JQLRuleSuggestion, type: AutocompleteOptionType) => Action<State, void, Observable<AutocompleteOptions>>;
+    cancelSubscription: () => Action<State>;
+    setLoading: (loading: boolean) => Action<State>;
+    setAutocompleteOptions: (options: AutocompleteOptionGroup) => Action<State>;
+    setAutocompleteContainer: (container: HTMLElement | null) => Action<State>;
+    callAutocompleteProviders: ({ rules, tokens }: ContextAwareJQLSuggestions) => Action<State>;
+    updateValidationState: () => Action<State>;
+    initialiseEditorState: () => Action<State, Props>;
+    configurePlugins: (portalActions: PortalActions | void) => Action<State, Props>;
+    onApplyEditorTransaction: (transaction: Transaction) => Action<State, Props>;
+    resetEditorState: (query: string, addToHistory?: boolean) => Action<State>;
+    initialiseEditorView: (editorViewNode: HTMLElement, attributes: {
+        [key: string]: string;
+    }, portalActions: PortalActions) => Action<State, Props>;
+    updateEditorView: (attributes: {
+        [key: string]: string;
+    }) => Action<State, Props>;
+    setEditorViewContainer: (editorViewContainer: HTMLElement) => Action<State>;
+    setEditorViewContainerScroll: (scroll: number) => Action<State>;
+    onSearch: () => Action<State>;
+    onSearchCommand: (pmState: EditorState, pmDispatch: ((tr: Transaction) => void) | undefined, pmView: EditorView | undefined, keyboardShortcut: boolean) => Action<State, Props, boolean>;
+    externalErrorMessageViewed: () => Action<State, Props>;
+    createAndFireAnalyticsEvent: (payload: JqlEditorAnalyticsEvent) => Action<State, Props>;
+}>, {
+    fieldName: string;
+    id: string;
+}>;
 export declare const useHydratedDeprecations: import("react-sweet-state").HookFunction<HydratedDeprecatedField[], import("react-sweet-state").BoundActions<State, {
     onEditorViewBlur: () => Action<State>;
     onEditorViewFocus: (event: FocusEvent<HTMLElement>) => Action<State, Props>;

package/dist/types/types.d.ts

@@ -1,5 +1,5 @@
 export type { JQLClause } from '@atlaskit/jql-autocomplete';
-export type { JQLEditorUIProps, JQLEditorProps, HydratedValues, HydratedValue, HydratedUser, } from './ui/types';
+export type { JQLEditorUIProps, JQLEditorProps, HydratedValues, HydratedValue, HydratedUser, HydratedTeam, } from './ui/types';
 export type { ExternalMessage, ExternalError, ExternalWarning, ExternalInfo, CustomComponents, } from './state/types';
 export type { AutocompleteProvider, AutocompleteOptions, AutocompleteOption, AutocompleteValueType, } from './plugins/types';
 export type { ListenerProps, JqlAnalyticsEvent } from './analytics';

package/dist/types/ui/jql-editor/types.d.ts

@@ -8,6 +8,12 @@ export type HydratedUser = {
     name: string;
     type: 'user';
 };
+export type HydratedTeam = {
+    avatarUrl: string;
+    id: string;
+    name: string;
+    type: 'team';
+};
 export type HydratedDeprecatedField = {
     deprecatedSearcherKey: string;
     /**
@@ -16,7 +22,7 @@ export type HydratedDeprecatedField = {
     id: string;
     type: 'deprecated-field';
 };
-export type HydratedValue = HydratedUser | HydratedDeprecatedField;
+export type HydratedValue = HydratedUser | HydratedTeam | HydratedDeprecatedField;
 export type HydratedValues = {
     [fieldName: string]: HydratedValue[];
 };

package/dist/types/ui/types.d.ts

@@ -1,5 +1,5 @@
 import { type JQLEditorUIProps } from './jql-editor/types';
-export type { JQLEditorUIProps, HydratedValue, HydratedValues, HydratedUser, } from './jql-editor/types';
+export type { JQLEditorUIProps, HydratedValue, HydratedValues, HydratedUser, HydratedTeam, } from './jql-editor/types';
 export type JQLEditorProps = JQLEditorUIProps & {
     /**
      * React-intl locale. This should be set to "en" if alternate message sets are not being loaded higher in the React

package/dist/types-ts4.5/index.d.ts

@@ -2,4 +2,4 @@ export { default as JQLEditor } from './ui';
 export { JQLEditorAsync, preloadJQLEditor } from './async';
 export { JQLEditorReadOnly } from './ui/jql-editor-layout';
 export { JQLEditorAnalyticsListener, ANALYTICS_CHANNEL, useJqlPackageAnalytics, EventType, } from './analytics';
-export type { ListenerProps, JqlAnalyticsEvent, JQLEditorUIProps, JQLEditorProps, HydratedValue, HydratedValues, HydratedUser, AutocompleteOption, AutocompleteValueType, AutocompleteOptions, AutocompleteProvider, JQLClause, ExternalMessage, ExternalError, ExternalWarning, ExternalInfo, CustomComponents, } from './types';
+export type { ListenerProps, JqlAnalyticsEvent, JQLEditorUIProps, JQLEditorProps, HydratedValue, HydratedValues, HydratedUser, HydratedTeam, AutocompleteOption, AutocompleteValueType, AutocompleteOptions, AutocompleteProvider, JQLClause, ExternalMessage, ExternalError, ExternalWarning, ExternalInfo, CustomComponents, } from './types';

package/dist/types-ts4.5/plugins/rich-inline-nodes/nodes/index.d.ts

@@ -1,3 +1,4 @@
 export declare const richInlineNodes: {
     user: import("./types").JQLNodeSpec<import("./user").Props>;
+    team: import("./types").JQLNodeSpec<import("./team").Props>;
 };

package/dist/types-ts4.5/plugins/rich-inline-nodes/nodes/team/index.d.ts

@@ -0,0 +1,7 @@
+import { type JQLNodeSpec } from '../types';
+export type Props = {
+    fieldName: string;
+    id: string;
+    name: string;
+};
+export declare const team: JQLNodeSpec<Props>;

package/dist/types-ts4.5/plugins/rich-inline-nodes/nodes/team/styled.d.ts

@@ -0,0 +1,15 @@
+export declare const TeamContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+} & {
+    error: boolean;
+    selected: boolean;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const NameContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const AvatarWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/types-ts4.5/state/index.d.ts

@@ -10,7 +10,7 @@ import { type JqlEditorAnalyticsEvent } from '../analytics';
 import { type AutocompleteOptionGroup, type AutocompleteOptions, type AutocompleteOptionType, type SelectableAutocompleteOption } from '../plugins/autocomplete/components/types';
 import { type AutocompleteProvider } from '../plugins/types';
 import { type PortalActions } from '../ui/jql-editor-portal-provider/types';
-import { type HydratedDeprecatedField, type HydratedUser, type HydratedValue } from '../ui/jql-editor/types';
+import { type HydratedDeprecatedField, type HydratedTeam, type HydratedUser, type HydratedValue } from '../ui/jql-editor/types';
 import { type AutocompletePosition, type AutocompleteState, type ContextAwareJQLSuggestions, type CustomErrorComponent, type ExternalMessagesNormalized, type OptionsKey, type Props, type State } from './types';
 export declare const initialState: State;
 export declare const actions: {
@@ -729,6 +729,41 @@ export declare const useHydratedUser: import("react-sweet-state").HookFunction<H
     fieldName: string;
     id: string;
 }>;
+export declare const useHydratedTeam: import("react-sweet-state").HookFunction<HydratedTeam | undefined, import("react-sweet-state").BoundActions<State, {
+    onEditorViewBlur: () => Action<State>;
+    onEditorViewFocus: (event: FocusEvent<HTMLElement>) => Action<State, Props>;
+    openAutocompleteOnNextUpdate: () => Action<State>;
+    closeAutocomplete: () => Action<State>;
+    setSelectedAutocompleteOptionId: (selectedOptionId: string | undefined) => Action<State>;
+    getAutocompleteSuggestions: (editorState: EditorState) => Action<State>;
+    getAutocompleteOptions: (suggestions: ContextAwareJQLSuggestions) => Action<State>;
+    appendOptionsForObservable: (key: OptionsKey, observable: Observable<AutocompleteOptions>, rule: JQLRuleSuggestion, type: AutocompleteOptionType) => Action<State, void, Observable<AutocompleteOptions>>;
+    cancelSubscription: () => Action<State>;
+    setLoading: (loading: boolean) => Action<State>;
+    setAutocompleteOptions: (options: AutocompleteOptionGroup) => Action<State>;
+    setAutocompleteContainer: (container: HTMLElement | null) => Action<State>;
+    callAutocompleteProviders: ({ rules, tokens }: ContextAwareJQLSuggestions) => Action<State>;
+    updateValidationState: () => Action<State>;
+    initialiseEditorState: () => Action<State, Props>;
+    configurePlugins: (portalActions: PortalActions | void) => Action<State, Props>;
+    onApplyEditorTransaction: (transaction: Transaction) => Action<State, Props>;
+    resetEditorState: (query: string, addToHistory?: boolean) => Action<State>;
+    initialiseEditorView: (editorViewNode: HTMLElement, attributes: {
+        [key: string]: string;
+    }, portalActions: PortalActions) => Action<State, Props>;
+    updateEditorView: (attributes: {
+        [key: string]: string;
+    }) => Action<State, Props>;
+    setEditorViewContainer: (editorViewContainer: HTMLElement) => Action<State>;
+    setEditorViewContainerScroll: (scroll: number) => Action<State>;
+    onSearch: () => Action<State>;
+    onSearchCommand: (pmState: EditorState, pmDispatch: ((tr: Transaction) => void) | undefined, pmView: EditorView | undefined, keyboardShortcut: boolean) => Action<State, Props, boolean>;
+    externalErrorMessageViewed: () => Action<State, Props>;
+    createAndFireAnalyticsEvent: (payload: JqlEditorAnalyticsEvent) => Action<State, Props>;
+}>, {
+    fieldName: string;
+    id: string;
+}>;
 export declare const useHydratedDeprecations: import("react-sweet-state").HookFunction<HydratedDeprecatedField[], import("react-sweet-state").BoundActions<State, {
     onEditorViewBlur: () => Action<State>;
     onEditorViewFocus: (event: FocusEvent<HTMLElement>) => Action<State, Props>;

package/dist/types-ts4.5/types.d.ts

@@ -1,5 +1,5 @@
 export type { JQLClause } from '@atlaskit/jql-autocomplete';
-export type { JQLEditorUIProps, JQLEditorProps, HydratedValues, HydratedValue, HydratedUser, } from './ui/types';
+export type { JQLEditorUIProps, JQLEditorProps, HydratedValues, HydratedValue, HydratedUser, HydratedTeam, } from './ui/types';
 export type { ExternalMessage, ExternalError, ExternalWarning, ExternalInfo, CustomComponents, } from './state/types';
 export type { AutocompleteProvider, AutocompleteOptions, AutocompleteOption, AutocompleteValueType, } from './plugins/types';
 export type { ListenerProps, JqlAnalyticsEvent } from './analytics';

package/dist/types-ts4.5/ui/jql-editor/types.d.ts

@@ -8,6 +8,12 @@ export type HydratedUser = {
     name: string;
     type: 'user';
 };
+export type HydratedTeam = {
+    avatarUrl: string;
+    id: string;
+    name: string;
+    type: 'team';
+};
 export type HydratedDeprecatedField = {
     deprecatedSearcherKey: string;
     /**
@@ -16,7 +22,7 @@ export type HydratedDeprecatedField = {
     id: string;
     type: 'deprecated-field';
 };
-export type HydratedValue = HydratedUser | HydratedDeprecatedField;
+export type HydratedValue = HydratedUser | HydratedTeam | HydratedDeprecatedField;
 export type HydratedValues = {
     [fieldName: string]: HydratedValue[];
 };

package/dist/types-ts4.5/ui/types.d.ts

@@ -1,5 +1,5 @@
 import { type JQLEditorUIProps } from './jql-editor/types';
-export type { JQLEditorUIProps, HydratedValue, HydratedValues, HydratedUser, } from './jql-editor/types';
+export type { JQLEditorUIProps, HydratedValue, HydratedValues, HydratedUser, HydratedTeam, } from './jql-editor/types';
 export type JQLEditorProps = JQLEditorUIProps & {
     /**
      * React-intl locale. This should be set to "en" if alternate message sets are not being loaded higher in the React

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/jql-editor",
-	"version": "5.6.4",
+	"version": "5.7.0",
 	"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",
@@ -35,7 +35,7 @@
 		"@atlaskit/afm-i18n-platform-jql-jql-editor": "2.7.0",
 		"@atlaskit/analytics-gas-types": "^5.1.0",
 		"@atlaskit/analytics-next": "^11.1.0",
-		"@atlaskit/avatar": "^25.4.0",
+		"@atlaskit/avatar": "^25.5.0",
 		"@atlaskit/button": "^23.5.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
 		"@atlaskit/form": "^14.2.0",
@@ -53,7 +53,7 @@
 		"@atlaskit/spinner": "^19.0.0",
 		"@atlaskit/theme": "^21.0.0",
 		"@atlaskit/tokens": "^7.0.0",
-		"@atlaskit/tooltip": "^20.5.0",
+		"@atlaskit/tooltip": "^20.6.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
 		"@emotion/styled": "^11.0.0",
@@ -77,7 +77,7 @@
 		"@af/integration-testing": "workspace:^",
 		"@atlaskit/docs": "^11.2.0",
 		"@atlaskit/jql-editor-autocomplete-rest": "^3.0.0",
-		"@atlassian/feature-flags-test-utils": "^0.3.0",
+		"@atlassian/feature-flags-test-utils": "^1.0.0",
 		"@storybook/addon-actions": "^8.6.14",
 		"@storybook/addon-knobs": "^6.4.0",
 		"@testing-library/jest-dom": "^6.4.5",
@@ -139,6 +139,9 @@
 		},
 		"jql_editor_autocomplete_use_popper": {
 			"type": "boolean"
+		},
+		"jira_update_jql_teams": {
+			"type": "boolean"
 		}
 	}
 }