@atlaskit/jql-editor 4.2.2 → 4.3.0

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/jql-editor
 
+## 4.3.0
+
+### Minor Changes
+
+-   [#100746](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/100746)
+    [`8a7f333f8ce6`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/8a7f333f8ce6) -
+    This cleans up feature flag references for the increased border contrast changes in JQL editor,
+    making them fully available for all users.
+
+## 4.2.3
+
+### Patch Changes
+
+-   Updated dependencies
+
 ## 4.2.2
 
 ### 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", "4.2.2", _jqlEditorCommon.ANALYTICS_CHANNEL);
+  return (0, _jqlEditorCommon.useJqlPackageAnalytics)(analyticsSource, "@atlaskit/jql-editor", "4.3.0", _jqlEditorCommon.ANALYTICS_CHANNEL);
 };

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

@@ -7,7 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = exports.JQLEditorReadOnly = void 0;
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _useEditorTheme = require("../../hooks/use-editor-theme");
 var _splitTextByNewLine = require("../../utils/split-text-by-new-line");
 var _readOnlyControlsContent = require("../jql-editor-controls-content/read-only-controls-content");
@@ -38,7 +37,6 @@ var JQLEditorLayout = function JQLEditorLayout(props) {
   }, /*#__PURE__*/_react.default.createElement(_styled.EditorViewContainer, {
     editorViewHasFocus: editorViewHasFocus,
     editorViewIsInvalid: editorViewIsInvalid,
-    isBorderContrastFixEnabled: (0, _platformFeatureFlags.getBooleanFF)('platform.a11y-jira-team.fix-border-contrast-for-jql-editor-textarea_vy0qk') ? true : false,
     ref: onEditorViewContainerRef,
     onScroll: onEditorViewContainerScroll
   }, /*#__PURE__*/_react.default.createElement(_styled.LineNumberToolbar, {
@@ -72,9 +70,7 @@ var JQLEditorReadOnlyWithoutTheme = function JQLEditorReadOnlyWithoutTheme(_ref)
     isCompact = _useEditorThemeContex2.isCompact;
   var blocks = (0, _splitTextByNewLine.splitTextByNewLine)(query);
   var lineNumbersVisible = blocks.length > 1;
-  return /*#__PURE__*/_react.default.createElement(_styled.EditorMain, null, /*#__PURE__*/_react.default.createElement(_styled.ReadOnlyEditorViewContainer, {
-    isBorderContrastFixEnabled: (0, _platformFeatureFlags.getBooleanFF)('platform.a11y-jira-team.fix-border-contrast-for-jql-editor-textarea_vy0qk') ? true : false
-  }, /*#__PURE__*/_react.default.createElement(_styled.LineNumberToolbar, {
+  return /*#__PURE__*/_react.default.createElement(_styled.EditorMain, null, /*#__PURE__*/_react.default.createElement(_styled.ReadOnlyEditorViewContainer, null, /*#__PURE__*/_react.default.createElement(_styled.LineNumberToolbar, {
     lineNumbersVisible: lineNumbersVisible
   }), /*#__PURE__*/_react.default.createElement(_styled.ReadOnlyEditorView, {
     "data-testid": "jql-editor-read-only",

package/dist/cjs/ui/jql-editor-layout/styled.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ReadOnlyEditorViewContainer = exports.ReadOnlyEditorView = exports.LineNumberToolbar = exports.EditorViewContainer = exports.EditorView = exports.EditorMain = exports.EditorFooter = exports.EditorControls = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _react = require("@emotion/react");
 var _styled = _interopRequireDefault(require("@emotion/styled"));
@@ -13,8 +12,6 @@ var _colors = require("@atlaskit/theme/colors");
 var _constants = require("@atlaskit/theme/constants");
 var _constants2 = require("../../plugins/validation-tooltip/constants");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-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; }
 var fadeIn = (0, _react.keyframes)({
   from: {
     opacity: 0
@@ -51,33 +48,26 @@ var editorInputHorizontalPadding = 6;
 var EditorViewContainer = exports.EditorViewContainer = _styled.default.div({
   backgroundColor: "var(--ds-background-input, ".concat(_colors.N10, ")"),
   borderStyle: 'solid',
-  borderWidth: '2px',
-  borderColor: "var(--ds-border, ".concat(_colors.N40, ")"),
+  borderWidth: "var(--ds-border-width, 1px)",
+  borderColor: "var(--ds-border-input, ".concat(_colors.N100, ")"),
   borderRadius: "var(--ds-border-radius-100, 3px)",
+  padding: "var(--ds-border-width, 1px)",
   boxSizing: 'border-box',
   color: "var(--ds-text, ".concat(_colors.N900, ")"),
   display: 'flex',
   overflow: 'auto',
   transition: 'background-color 0.2s ease-in-out, border-color 0.2s ease-in-out'
 }, function (props) {
-  return props.isBorderContrastFixEnabled && (0, _react.css)({
-    borderWidth: "var(--ds-border-width, 1px)",
-    borderColor: "var(--ds-border-input, ".concat(_colors.N100, ")"),
-    padding: "var(--ds-border-width, 1px)"
-  });
-}, function (props) {
-  return props.editorViewIsInvalid && (0, _react.css)(_objectSpread({
-    borderColor: "var(--ds-border-danger, ".concat(_colors.R400, ")")
-  }, props.isBorderContrastFixEnabled ? {
+  return props.editorViewIsInvalid && (0, _react.css)({
+    borderColor: "var(--ds-border-danger, ".concat(_colors.R400, ")"),
     boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-danger, ".concat(_colors.R400, ")"))
-  } : {}));
+  });
 }, function (props) {
-  return props.editorViewHasFocus ? (0, _react.css)(_objectSpread({
+  return props.editorViewHasFocus ? (0, _react.css)({
     backgroundColor: "var(--ds-surface, ".concat(_colors.N0, ")"),
-    borderColor: "var(--ds-border-focused, ".concat(props.isBorderContrastFixEnabled ? _colors.B200 : _colors.B100, ")")
-  }, props.isBorderContrastFixEnabled ? {
+    borderColor: "var(--ds-border-focused, ".concat(_colors.B200, ")"),
     boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-focused, ".concat(_colors.B200, ")"))
-  } : {})) : (0, _react.css)({
+  }) : (0, _react.css)({
     ':hover': {
       backgroundColor: "var(--ds-background-input-hovered, ".concat(_colors.N30, ")")
     }
@@ -104,7 +94,7 @@ var LineNumberToolbar = exports.LineNumberToolbar = _styled.default.div({
  * The main div which the Prosemirror editor will be rendered into.
  */
 // eslint-disable-next-line @atlaskit/design-system/no-styled-tagged-template-expression -- needs manual remediation
-var EditorView = exports.EditorView = _styled.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  counter-reset: lineNumber;\n  flex-grow: 1;\n\n  transition: height 250ms cubic-bezier(0.15, 1, 0.3, 1),\n    max-height 250ms cubic-bezier(0.15, 1, 0.3, 1);\n  max-height: ", "px;\n\n  line-height: ", ";\n  font-family: ", ";\n  word-break: break-word;\n  overflow-wrap: anywhere;\n  white-space: pre-wrap;\n\n  &[data-expanded] {\n    height: ", "px;\n    max-height: ", "px;\n  }\n\n  .ProseMirror {\n    color: ", ";\n    padding: ", "px\n      ", "px;\n\n    &:focus {\n      outline: none;\n    }\n\n    .mark-token-keyword {\n      color: ", ";\n    }\n\n    .mark-token-field {\n      color: ", ";\n    }\n\n    .mark-token-operator {\n      color: ", ";\n    }\n\n    .mark-token-error {\n      color: ", ";\n      text-decoration: wavy underline;\n      text-decoration-thickness: 1px;\n      text-decoration-skip-ink: none;\n    }\n  }\n\n  p {\n    margin: 0;\n    counter-increment: lineNumber;\n    position: relative;\n\n    /* Show the current line number before each paragraph block. */\n\n    &::before {\n      content: counter(lineNumber);\n      color: ", ";\n      font-size: 10px;\n      line-height: ", ";\n      padding: 0 ", " 0 ", ";\n      position: absolute;\n      box-sizing: border-box;\n      /* Shift the line number tag 100% (plus 8px padding) to the left to position it inside the LineNumberToolbar */\n      transform: translateX(calc(-100% - ", "));\n\n      /* We can fit 3 digits before ellipses. This is not very responsive but saves us having to add expensive width\n        recalculation logic to the LineNumberToolbar for a scenario that *should* never happen. */\n      max-width: 30px;\n      text-overflow: ellipsis;\n      overflow: hidden;\n      white-space: nowrap;\n\n      ", "\n    }\n  }\n"])), function (props) {
+var EditorView = exports.EditorView = _styled.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  counter-reset: lineNumber;\n  flex-grow: 1;\n\n  transition:\n    height 250ms cubic-bezier(0.15, 1, 0.3, 1),\n    max-height 250ms cubic-bezier(0.15, 1, 0.3, 1);\n  max-height: ", "px;\n\n  line-height: ", ";\n  font-family: ", ";\n  word-break: break-word;\n  overflow-wrap: anywhere;\n  white-space: pre-wrap;\n\n  &[data-expanded] {\n    height: ", "px;\n    max-height: ", "px;\n  }\n\n  .ProseMirror {\n    color: ", ";\n    padding: ", "px\n      ", "px;\n\n    &:focus {\n      outline: none;\n    }\n\n    .mark-token-keyword {\n      color: ", ";\n    }\n\n    .mark-token-field {\n      color: ", ";\n    }\n\n    .mark-token-operator {\n      color: ", ";\n    }\n\n    .mark-token-error {\n      color: ", ";\n      text-decoration: wavy underline;\n      text-decoration-thickness: 1px;\n      text-decoration-skip-ink: none;\n    }\n  }\n\n  p {\n    margin: 0;\n    counter-increment: lineNumber;\n    position: relative;\n\n    /* Show the current line number before each paragraph block. */\n\n    &::before {\n      content: counter(lineNumber);\n      color: ", ";\n      font-size: 10px;\n      line-height: ", ";\n      padding: 0 ", " 0 ", ";\n      position: absolute;\n      box-sizing: border-box;\n      /* Shift the line number tag 100% (plus 8px padding) to the left to position it inside the LineNumberToolbar */\n      transform: translateX(calc(-100% - ", "));\n\n      /* We can fit 3 digits before ellipses. This is not very responsive but saves us having to add expensive width\n        recalculation logic to the LineNumberToolbar for a scenario that *should* never happen. */\n      max-width: 30px;\n      text-overflow: ellipsis;\n      overflow: hidden;\n      white-space: nowrap;\n\n      ", "\n    }\n  }\n"])), function (props) {
   return rowHeight * props.defaultMaxRows + getEditorInputVerticalPadding(props.isCompact) * 2;
 }, rowHeight / (0, _constants.fontSize)(), (0, _constants.codeFontFamily)(), function (props) {
   return rowHeight * props.expandedRows + getEditorInputVerticalPadding(props.isCompact) * 2;

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

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

@@ -1,5 +1,4 @@
 import React from 'react';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { EditorThemeContext, useEditorTheme, useEditorThemeContext } from '../../hooks/use-editor-theme';
 import { splitTextByNewLine } from '../../utils/split-text-by-new-line';
 // eslint-disable-next-line @atlassian/tangerine/import/no-parent-imports
@@ -33,7 +32,6 @@ const JQLEditorLayout = props => {
   }, /*#__PURE__*/React.createElement(EditorViewContainer, {
     editorViewHasFocus: editorViewHasFocus,
     editorViewIsInvalid: editorViewIsInvalid,
-    isBorderContrastFixEnabled: getBooleanFF('platform.a11y-jira-team.fix-border-contrast-for-jql-editor-textarea_vy0qk') ? true : false,
     ref: onEditorViewContainerRef,
     onScroll: onEditorViewContainerScroll
   }, /*#__PURE__*/React.createElement(LineNumberToolbar, {
@@ -69,9 +67,7 @@ const JQLEditorReadOnlyWithoutTheme = ({
   } = useEditorThemeContext();
   const blocks = splitTextByNewLine(query);
   const lineNumbersVisible = blocks.length > 1;
-  return /*#__PURE__*/React.createElement(EditorMain, null, /*#__PURE__*/React.createElement(ReadOnlyEditorViewContainer, {
-    isBorderContrastFixEnabled: getBooleanFF('platform.a11y-jira-team.fix-border-contrast-for-jql-editor-textarea_vy0qk') ? true : false
-  }, /*#__PURE__*/React.createElement(LineNumberToolbar, {
+  return /*#__PURE__*/React.createElement(EditorMain, null, /*#__PURE__*/React.createElement(ReadOnlyEditorViewContainer, null, /*#__PURE__*/React.createElement(LineNumberToolbar, {
     lineNumbersVisible: lineNumbersVisible
   }), /*#__PURE__*/React.createElement(ReadOnlyEditorView, {
     "data-testid": "jql-editor-read-only",

package/dist/es2019/ui/jql-editor-layout/styled.js

@@ -1,6 +1,6 @@
 import { css, keyframes } from '@emotion/react';
 import styled from '@emotion/styled';
-import { B100, B200, B300, G300, N0, N10, N100, N30, N40, N700, N800, N900, P400, R400 } from '@atlaskit/theme/colors';
+import { B200, B300, G300, N0, N10, N100, N30, N700, N800, N900, P400, R400 } from '@atlaskit/theme/colors';
 import { codeFontFamily, fontFamily, fontSize,
 // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
 gridSize, layers } from '@atlaskit/theme/constants';
@@ -75,29 +75,22 @@ const editorInputHorizontalPadding = 6;
 export const EditorViewContainer = styled.div({
   backgroundColor: `var(--ds-background-input, ${N10})`,
   borderStyle: 'solid',
-  borderWidth: '2px',
-  borderColor: `var(--ds-border, ${N40})`,
+  borderWidth: "var(--ds-border-width, 1px)",
+  borderColor: `var(--ds-border-input, ${N100})`,
   borderRadius: "var(--ds-border-radius-100, 3px)",
+  padding: "var(--ds-border-width, 1px)",
   boxSizing: 'border-box',
   color: `var(--ds-text, ${N900})`,
   display: 'flex',
   overflow: 'auto',
   transition: 'background-color 0.2s ease-in-out, border-color 0.2s ease-in-out'
-}, props => props.isBorderContrastFixEnabled && css({
-  borderWidth: "var(--ds-border-width, 1px)",
-  borderColor: `var(--ds-border-input, ${N100})`,
-  padding: "var(--ds-border-width, 1px)"
-}), props => props.editorViewIsInvalid && css({
+}, props => props.editorViewIsInvalid && css({
   borderColor: `var(--ds-border-danger, ${R400})`,
-  ...(props.isBorderContrastFixEnabled ? {
-    boxShadow: `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${`var(--ds-border-danger, ${R400})`}`
-  } : {})
+  boxShadow: `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${`var(--ds-border-danger, ${R400})`}`
 }), props => props.editorViewHasFocus ? css({
   backgroundColor: `var(--ds-surface, ${N0})`,
-  borderColor: `var(--ds-border-focused, ${props.isBorderContrastFixEnabled ? B200 : B100})`,
-  ...(props.isBorderContrastFixEnabled ? {
-    boxShadow: `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${`var(--ds-border-focused, ${B200})`}`
-  } : {})
+  borderColor: `var(--ds-border-focused, ${B200})`,
+  boxShadow: `inset 0 0 0 ${"var(--ds-border-width, 1px)"} ${`var(--ds-border-focused, ${B200})`}`
 }) : css({
   ':hover': {
     backgroundColor: `var(--ds-background-input-hovered, ${N30})`
@@ -126,7 +119,8 @@ export const EditorView = styled.div`
   counter-reset: lineNumber;
   flex-grow: 1;
 
-  transition: height 250ms cubic-bezier(0.15, 1, 0.3, 1),
+  transition:
+    height 250ms cubic-bezier(0.15, 1, 0.3, 1),
     max-height 250ms cubic-bezier(0.15, 1, 0.3, 1);
   max-height: ${props => rowHeight * props.defaultMaxRows + getEditorInputVerticalPadding(props.isCompact) * 2}px;
 

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

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

@@ -1,7 +1,6 @@
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 var _excluded = ["isSearch", "isCompact"];
 import React from 'react';
-import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { EditorThemeContext, useEditorTheme, useEditorThemeContext } from '../../hooks/use-editor-theme';
 import { splitTextByNewLine } from '../../utils/split-text-by-new-line';
 // eslint-disable-next-line @atlassian/tangerine/import/no-parent-imports
@@ -32,7 +31,6 @@ var JQLEditorLayout = function JQLEditorLayout(props) {
   }, /*#__PURE__*/React.createElement(EditorViewContainer, {
     editorViewHasFocus: editorViewHasFocus,
     editorViewIsInvalid: editorViewIsInvalid,
-    isBorderContrastFixEnabled: getBooleanFF('platform.a11y-jira-team.fix-border-contrast-for-jql-editor-textarea_vy0qk') ? true : false,
     ref: onEditorViewContainerRef,
     onScroll: onEditorViewContainerScroll
   }, /*#__PURE__*/React.createElement(LineNumberToolbar, {
@@ -66,9 +64,7 @@ var JQLEditorReadOnlyWithoutTheme = function JQLEditorReadOnlyWithoutTheme(_ref)
     isCompact = _useEditorThemeContex2.isCompact;
   var blocks = splitTextByNewLine(query);
   var lineNumbersVisible = blocks.length > 1;
-  return /*#__PURE__*/React.createElement(EditorMain, null, /*#__PURE__*/React.createElement(ReadOnlyEditorViewContainer, {
-    isBorderContrastFixEnabled: getBooleanFF('platform.a11y-jira-team.fix-border-contrast-for-jql-editor-textarea_vy0qk') ? true : false
-  }, /*#__PURE__*/React.createElement(LineNumberToolbar, {
+  return /*#__PURE__*/React.createElement(EditorMain, null, /*#__PURE__*/React.createElement(ReadOnlyEditorViewContainer, null, /*#__PURE__*/React.createElement(LineNumberToolbar, {
     lineNumbersVisible: lineNumbersVisible
   }), /*#__PURE__*/React.createElement(ReadOnlyEditorView, {
     "data-testid": "jql-editor-read-only",

package/dist/esm/ui/jql-editor-layout/styled.js

@@ -1,11 +1,8 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-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 { css, keyframes } from '@emotion/react';
 import styled from '@emotion/styled';
-import { B100, B200, B300, G300, N0, N10, N100, N30, N40, N700, N800, N900, P400, R400 } from '@atlaskit/theme/colors';
+import { B200, B300, G300, N0, N10, N100, N30, N700, N800, N900, P400, R400 } from '@atlaskit/theme/colors';
 import { codeFontFamily, fontFamily, fontSize,
 // eslint-disable-next-line @atlaskit/design-system/no-deprecated-imports
 gridSize, layers } from '@atlaskit/theme/constants';
@@ -46,33 +43,26 @@ var editorInputHorizontalPadding = 6;
 export var EditorViewContainer = styled.div({
   backgroundColor: "var(--ds-background-input, ".concat(N10, ")"),
   borderStyle: 'solid',
-  borderWidth: '2px',
-  borderColor: "var(--ds-border, ".concat(N40, ")"),
+  borderWidth: "var(--ds-border-width, 1px)",
+  borderColor: "var(--ds-border-input, ".concat(N100, ")"),
   borderRadius: "var(--ds-border-radius-100, 3px)",
+  padding: "var(--ds-border-width, 1px)",
   boxSizing: 'border-box',
   color: "var(--ds-text, ".concat(N900, ")"),
   display: 'flex',
   overflow: 'auto',
   transition: 'background-color 0.2s ease-in-out, border-color 0.2s ease-in-out'
 }, function (props) {
-  return props.isBorderContrastFixEnabled && css({
-    borderWidth: "var(--ds-border-width, 1px)",
-    borderColor: "var(--ds-border-input, ".concat(N100, ")"),
-    padding: "var(--ds-border-width, 1px)"
-  });
-}, function (props) {
-  return props.editorViewIsInvalid && css(_objectSpread({
-    borderColor: "var(--ds-border-danger, ".concat(R400, ")")
-  }, props.isBorderContrastFixEnabled ? {
+  return props.editorViewIsInvalid && css({
+    borderColor: "var(--ds-border-danger, ".concat(R400, ")"),
     boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-danger, ".concat(R400, ")"))
-  } : {}));
+  });
 }, function (props) {
-  return props.editorViewHasFocus ? css(_objectSpread({
+  return props.editorViewHasFocus ? css({
     backgroundColor: "var(--ds-surface, ".concat(N0, ")"),
-    borderColor: "var(--ds-border-focused, ".concat(props.isBorderContrastFixEnabled ? B200 : B100, ")")
-  }, props.isBorderContrastFixEnabled ? {
+    borderColor: "var(--ds-border-focused, ".concat(B200, ")"),
     boxShadow: "inset 0 0 0 ".concat("var(--ds-border-width, 1px)", " ", "var(--ds-border-focused, ".concat(B200, ")"))
-  } : {})) : css({
+  }) : css({
     ':hover': {
       backgroundColor: "var(--ds-background-input-hovered, ".concat(N30, ")")
     }
@@ -99,7 +89,7 @@ export var LineNumberToolbar = styled.div({
  * The main div which the Prosemirror editor will be rendered into.
  */
 // eslint-disable-next-line @atlaskit/design-system/no-styled-tagged-template-expression -- needs manual remediation
-export var EditorView = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  counter-reset: lineNumber;\n  flex-grow: 1;\n\n  transition: height 250ms cubic-bezier(0.15, 1, 0.3, 1),\n    max-height 250ms cubic-bezier(0.15, 1, 0.3, 1);\n  max-height: ", "px;\n\n  line-height: ", ";\n  font-family: ", ";\n  word-break: break-word;\n  overflow-wrap: anywhere;\n  white-space: pre-wrap;\n\n  &[data-expanded] {\n    height: ", "px;\n    max-height: ", "px;\n  }\n\n  .ProseMirror {\n    color: ", ";\n    padding: ", "px\n      ", "px;\n\n    &:focus {\n      outline: none;\n    }\n\n    .mark-token-keyword {\n      color: ", ";\n    }\n\n    .mark-token-field {\n      color: ", ";\n    }\n\n    .mark-token-operator {\n      color: ", ";\n    }\n\n    .mark-token-error {\n      color: ", ";\n      text-decoration: wavy underline;\n      text-decoration-thickness: 1px;\n      text-decoration-skip-ink: none;\n    }\n  }\n\n  p {\n    margin: 0;\n    counter-increment: lineNumber;\n    position: relative;\n\n    /* Show the current line number before each paragraph block. */\n\n    &::before {\n      content: counter(lineNumber);\n      color: ", ";\n      font-size: 10px;\n      line-height: ", ";\n      padding: 0 ", " 0 ", ";\n      position: absolute;\n      box-sizing: border-box;\n      /* Shift the line number tag 100% (plus 8px padding) to the left to position it inside the LineNumberToolbar */\n      transform: translateX(calc(-100% - ", "));\n\n      /* We can fit 3 digits before ellipses. This is not very responsive but saves us having to add expensive width\n        recalculation logic to the LineNumberToolbar for a scenario that *should* never happen. */\n      max-width: 30px;\n      text-overflow: ellipsis;\n      overflow: hidden;\n      white-space: nowrap;\n\n      ", "\n    }\n  }\n"])), function (props) {
+export var EditorView = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  counter-reset: lineNumber;\n  flex-grow: 1;\n\n  transition:\n    height 250ms cubic-bezier(0.15, 1, 0.3, 1),\n    max-height 250ms cubic-bezier(0.15, 1, 0.3, 1);\n  max-height: ", "px;\n\n  line-height: ", ";\n  font-family: ", ";\n  word-break: break-word;\n  overflow-wrap: anywhere;\n  white-space: pre-wrap;\n\n  &[data-expanded] {\n    height: ", "px;\n    max-height: ", "px;\n  }\n\n  .ProseMirror {\n    color: ", ";\n    padding: ", "px\n      ", "px;\n\n    &:focus {\n      outline: none;\n    }\n\n    .mark-token-keyword {\n      color: ", ";\n    }\n\n    .mark-token-field {\n      color: ", ";\n    }\n\n    .mark-token-operator {\n      color: ", ";\n    }\n\n    .mark-token-error {\n      color: ", ";\n      text-decoration: wavy underline;\n      text-decoration-thickness: 1px;\n      text-decoration-skip-ink: none;\n    }\n  }\n\n  p {\n    margin: 0;\n    counter-increment: lineNumber;\n    position: relative;\n\n    /* Show the current line number before each paragraph block. */\n\n    &::before {\n      content: counter(lineNumber);\n      color: ", ";\n      font-size: 10px;\n      line-height: ", ";\n      padding: 0 ", " 0 ", ";\n      position: absolute;\n      box-sizing: border-box;\n      /* Shift the line number tag 100% (plus 8px padding) to the left to position it inside the LineNumberToolbar */\n      transform: translateX(calc(-100% - ", "));\n\n      /* We can fit 3 digits before ellipses. This is not very responsive but saves us having to add expensive width\n        recalculation logic to the LineNumberToolbar for a scenario that *should* never happen. */\n      max-width: 30px;\n      text-overflow: ellipsis;\n      overflow: hidden;\n      white-space: nowrap;\n\n      ", "\n    }\n  }\n"])), function (props) {
   return rowHeight * props.defaultMaxRows + getEditorInputVerticalPadding(props.isCompact) * 2;
 }, rowHeight / fontSize(), codeFontFamily(), function (props) {
   return rowHeight * props.expandedRows + getEditorInputVerticalPadding(props.isCompact) * 2;

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

@@ -10,7 +10,6 @@ export declare const EditorFooter: import("@emotion/styled").StyledComponent<{
 type EditorViewContainerProps = {
     editorViewHasFocus?: boolean;
     editorViewIsInvalid?: boolean;
-    isBorderContrastFixEnabled: boolean;
 };
 export declare const EditorViewContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;

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

@@ -10,7 +10,6 @@ export declare const EditorFooter: import("@emotion/styled").StyledComponent<{
 type EditorViewContainerProps = {
     editorViewHasFocus?: boolean;
     editorViewIsInvalid?: boolean;
-    isBorderContrastFixEnabled: boolean;
 };
 export declare const EditorViewContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/jql-editor",
-  "version": "4.2.2",
+  "version": "4.3.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",
@@ -38,20 +38,19 @@
   "dependencies": {
     "@atlaskit/analytics-gas-types": "^5.1.0",
     "@atlaskit/analytics-next": "^9.3.0",
-    "@atlaskit/avatar": "^21.6.0",
+    "@atlaskit/avatar": "^21.8.0",
     "@atlaskit/button": "^17.14.0",
     "@atlaskit/editor-prosemirror": "4.0.1",
-    "@atlaskit/form": "^9.3.0",
-    "@atlaskit/icon": "^22.1.0",
+    "@atlaskit/form": "^10.1.0",
+    "@atlaskit/icon": "^22.2.0",
     "@atlaskit/jql-ast": "^3.2.0",
     "@atlaskit/jql-autocomplete": "^2.0.0",
     "@atlaskit/jql-editor-common": "^2.0.0",
     "@atlaskit/jql-parser": "^2.0.0",
-    "@atlaskit/platform-feature-flags": "^0.2.4",
     "@atlaskit/spinner": "^16.1.0",
-    "@atlaskit/theme": "^12.7.0",
-    "@atlaskit/tokens": "^1.45.0",
-    "@atlaskit/tooltip": "^18.3.0",
+    "@atlaskit/theme": "^12.8.0",
+    "@atlaskit/tokens": "^1.48.0",
+    "@atlaskit/tooltip": "^18.4.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
     "@emotion/styled": "^11.0.0",
@@ -77,7 +76,6 @@
     "@atlaskit/jql-editor-autocomplete-rest": "^2.0.0",
     "@atlaskit/visual-regression": "*",
     "@atlassian/atlassian-frontend-prettier-config-1.0.0": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.0",
-    "@atlassian/feature-flags-test-utils": "*",
     "@storybook/addon-actions": "^5.2.5",
     "@storybook/addon-knobs": "^5.3.18",
     "@testing-library/jest-dom": "^5.16.5",
@@ -125,10 +123,5 @@
       ]
     }
   },
-  "platform-feature-flags": {
-    "platform.a11y-jira-team.fix-border-contrast-for-jql-editor-textarea_vy0qk": {
-      "type": "boolean"
-    }
-  },
   "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.0"
 }