@atlaskit/link-datasource 7.5.2 → 7.5.3

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @atlaskit/link-datasource
 
+## 7.5.3
+
+### Patch Changes
+
+- [`0cc2e73141eea`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/0cc2e73141eea) -
+  Behind the `platform-dst-top-layer` feature gate, no longer uses `@atlaskit/layering`. Open
+  overlays are found with the `@atlaskit/top-layer/page-surface` entry points instead
+  (`platform-dst-top-layer-tooltip` for tooltip). Behaviour with the gate off is unchanged.
+- Updated dependencies
+
 ## 7.5.2
 
 ### Patch Changes

package/compass.yml

@@ -27,7 +27,7 @@ links:
     url: https://opsj.atlassian.net/jira/ops/teams/62c5672c-3754-4ebe-8a0f-4d1c87ded5b5/on-call
   - name: Slack Channel
     type: CHAT_CHANNEL
-    url: https://atlassian.enterprise.slack.com/archives/C09LKUEEPGT # #rovo-growth
+    url: https://atlassian.enterprise.slack.com/archives/C09LKUEEPGT #rovo-growth
   - name: Link Datasource
     type: REPOSITORY
     url: https://bitbucket.org/atlassian/atlassian-frontend-monorepo/src/master/platform/packages/linking-platform/link-datasource

package/dist/cjs/ui/issue-like-table/edit-type/icon/index.js

@@ -8,7 +8,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
-var _layering = require("@atlaskit/layering/layering");
 var _default2 = _interopRequireDefault(require("@atlaskit/select/default"));
 var _Tooltip = _interopRequireDefault(require("@atlaskit/tooltip/Tooltip"));
 var _failUfoExperience = require("../../../../analytics/ufoExperiences/failUfoExperience");
@@ -18,6 +17,7 @@ var _useLoadOptions2 = require("../../../../hooks/useLoadOptions");
 var _getCleanedSelectProps = require("../../get-cleaned-select-props");
 var _icon = require("../../shared-components/icon");
 var _inlineEdit = require("../../table-cell-content/inline-edit");
+var _inlineEditLayer = require("../inline-edit-layer");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var IconEditType = function IconEditType(props) {
   var _currentValue$values;
@@ -45,9 +45,7 @@ var IconEditType = function IconEditType(props) {
       }, experienceId);
     }
   }, [experienceId, isLoading, hasFailed]);
-  return /*#__PURE__*/_react.default.createElement(_layering.Layering, {
-    isDisabled: false
-  }, /*#__PURE__*/_react.default.createElement(_default2.default, (0, _extends2.default)({}, (0, _getCleanedSelectProps.getCleanedSelectProps)(props), {
+  return /*#__PURE__*/_react.default.createElement(_inlineEditLayer.InlineEditLayer, null, /*#__PURE__*/_react.default.createElement(_default2.default, (0, _extends2.default)({}, (0, _getCleanedSelectProps.getCleanedSelectProps)(props), {
     menuPortalTarget: document.body,
     autoFocus: true,
     blurInputOnSelect: true,

package/dist/cjs/ui/issue-like-table/edit-type/inline-edit-layer/index.js

@@ -0,0 +1,49 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InlineEditLayer = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _layering = require("@atlaskit/layering/layering");
+var _fg = require("@atlaskit/platform-feature-flags/fg");
+var _hasOpenDialogOrPopover = require("@atlaskit/top-layer/page-surface/has-open-dialog-or-popover");
+var _requestClosePopovers = require("@atlaskit/top-layer/page-surface/request-close-popovers");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+/**
+ * Wraps an inline edit view, so that Escape cancels the edit and does not close a containing modal.
+ */
+var InlineEditLayer = exports.InlineEditLayer = function InlineEditLayer(_ref) {
+  var children = _ref.children;
+  var onKeyDown = (0, _react.useCallback)(function (event) {
+    if (event.key !== 'Escape') {
+      return;
+    }
+
+    // An open menu takes the first Escape, and the edit stays open (as with layering).
+    if ((0, _hasOpenDialogOrPopover.hasOpenDialogOrPopover)({
+      within: event.currentTarget
+    })) {
+      event.stopPropagation();
+      event.preventDefault();
+      (0, _requestClosePopovers.requestClosePopovers)({
+        within: event.currentTarget
+      });
+      return;
+    }
+
+    // The inline edit form still cancels the edit. A containing modal ignores a prevented Escape.
+    event.preventDefault();
+  }, []);
+  if (!(0, _fg.fg)('platform-dst-top-layer')) {
+    // The Escape handler of a containing modal yields while this layer is open.
+    return /*#__PURE__*/_react.default.createElement(_layering.Layering, {
+      isDisabled: false
+    }, children);
+  }
+  return /*#__PURE__*/_react.default.createElement("div", {
+    role: "presentation",
+    onKeyDown: onKeyDown
+  }, children);
+};

package/dist/cjs/ui/issue-like-table/edit-type/status/index.js

@@ -8,7 +8,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
-var _layering = require("@atlaskit/layering/layering");
 var _lozenge = _interopRequireDefault(require("@atlaskit/lozenge/new/lozenge"));
 var _default2 = _interopRequireDefault(require("@atlaskit/select/default"));
 var _Tooltip = _interopRequireDefault(require("@atlaskit/tooltip/Tooltip"));
@@ -18,6 +17,7 @@ var _useDatasourceExperienceId = require("../../../../contexts/datasource-experi
 var _useLoadOptions2 = require("../../../../hooks/useLoadOptions");
 var _getCleanedSelectProps = require("../../get-cleaned-select-props");
 var _inlineEdit = require("../../table-cell-content/inline-edit");
+var _inlineEditLayer = require("../inline-edit-layer");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var StatusEditType = function StatusEditType(props) {
   var _currentValue$values;
@@ -45,9 +45,7 @@ var StatusEditType = function StatusEditType(props) {
       }, experienceId);
     }
   }, [experienceId, isLoading, hasFailed]);
-  return /*#__PURE__*/_react.default.createElement(_layering.Layering, {
-    isDisabled: false
-  }, /*#__PURE__*/_react.default.createElement(_default2.default, (0, _extends2.default)({}, (0, _getCleanedSelectProps.getCleanedSelectProps)(props), {
+  return /*#__PURE__*/_react.default.createElement(_inlineEditLayer.InlineEditLayer, null, /*#__PURE__*/_react.default.createElement(_default2.default, (0, _extends2.default)({}, (0, _getCleanedSelectProps.getCleanedSelectProps)(props), {
     menuPortalTarget: document.body,
     autoFocus: true,
     options: options,

package/dist/cjs/ui/issue-like-table/edit-type/text/index.js

@@ -8,10 +8,10 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = _interopRequireWildcard(require("react"));
-var _layering = require("@atlaskit/layering/layering");
 var _textField = _interopRequireDefault(require("@atlaskit/textfield/text-field"));
 var _succeedUfoExperience = require("../../../../analytics/ufoExperiences/succeedUfoExperience");
 var _useDatasourceExperienceId = require("../../../../contexts/datasource-experience-id/use-datasource-experience-id");
+var _inlineEditLayer = require("../inline-edit-layer");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var TextEditType = function TextEditType(props) {
   var _currentValue$values$, _currentValue$values;
@@ -25,9 +25,7 @@ var TextEditType = function TextEditType(props) {
       }, experienceId);
     }
   }, [experienceId]);
-  return /*#__PURE__*/_react.default.createElement(_layering.Layering, {
-    isDisabled: false
-  }, /*#__PURE__*/_react.default.createElement(_textField.default, (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/_react.default.createElement(_inlineEditLayer.InlineEditLayer, null, /*#__PURE__*/_react.default.createElement(_textField.default, (0, _extends2.default)({}, props, {
     autoFocus: true,
     isCompact: true,
     testId: "inline-edit-text",

package/dist/cjs/ui/issue-like-table/edit-type/user/index.js

@@ -13,7 +13,6 @@ var _reactIntl = require("react-intl");
 var _useDebounce = require("use-debounce");
 var _avatar = _interopRequireDefault(require("@atlaskit/avatar/avatar"));
 var _avatarItem = _interopRequireDefault(require("@atlaskit/avatar/avatar-item"));
-var _layering = require("@atlaskit/layering/layering");
 var _default2 = _interopRequireDefault(require("@atlaskit/select/default"));
 var _Tooltip = _interopRequireDefault(require("@atlaskit/tooltip/Tooltip"));
 var _failUfoExperience = require("../../../../analytics/ufoExperiences/failUfoExperience");
@@ -25,6 +24,7 @@ var _getCleanedSelectProps = require("../../get-cleaned-select-props");
 var _user = require("../../render-type/user");
 var _messages = require("../../render-type/user/messages");
 var _inlineEdit = require("../../table-cell-content/inline-edit");
+var _inlineEditLayer = require("../inline-edit-layer");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var UserEditType = function UserEditType(props) {
   var _currentValue$values;
@@ -76,9 +76,7 @@ var UserEditType = function UserEditType(props) {
       }, experienceId);
     }
   }, [experienceId, isLoading, hasFailed]);
-  return /*#__PURE__*/_react.default.createElement(_layering.Layering, {
-    isDisabled: false
-  }, /*#__PURE__*/_react.default.createElement(_default2.default, (0, _extends2.default)({}, (0, _getCleanedSelectProps.getCleanedSelectProps)(props), {
+  return /*#__PURE__*/_react.default.createElement(_inlineEditLayer.InlineEditLayer, null, /*#__PURE__*/_react.default.createElement(_default2.default, (0, _extends2.default)({}, (0, _getCleanedSelectProps.getCleanedSelectProps)(props), {
     menuPortalTarget: document.body,
     autoFocus: true,
     defaultMenuIsOpen: true,

package/dist/es2019/ui/issue-like-table/edit-type/icon/index.js

@@ -1,6 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useEffect } from 'react';
-import { Layering } from '@atlaskit/layering/layering';
 import Select from '@atlaskit/select/default';
 import Tooltip from '@atlaskit/tooltip/Tooltip';
 import { failUfoExperience } from '../../../../analytics/ufoExperiences/failUfoExperience';
@@ -10,6 +9,7 @@ import { useLoadOptions } from '../../../../hooks/useLoadOptions';
 import { getCleanedSelectProps } from '../../get-cleaned-select-props';
 import { SharedIconComponent } from '../../shared-components/icon';
 import { InlineEditUFOExperience } from '../../table-cell-content/inline-edit';
+import { InlineEditLayer } from '../inline-edit-layer';
 const IconEditType = props => {
   var _currentValue$values;
   const {
@@ -39,9 +39,7 @@ const IconEditType = props => {
       }, experienceId);
     }
   }, [experienceId, isLoading, hasFailed]);
-  return /*#__PURE__*/React.createElement(Layering, {
-    isDisabled: false
-  }, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
+  return /*#__PURE__*/React.createElement(InlineEditLayer, null, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
     menuPortalTarget: document.body,
     autoFocus: true,
     blurInputOnSelect: true,

package/dist/es2019/ui/issue-like-table/edit-type/inline-edit-layer/index.js

@@ -0,0 +1,43 @@
+import React, { useCallback } from 'react';
+import { Layering } from '@atlaskit/layering/layering';
+import { fg } from '@atlaskit/platform-feature-flags/fg';
+import { hasOpenDialogOrPopover } from '@atlaskit/top-layer/page-surface/has-open-dialog-or-popover';
+import { requestClosePopovers } from '@atlaskit/top-layer/page-surface/request-close-popovers';
+
+/**
+ * Wraps an inline edit view, so that Escape cancels the edit and does not close a containing modal.
+ */
+export const InlineEditLayer = ({
+  children
+}) => {
+  const onKeyDown = useCallback(event => {
+    if (event.key !== 'Escape') {
+      return;
+    }
+
+    // An open menu takes the first Escape, and the edit stays open (as with layering).
+    if (hasOpenDialogOrPopover({
+      within: event.currentTarget
+    })) {
+      event.stopPropagation();
+      event.preventDefault();
+      requestClosePopovers({
+        within: event.currentTarget
+      });
+      return;
+    }
+
+    // The inline edit form still cancels the edit. A containing modal ignores a prevented Escape.
+    event.preventDefault();
+  }, []);
+  if (!fg('platform-dst-top-layer')) {
+    // The Escape handler of a containing modal yields while this layer is open.
+    return /*#__PURE__*/React.createElement(Layering, {
+      isDisabled: false
+    }, children);
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    role: "presentation",
+    onKeyDown: onKeyDown
+  }, children);
+};

package/dist/es2019/ui/issue-like-table/edit-type/status/index.js

@@ -1,6 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useEffect } from 'react';
-import { Layering } from '@atlaskit/layering/layering';
 import Lozenge from '@atlaskit/lozenge/new/lozenge';
 import Select from '@atlaskit/select/default';
 import Tooltip from '@atlaskit/tooltip/Tooltip';
@@ -10,6 +9,7 @@ import { useDatasourceExperienceId } from '../../../../contexts/datasource-exper
 import { useLoadOptions } from '../../../../hooks/useLoadOptions';
 import { getCleanedSelectProps } from '../../get-cleaned-select-props';
 import { InlineEditUFOExperience } from '../../table-cell-content/inline-edit';
+import { InlineEditLayer } from '../inline-edit-layer';
 const StatusEditType = props => {
   var _currentValue$values;
   const {
@@ -39,9 +39,7 @@ const StatusEditType = props => {
       }, experienceId);
     }
   }, [experienceId, isLoading, hasFailed]);
-  return /*#__PURE__*/React.createElement(Layering, {
-    isDisabled: false
-  }, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
+  return /*#__PURE__*/React.createElement(InlineEditLayer, null, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
     menuPortalTarget: document.body,
     autoFocus: true,
     options: options,

package/dist/es2019/ui/issue-like-table/edit-type/text/index.js

@@ -1,9 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useEffect } from 'react';
-import { Layering } from '@atlaskit/layering/layering';
 import Textfield from '@atlaskit/textfield/text-field';
 import { succeedUfoExperience } from '../../../../analytics/ufoExperiences/succeedUfoExperience';
 import { useDatasourceExperienceId } from '../../../../contexts/datasource-experience-id/use-datasource-experience-id';
+import { InlineEditLayer } from '../inline-edit-layer';
 const TextEditType = props => {
   var _currentValue$values$, _currentValue$values;
   const experienceId = useDatasourceExperienceId();
@@ -18,9 +18,7 @@ const TextEditType = props => {
       }, experienceId);
     }
   }, [experienceId]);
-  return /*#__PURE__*/React.createElement(Layering, {
-    isDisabled: false
-  }, /*#__PURE__*/React.createElement(Textfield, _extends({}, props, {
+  return /*#__PURE__*/React.createElement(InlineEditLayer, null, /*#__PURE__*/React.createElement(Textfield, _extends({}, props, {
     autoFocus: true,
     isCompact: true,
     testId: "inline-edit-text",

package/dist/es2019/ui/issue-like-table/edit-type/user/index.js

@@ -4,7 +4,6 @@ import { useIntl } from 'react-intl';
 import { useDebouncedCallback } from 'use-debounce';
 import Avatar from '@atlaskit/avatar/avatar';
 import AvatarItem from '@atlaskit/avatar/avatar-item';
-import { Layering } from '@atlaskit/layering/layering';
 import Select from '@atlaskit/select/default';
 import Tooltip from '@atlaskit/tooltip/Tooltip';
 import { failUfoExperience } from '../../../../analytics/ufoExperiences/failUfoExperience';
@@ -16,6 +15,7 @@ import { getCleanedSelectProps } from '../../get-cleaned-select-props';
 import { USER_TYPE_TEST_ID } from '../../render-type/user';
 import { userTypeMessages } from '../../render-type/user/messages';
 import { InlineEditUFOExperience } from '../../table-cell-content/inline-edit';
+import { InlineEditLayer } from '../inline-edit-layer';
 const UserEditType = props => {
   var _currentValue$values;
   const {
@@ -61,9 +61,7 @@ const UserEditType = props => {
       }, experienceId);
     }
   }, [experienceId, isLoading, hasFailed]);
-  return /*#__PURE__*/React.createElement(Layering, {
-    isDisabled: false
-  }, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
+  return /*#__PURE__*/React.createElement(InlineEditLayer, null, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
     menuPortalTarget: document.body,
     autoFocus: true,
     defaultMenuIsOpen: true,

package/dist/esm/ui/issue-like-table/edit-type/icon/index.js

@@ -1,6 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useEffect } from 'react';
-import { Layering } from '@atlaskit/layering/layering';
 import Select from '@atlaskit/select/default';
 import Tooltip from '@atlaskit/tooltip/Tooltip';
 import { failUfoExperience } from '../../../../analytics/ufoExperiences/failUfoExperience';
@@ -10,6 +9,7 @@ import { useLoadOptions } from '../../../../hooks/useLoadOptions';
 import { getCleanedSelectProps } from '../../get-cleaned-select-props';
 import { SharedIconComponent } from '../../shared-components/icon';
 import { InlineEditUFOExperience } from '../../table-cell-content/inline-edit';
+import { InlineEditLayer } from '../inline-edit-layer';
 var IconEditType = function IconEditType(props) {
   var _currentValue$values;
   var currentValue = props.currentValue,
@@ -36,9 +36,7 @@ var IconEditType = function IconEditType(props) {
       }, experienceId);
     }
   }, [experienceId, isLoading, hasFailed]);
-  return /*#__PURE__*/React.createElement(Layering, {
-    isDisabled: false
-  }, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
+  return /*#__PURE__*/React.createElement(InlineEditLayer, null, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
     menuPortalTarget: document.body,
     autoFocus: true,
     blurInputOnSelect: true,

package/dist/esm/ui/issue-like-table/edit-type/inline-edit-layer/index.js

@@ -0,0 +1,42 @@
+import React, { useCallback } from 'react';
+import { Layering } from '@atlaskit/layering/layering';
+import { fg } from '@atlaskit/platform-feature-flags/fg';
+import { hasOpenDialogOrPopover } from '@atlaskit/top-layer/page-surface/has-open-dialog-or-popover';
+import { requestClosePopovers } from '@atlaskit/top-layer/page-surface/request-close-popovers';
+
+/**
+ * Wraps an inline edit view, so that Escape cancels the edit and does not close a containing modal.
+ */
+export var InlineEditLayer = function InlineEditLayer(_ref) {
+  var children = _ref.children;
+  var onKeyDown = useCallback(function (event) {
+    if (event.key !== 'Escape') {
+      return;
+    }
+
+    // An open menu takes the first Escape, and the edit stays open (as with layering).
+    if (hasOpenDialogOrPopover({
+      within: event.currentTarget
+    })) {
+      event.stopPropagation();
+      event.preventDefault();
+      requestClosePopovers({
+        within: event.currentTarget
+      });
+      return;
+    }
+
+    // The inline edit form still cancels the edit. A containing modal ignores a prevented Escape.
+    event.preventDefault();
+  }, []);
+  if (!fg('platform-dst-top-layer')) {
+    // The Escape handler of a containing modal yields while this layer is open.
+    return /*#__PURE__*/React.createElement(Layering, {
+      isDisabled: false
+    }, children);
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    role: "presentation",
+    onKeyDown: onKeyDown
+  }, children);
+};

package/dist/esm/ui/issue-like-table/edit-type/status/index.js

@@ -1,6 +1,5 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useEffect } from 'react';
-import { Layering } from '@atlaskit/layering/layering';
 import Lozenge from '@atlaskit/lozenge/new/lozenge';
 import Select from '@atlaskit/select/default';
 import Tooltip from '@atlaskit/tooltip/Tooltip';
@@ -10,6 +9,7 @@ import { useDatasourceExperienceId } from '../../../../contexts/datasource-exper
 import { useLoadOptions } from '../../../../hooks/useLoadOptions';
 import { getCleanedSelectProps } from '../../get-cleaned-select-props';
 import { InlineEditUFOExperience } from '../../table-cell-content/inline-edit';
+import { InlineEditLayer } from '../inline-edit-layer';
 var StatusEditType = function StatusEditType(props) {
   var _currentValue$values;
   var currentValue = props.currentValue,
@@ -36,9 +36,7 @@ var StatusEditType = function StatusEditType(props) {
       }, experienceId);
     }
   }, [experienceId, isLoading, hasFailed]);
-  return /*#__PURE__*/React.createElement(Layering, {
-    isDisabled: false
-  }, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
+  return /*#__PURE__*/React.createElement(InlineEditLayer, null, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
     menuPortalTarget: document.body,
     autoFocus: true,
     options: options,

package/dist/esm/ui/issue-like-table/edit-type/text/index.js

@@ -1,9 +1,9 @@
 import _extends from "@babel/runtime/helpers/extends";
 import React, { useEffect } from 'react';
-import { Layering } from '@atlaskit/layering/layering';
 import Textfield from '@atlaskit/textfield/text-field';
 import { succeedUfoExperience } from '../../../../analytics/ufoExperiences/succeedUfoExperience';
 import { useDatasourceExperienceId } from '../../../../contexts/datasource-experience-id/use-datasource-experience-id';
+import { InlineEditLayer } from '../inline-edit-layer';
 var TextEditType = function TextEditType(props) {
   var _currentValue$values$, _currentValue$values;
   var experienceId = useDatasourceExperienceId();
@@ -16,9 +16,7 @@ var TextEditType = function TextEditType(props) {
       }, experienceId);
     }
   }, [experienceId]);
-  return /*#__PURE__*/React.createElement(Layering, {
-    isDisabled: false
-  }, /*#__PURE__*/React.createElement(Textfield, _extends({}, props, {
+  return /*#__PURE__*/React.createElement(InlineEditLayer, null, /*#__PURE__*/React.createElement(Textfield, _extends({}, props, {
     autoFocus: true,
     isCompact: true,
     testId: "inline-edit-text",

package/dist/esm/ui/issue-like-table/edit-type/user/index.js

@@ -5,7 +5,6 @@ import { useIntl } from 'react-intl';
 import { useDebouncedCallback } from 'use-debounce';
 import Avatar from '@atlaskit/avatar/avatar';
 import AvatarItem from '@atlaskit/avatar/avatar-item';
-import { Layering } from '@atlaskit/layering/layering';
 import Select from '@atlaskit/select/default';
 import Tooltip from '@atlaskit/tooltip/Tooltip';
 import { failUfoExperience } from '../../../../analytics/ufoExperiences/failUfoExperience';
@@ -17,6 +16,7 @@ import { getCleanedSelectProps } from '../../get-cleaned-select-props';
 import { USER_TYPE_TEST_ID } from '../../render-type/user';
 import { userTypeMessages } from '../../render-type/user/messages';
 import { InlineEditUFOExperience } from '../../table-cell-content/inline-edit';
+import { InlineEditLayer } from '../inline-edit-layer';
 var UserEditType = function UserEditType(props) {
   var _currentValue$values;
   var currentValue = props.currentValue,
@@ -67,9 +67,7 @@ var UserEditType = function UserEditType(props) {
       }, experienceId);
     }
   }, [experienceId, isLoading, hasFailed]);
-  return /*#__PURE__*/React.createElement(Layering, {
-    isDisabled: false
-  }, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
+  return /*#__PURE__*/React.createElement(InlineEditLayer, null, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
     menuPortalTarget: document.body,
     autoFocus: true,
     defaultMenuIsOpen: true,

package/dist/types/ui/issue-like-table/edit-type/inline-edit-layer/index.d.ts

@@ -0,0 +1,7 @@
+import React, { type ReactNode } from 'react';
+/**
+ * Wraps an inline edit view, so that Escape cancels the edit and does not close a containing modal.
+ */
+export declare const InlineEditLayer: ({ children }: {
+    children: ReactNode;
+}) => React.JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/link-datasource",
-	"version": "7.5.2",
+	"version": "7.5.3",
 	"description": "UI Components to support linking platform dataset feature",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -46,7 +46,7 @@
 		"@atlaskit/avatar": "^30.0.0",
 		"@atlaskit/avatar-group": "^14.4.0",
 		"@atlaskit/badge": "^22.0.0",
-		"@atlaskit/button": "^25.5.0",
+		"@atlaskit/button": "^25.6.0",
 		"@atlaskit/css": "^1.1.0",
 		"@atlaskit/datetime-picker": "^19.3.0",
 		"@atlaskit/dropdown-menu": "^21.0.0",
@@ -61,9 +61,9 @@
 		"@atlaskit/inline-edit": "^16.4.0",
 		"@atlaskit/intl-messages-provider": "^5.0.0",
 		"@atlaskit/jql-ast": "^4.2.0",
-		"@atlaskit/jql-editor": "^8.3.0",
+		"@atlaskit/jql-editor": "^8.5.0",
 		"@atlaskit/jql-editor-autocomplete-rest": "^4.6.0",
-		"@atlaskit/layering": "^6.0.0",
+		"@atlaskit/layering": "^6.1.0",
 		"@atlaskit/link": "^5.1.0",
 		"@atlaskit/link-client-extension": "^8.0.0",
 		"@atlaskit/link-provider": "^6.0.0",
@@ -95,6 +95,7 @@
 		"@atlaskit/toggle": "^17.3.0",
 		"@atlaskit/tokens": "^20.6.0",
 		"@atlaskit/tooltip": "^24.4.0",
+		"@atlaskit/top-layer": "^6.6.0",
 		"@atlaskit/ufo": "^2.0.0",
 		"@atlaskit/user-picker": "^14.2.0",
 		"@atlaskit/visually-hidden": "^4.4.0",
@@ -120,6 +121,7 @@
 		"@af/integration-testing": "workspace:^",
 		"@af/visual-regression": "workspace:^",
 		"@atlaskit/code": "^20.0.0",
+		"@atlaskit/docs": "^12.3.0",
 		"@atlaskit/json-ld-types": "^2.1.0",
 		"@atlaskit/link-test-helpers": "^11.2.0",
 		"@atlaskit/radio": "^10.2.0",
@@ -179,6 +181,9 @@
 		"electric_issue_like_table_xpc_url_wrapping": {
 			"type": "boolean"
 		},
+		"platform-dst-top-layer": {
+			"type": "boolean"
+		},
 		"platform-dst-top-layer-tooltip": {
 			"type": "boolean",
 			"referenceOnly": true