@atlaskit/jql-editor 5.0.4 → 5.0.6

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/jql-editor
 
+## 5.0.6
+
+### Patch Changes
+
+- Updated dependencies
+
+## 5.0.5
+
+### Patch Changes
+
+- [#124108](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/124108)
+  [`33144b1ee7e12`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/33144b1ee7e12) -
+  Fix accessibility issue in error messages section
+
 ## 5.0.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.0.4", _jqlEditorCommon.ANALYTICS_CHANNEL);
+  return (0, _jqlEditorCommon.useJqlPackageAnalytics)(analyticsSource, "@atlaskit/jql-editor", "5.0.6", _jqlEditorCommon.ANALYTICS_CHANNEL);
 };

package/dist/cjs/common/constants.js

@@ -3,9 +3,10 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.SYNTAX_HELP_DESCRIPTION_ID = exports.JQL_EDITOR_MAIN_ID = exports.JQL_EDITOR_INPUT_ID = exports.JQL_EDITOR_HELP_CONTENT_ID = exports.JQL_EDITOR_AUTOCOMPLETE_ID = void 0;
+exports.SYNTAX_HELP_DESCRIPTION_ID = exports.JQL_EDITOR_VALIDATION_ID = exports.JQL_EDITOR_MAIN_ID = exports.JQL_EDITOR_INPUT_ID = exports.JQL_EDITOR_HELP_CONTENT_ID = exports.JQL_EDITOR_AUTOCOMPLETE_ID = void 0;
 var JQL_EDITOR_MAIN_ID = exports.JQL_EDITOR_MAIN_ID = 'jql-editor-main';
 var JQL_EDITOR_AUTOCOMPLETE_ID = exports.JQL_EDITOR_AUTOCOMPLETE_ID = 'jql-editor-autocomplete';
 var JQL_EDITOR_INPUT_ID = exports.JQL_EDITOR_INPUT_ID = 'jql-editor-input';
 var JQL_EDITOR_HELP_CONTENT_ID = exports.JQL_EDITOR_HELP_CONTENT_ID = 'jql-editor-help-content';
+var JQL_EDITOR_VALIDATION_ID = exports.JQL_EDITOR_VALIDATION_ID = 'jql-editor-validation';
 var SYNTAX_HELP_DESCRIPTION_ID = exports.SYNTAX_HELP_DESCRIPTION_ID = 'syntax-help-description';

package/dist/cjs/ui/jql-editor-footer-content/jql-messages/errors/index.js

@@ -13,6 +13,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactMagneticDi = require("react-magnetic-di");
 var _form = require("@atlaskit/form");
 var _jqlAst = require("@atlaskit/jql-ast");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _constants = require("../../../../common/constants");
 var _messages = require("../../../../common/messages");
 var _useEditorTheme = require("../../../../hooks/use-editor-theme");
@@ -82,14 +83,19 @@ var ErrorMessages = exports.ErrorMessages = function ErrorMessages() {
   var _useScopedId = (0, _state.useScopedId)(_constants.JQL_EDITOR_INPUT_ID),
     _useScopedId2 = (0, _slicedToArray2.default)(_useScopedId, 1),
     editorId = _useScopedId2[0];
+  var _useScopedId3 = (0, _state.useScopedId)(_constants.JQL_EDITOR_VALIDATION_ID),
+    _useScopedId4 = (0, _slicedToArray2.default)(_useScopedId3, 1),
+    validationId = _useScopedId4[0];
   var errorMessage = useFormattedErrorMessage();
-  var testId = 'jql-editor-validation';
   var _useCustomErrorCompon = (0, _state.useCustomErrorComponent)(),
     _useCustomErrorCompon2 = (0, _slicedToArray2.default)(_useCustomErrorCompon, 1),
     CustomErrorComponent = _useCustomErrorCompon2[0];
   var childrenToRender = errorMessage != null ? /*#__PURE__*/_react.default.createElement(_format.MessageContainer, null, /*#__PURE__*/_react.default.createElement(_form.ErrorMessage, {
-    testId: testId
-  }, /*#__PURE__*/_react.default.createElement("span", {
+    testId: _constants.JQL_EDITOR_VALIDATION_ID
+  }, (0, _platformFeatureFlags.fg)('jql_editor_a11y') ? /*#__PURE__*/_react.default.createElement("span", {
+    role: "alert",
+    id: validationId
+  }, errorMessage) : /*#__PURE__*/_react.default.createElement("span", {
     role: "alert",
     "aria-describedby": editorId
   }, errorMessage))) : null;
@@ -97,7 +103,7 @@ var ErrorMessages = exports.ErrorMessages = function ErrorMessages() {
   // Only render CustomErrorComponent if there is an errorMessage
   if (errorMessage != null && CustomErrorComponent) {
     return /*#__PURE__*/_react.default.createElement(CustomComponentDecoratedWithEditorTheme, {
-      testId: testId,
+      testId: _constants.JQL_EDITOR_VALIDATION_ID,
       editorId: editorId,
       Component: CustomErrorComponent
     }, childrenToRender);

package/dist/cjs/ui/jql-editor-view/index.js

@@ -10,6 +10,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _throttle = _interopRequireDefault(require("lodash/throttle"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _constants = require("../../common/constants");
 var _useEditorTheme = require("../../hooks/use-editor-theme");
 var _useEditorViewIsInvalid = require("../../hooks/use-editor-view-is-invalid");
@@ -51,6 +52,9 @@ var JQLEditorView = function JQLEditorView(_ref) {
   var _useScopedId7 = (0, _state.useScopedId)(_constants.JQL_EDITOR_HELP_CONTENT_ID),
     _useScopedId8 = (0, _slicedToArray2.default)(_useScopedId7, 1),
     helpContentId = _useScopedId8[0];
+  var _useScopedId9 = (0, _state.useScopedId)(_constants.JQL_EDITOR_VALIDATION_ID),
+    _useScopedId10 = (0, _slicedToArray2.default)(_useScopedId9, 1),
+    validationId = _useScopedId10[0];
   var _useIntl = (0, _state.useIntl)(),
     _useIntl2 = (0, _slicedToArray2.default)(_useIntl, 1),
     intl = _useIntl2[0];
@@ -120,13 +124,13 @@ var JQLEditorView = function JQLEditorView(_ref) {
       'aria-label': intl.formatMessage(_messages.messages.inputLabel),
       'aria-controls': autocompleteId,
       'aria-owns': autocompleteId,
-      'aria-describedby': helpContentId
+      'aria-describedby': (0, _platformFeatureFlags.fg)('jql_editor_a11y') ? editorViewIsInvalid ? validationId : helpContentId : helpContentId
     }, selectedOptionId && {
       'aria-activedescendant': selectedOptionId
     }), editorViewIsInvalid && {
       'aria-invalid': 'true'
     });
-  }, [editorId, isAutocompleteOpen, intl, autocompleteId, helpContentId, selectedOptionId, editorViewIsInvalid]);
+  }, [editorId, isAutocompleteOpen, intl, autocompleteId, editorViewIsInvalid, validationId, helpContentId, selectedOptionId]);
 
   // Update attributes on our editor view whenever they have changed
   (0, _react.useEffect)(function () {

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

package/dist/es2019/common/constants.js

@@ -2,4 +2,5 @@ export const JQL_EDITOR_MAIN_ID = 'jql-editor-main';
 export const JQL_EDITOR_AUTOCOMPLETE_ID = 'jql-editor-autocomplete';
 export const JQL_EDITOR_INPUT_ID = 'jql-editor-input';
 export const JQL_EDITOR_HELP_CONTENT_ID = 'jql-editor-help-content';
+export const JQL_EDITOR_VALIDATION_ID = 'jql-editor-validation';
 export const SYNTAX_HELP_DESCRIPTION_ID = 'syntax-help-description';

package/dist/es2019/ui/jql-editor-footer-content/jql-messages/errors/index.js

@@ -3,7 +3,8 @@ import React, { useEffect } from 'react';
 import { di } from 'react-magnetic-di';
 import { ErrorMessage } from '@atlaskit/form';
 import { JQLSyntaxError } from '@atlaskit/jql-ast';
-import { JQL_EDITOR_INPUT_ID } from '../../../../common/constants';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { JQL_EDITOR_INPUT_ID, JQL_EDITOR_VALIDATION_ID } from '../../../../common/constants';
 import { commonMessages } from '../../../../common/messages';
 import { useEditorThemeContext } from '../../../../hooks/use-editor-theme';
 import { useEditorViewIsInvalid } from '../../../../hooks/use-editor-view-is-invalid';
@@ -67,12 +68,15 @@ const CustomComponentDecoratedWithEditorTheme = props => {
 };
 export const ErrorMessages = () => {
   const [editorId] = useScopedId(JQL_EDITOR_INPUT_ID);
+  const [validationId] = useScopedId(JQL_EDITOR_VALIDATION_ID);
   const errorMessage = useFormattedErrorMessage();
-  const testId = 'jql-editor-validation';
   const [CustomErrorComponent] = useCustomErrorComponent();
   const childrenToRender = errorMessage != null ? /*#__PURE__*/React.createElement(MessageContainer, null, /*#__PURE__*/React.createElement(ErrorMessage, {
-    testId: testId
-  }, /*#__PURE__*/React.createElement("span", {
+    testId: JQL_EDITOR_VALIDATION_ID
+  }, fg('jql_editor_a11y') ? /*#__PURE__*/React.createElement("span", {
+    role: "alert",
+    id: validationId
+  }, errorMessage) : /*#__PURE__*/React.createElement("span", {
     role: "alert",
     "aria-describedby": editorId
   }, errorMessage))) : null;
@@ -80,7 +84,7 @@ export const ErrorMessages = () => {
   // Only render CustomErrorComponent if there is an errorMessage
   if (errorMessage != null && CustomErrorComponent) {
     return /*#__PURE__*/React.createElement(CustomComponentDecoratedWithEditorTheme, {
-      testId: testId,
+      testId: JQL_EDITOR_VALIDATION_ID,
       editorId: editorId,
       Component: CustomErrorComponent
     }, childrenToRender);

package/dist/es2019/ui/jql-editor-view/index.js

@@ -1,6 +1,7 @@
 import React, { useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
 import throttle from 'lodash/throttle';
-import { JQL_EDITOR_AUTOCOMPLETE_ID, JQL_EDITOR_HELP_CONTENT_ID, JQL_EDITOR_INPUT_ID, JQL_EDITOR_MAIN_ID } from '../../common/constants';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { JQL_EDITOR_AUTOCOMPLETE_ID, JQL_EDITOR_HELP_CONTENT_ID, JQL_EDITOR_INPUT_ID, JQL_EDITOR_MAIN_ID, JQL_EDITOR_VALIDATION_ID } from '../../common/constants';
 import { useEditorThemeContext } from '../../hooks/use-editor-theme';
 import { useEditorViewIsInvalid } from '../../hooks/use-editor-view-is-invalid';
 import { useAutocomplete, useAutocompleteIsOpen, useEditorView, useEditorViewHasFocus, useIntl, useLineNumbersVisible, useScopedId, useStoreActions } from '../../state';
@@ -30,6 +31,7 @@ const JQLEditorView = ({
   const [autocompleteId] = useScopedId(JQL_EDITOR_AUTOCOMPLETE_ID);
   const [editorId] = useScopedId(JQL_EDITOR_INPUT_ID);
   const [helpContentId] = useScopedId(JQL_EDITOR_HELP_CONTENT_ID);
+  const [validationId] = useScopedId(JQL_EDITOR_VALIDATION_ID);
   const [intl] = useIntl();
   const portalActions = usePortalActionsContext();
   const [, {
@@ -89,7 +91,7 @@ const JQLEditorView = ({
       'aria-label': intl.formatMessage(messages.inputLabel),
       'aria-controls': autocompleteId,
       'aria-owns': autocompleteId,
-      'aria-describedby': helpContentId,
+      'aria-describedby': fg('jql_editor_a11y') ? editorViewIsInvalid ? validationId : helpContentId : helpContentId,
       ...(selectedOptionId && {
         'aria-activedescendant': selectedOptionId
       }),
@@ -97,7 +99,7 @@ const JQLEditorView = ({
         'aria-invalid': 'true'
       })
     };
-  }, [editorId, isAutocompleteOpen, intl, autocompleteId, helpContentId, selectedOptionId, editorViewIsInvalid]);
+  }, [editorId, isAutocompleteOpen, intl, autocompleteId, editorViewIsInvalid, validationId, helpContentId, selectedOptionId]);
 
   // Update attributes on our editor view whenever they have changed
   useEffect(() => {

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

package/dist/esm/common/constants.js

@@ -2,4 +2,5 @@ export var JQL_EDITOR_MAIN_ID = 'jql-editor-main';
 export var JQL_EDITOR_AUTOCOMPLETE_ID = 'jql-editor-autocomplete';
 export var JQL_EDITOR_INPUT_ID = 'jql-editor-input';
 export var JQL_EDITOR_HELP_CONTENT_ID = 'jql-editor-help-content';
+export var JQL_EDITOR_VALIDATION_ID = 'jql-editor-validation';
 export var SYNTAX_HELP_DESCRIPTION_ID = 'syntax-help-description';

package/dist/esm/ui/jql-editor-footer-content/jql-messages/errors/index.js

@@ -6,7 +6,8 @@ import React, { useEffect } from 'react';
 import { di } from 'react-magnetic-di';
 import { ErrorMessage } from '@atlaskit/form';
 import { JQLSyntaxError } from '@atlaskit/jql-ast';
-import { JQL_EDITOR_INPUT_ID } from '../../../../common/constants';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { JQL_EDITOR_INPUT_ID, JQL_EDITOR_VALIDATION_ID } from '../../../../common/constants';
 import { commonMessages } from '../../../../common/messages';
 import { useEditorThemeContext } from '../../../../hooks/use-editor-theme';
 import { useEditorViewIsInvalid } from '../../../../hooks/use-editor-view-is-invalid';
@@ -72,14 +73,19 @@ export var ErrorMessages = function ErrorMessages() {
   var _useScopedId = useScopedId(JQL_EDITOR_INPUT_ID),
     _useScopedId2 = _slicedToArray(_useScopedId, 1),
     editorId = _useScopedId2[0];
+  var _useScopedId3 = useScopedId(JQL_EDITOR_VALIDATION_ID),
+    _useScopedId4 = _slicedToArray(_useScopedId3, 1),
+    validationId = _useScopedId4[0];
   var errorMessage = useFormattedErrorMessage();
-  var testId = 'jql-editor-validation';
   var _useCustomErrorCompon = useCustomErrorComponent(),
     _useCustomErrorCompon2 = _slicedToArray(_useCustomErrorCompon, 1),
     CustomErrorComponent = _useCustomErrorCompon2[0];
   var childrenToRender = errorMessage != null ? /*#__PURE__*/React.createElement(MessageContainer, null, /*#__PURE__*/React.createElement(ErrorMessage, {
-    testId: testId
-  }, /*#__PURE__*/React.createElement("span", {
+    testId: JQL_EDITOR_VALIDATION_ID
+  }, fg('jql_editor_a11y') ? /*#__PURE__*/React.createElement("span", {
+    role: "alert",
+    id: validationId
+  }, errorMessage) : /*#__PURE__*/React.createElement("span", {
     role: "alert",
     "aria-describedby": editorId
   }, errorMessage))) : null;
@@ -87,7 +93,7 @@ export var ErrorMessages = function ErrorMessages() {
   // Only render CustomErrorComponent if there is an errorMessage
   if (errorMessage != null && CustomErrorComponent) {
     return /*#__PURE__*/React.createElement(CustomComponentDecoratedWithEditorTheme, {
-      testId: testId,
+      testId: JQL_EDITOR_VALIDATION_ID,
       editorId: editorId,
       Component: CustomErrorComponent
     }, childrenToRender);

package/dist/esm/ui/jql-editor-view/index.js

@@ -4,7 +4,8 @@ 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, { useCallback, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
 import throttle from 'lodash/throttle';
-import { JQL_EDITOR_AUTOCOMPLETE_ID, JQL_EDITOR_HELP_CONTENT_ID, JQL_EDITOR_INPUT_ID, JQL_EDITOR_MAIN_ID } from '../../common/constants';
+import { fg } from '@atlaskit/platform-feature-flags';
+import { JQL_EDITOR_AUTOCOMPLETE_ID, JQL_EDITOR_HELP_CONTENT_ID, JQL_EDITOR_INPUT_ID, JQL_EDITOR_MAIN_ID, JQL_EDITOR_VALIDATION_ID } from '../../common/constants';
 import { useEditorThemeContext } from '../../hooks/use-editor-theme';
 import { useEditorViewIsInvalid } from '../../hooks/use-editor-view-is-invalid';
 import { useAutocomplete, useAutocompleteIsOpen, useEditorView, useEditorViewHasFocus, useIntl, useLineNumbersVisible, useScopedId, useStoreActions } from '../../state';
@@ -43,6 +44,9 @@ var JQLEditorView = function JQLEditorView(_ref) {
   var _useScopedId7 = useScopedId(JQL_EDITOR_HELP_CONTENT_ID),
     _useScopedId8 = _slicedToArray(_useScopedId7, 1),
     helpContentId = _useScopedId8[0];
+  var _useScopedId9 = useScopedId(JQL_EDITOR_VALIDATION_ID),
+    _useScopedId10 = _slicedToArray(_useScopedId9, 1),
+    validationId = _useScopedId10[0];
   var _useIntl = useIntl(),
     _useIntl2 = _slicedToArray(_useIntl, 1),
     intl = _useIntl2[0];
@@ -112,13 +116,13 @@ var JQLEditorView = function JQLEditorView(_ref) {
       'aria-label': intl.formatMessage(messages.inputLabel),
       'aria-controls': autocompleteId,
       'aria-owns': autocompleteId,
-      'aria-describedby': helpContentId
+      'aria-describedby': fg('jql_editor_a11y') ? editorViewIsInvalid ? validationId : helpContentId : helpContentId
     }, selectedOptionId && {
       'aria-activedescendant': selectedOptionId
     }), editorViewIsInvalid && {
       'aria-invalid': 'true'
     });
-  }, [editorId, isAutocompleteOpen, intl, autocompleteId, helpContentId, selectedOptionId, editorViewIsInvalid]);
+  }, [editorId, isAutocompleteOpen, intl, autocompleteId, editorViewIsInvalid, validationId, helpContentId, selectedOptionId]);
 
   // Update attributes on our editor view whenever they have changed
   useEffect(function () {

package/dist/types/common/constants.d.ts

@@ -2,4 +2,5 @@ export declare const JQL_EDITOR_MAIN_ID = "jql-editor-main";
 export declare const JQL_EDITOR_AUTOCOMPLETE_ID = "jql-editor-autocomplete";
 export declare const JQL_EDITOR_INPUT_ID = "jql-editor-input";
 export declare const JQL_EDITOR_HELP_CONTENT_ID = "jql-editor-help-content";
+export declare const JQL_EDITOR_VALIDATION_ID = "jql-editor-validation";
 export declare const SYNTAX_HELP_DESCRIPTION_ID = "syntax-help-description";

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

@@ -2,4 +2,5 @@ export declare const JQL_EDITOR_MAIN_ID = "jql-editor-main";
 export declare const JQL_EDITOR_AUTOCOMPLETE_ID = "jql-editor-autocomplete";
 export declare const JQL_EDITOR_INPUT_ID = "jql-editor-input";
 export declare const JQL_EDITOR_HELP_CONTENT_ID = "jql-editor-help-content";
+export declare const JQL_EDITOR_VALIDATION_ID = "jql-editor-validation";
 export declare const SYNTAX_HELP_DESCRIPTION_ID = "syntax-help-description";

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/jql-editor",
-	"version": "5.0.4",
+	"version": "5.0.6",
 	"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",
@@ -39,7 +39,7 @@
 	"dependencies": {
 		"@atlaskit/analytics-gas-types": "^5.1.0",
 		"@atlaskit/analytics-next": "^11.0.0",
-		"@atlaskit/avatar": "^24.0.0",
+		"@atlaskit/avatar": "^25.0.0",
 		"@atlaskit/button": "^21.1.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
 		"@atlaskit/form": "^12.0.0",
@@ -53,7 +53,7 @@
 		"@atlaskit/primitives": "^14.1.0",
 		"@atlaskit/spinner": "^18.0.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tokens": "^4.3.0",
+		"@atlaskit/tokens": "^4.4.0",
 		"@atlaskit/tooltip": "^20.0.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
@@ -75,11 +75,11 @@
 		"react-dom": "^18.2.0"
 	},
 	"devDependencies": {
-		"@af/integration-testing": "*",
-		"@atlaskit/docs": "*",
+		"@af/integration-testing": "^0.5.0",
+		"@atlaskit/docs": "^10.0.0",
 		"@atlaskit/jql-editor-autocomplete-rest": "^3.0.0",
-		"@atlaskit/visual-regression": "*",
-		"@atlassian/feature-flags-test-utils": "0.3.1",
+		"@atlaskit/visual-regression": "^0.10.0",
+		"@atlassian/feature-flags-test-utils": "^0.3.0",
 		"@storybook/addon-actions": "^6.4.0",
 		"@storybook/addon-knobs": "^6.4.0",
 		"@testing-library/jest-dom": "^6.4.5",
@@ -133,6 +133,9 @@
 		},
 		"add_nin_press_interactions": {
 			"type": "boolean"
+		},
+		"jql_editor_a11y": {
+			"type": "boolean"
 		}
 	}
 }