@atlaskit/inline-edit 13.7.1 → 13.7.3

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/inline-edit
 
+## 13.7.3
+
+### Patch Changes
+
+- [#143699](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/143699)
+  [`95773a1f97047`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/95773a1f97047) -
+  Safari: prevent blur actions when Cancel control is clicked
+- Updated dependencies
+
+## 13.7.2
+
+### Patch Changes
+
+- [`04ca60ed535e8`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/04ca60ed535e8) -
+  [ux] Changes InlineEdit behaviour to call form reset() function when cancelling edit through
+  escape key press by default. Changes made behind feature flag
+  platform-design-system-inline-edit-reset-on-escape.
+
 ## 13.7.1
 
 ### Patch Changes

package/dist/cjs/inline-edit.js

@@ -14,13 +14,14 @@ var _analyticsNext = require("@atlaskit/analytics-next");
 var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
 var _Field = _interopRequireDefault(require("@atlaskit/form/Field"));
 var _Form = _interopRequireDefault(require("@atlaskit/form/Form"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _pressable = _interopRequireDefault(require("@atlaskit/primitives/pressable"));
 var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
 var _buttons = _interopRequireDefault(require("./internal/buttons"));
 var _useButtonFocusHook2 = _interopRequireDefault(require("./internal/hooks/use-button-focus-hook"));
 var _readView = _interopRequireDefault(require("./internal/read-view"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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; } /**
  * @jsxRuntime classic
@@ -33,7 +34,7 @@ var fieldStyles = (0, _react2.css)({
 var analyticsAttributes = {
   componentName: 'inlineEdit',
   packageName: "@atlaskit/inline-edit",
-  packageVersion: "13.7.1"
+  packageVersion: "13.7.3"
 };
 var InnerInlineEdit = function InnerInlineEdit(props) {
   var _props$startWithEditV = props.startWithEditViewOpen,
@@ -191,6 +192,9 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
       onKeyDown: function onKeyDown(e) {
         _onKeyDown(e);
         if (e.key === 'Esc' || e.key === 'Escape') {
+          if ((0, _platformFeatureFlags.fg)('platform-design-system-inline-edit-reset-on-escape')) {
+            reset();
+          }
           onCancel();
         }
       },
@@ -208,8 +212,10 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
         error = _ref2.error;
       return (0, _react2.jsx)("div", {
         css: fieldStyles,
-        onBlur: function onBlur() {
-          onEditViewWrapperBlur(fieldProps.isInvalid, onSubmit, formRef);
+        onBlur: function onBlur(e) {
+          if (!e.currentTarget.contains(e.relatedTarget)) {
+            onEditViewWrapperBlur(fieldProps.isInvalid, onSubmit, formRef);
+          }
         },
         onFocus: onEditViewWrapperFocus
       }, editView(_objectSpread(_objectSpread({}, fieldProps), {}, {

package/dist/cjs/internal/buttons.js

@@ -12,6 +12,8 @@ var _check = _interopRequireDefault(require("@atlaskit/icon/glyph/check"));
 var _cross = _interopRequireDefault(require("@atlaskit/icon/glyph/cross"));
 var _colors = require("@atlaskit/theme/colors");
 var _constants = require("./constants");
+/* eslint-disable @atlaskit/design-system/no-nested-styles */
+/* eslint-disable @atlaskit/ui-styling-standard/no-nested-selectors */
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -21,13 +23,11 @@ var _constants = require("./constants");
 
 var buttonsContainerStyles = (0, _react.css)({
   display: 'flex',
-  marginBlockStart: "var(--ds-space-075, 6px)",
   position: 'absolute',
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+  flexShrink: 0,
   insetBlockStart: '100%',
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
   insetInlineEnd: 0,
-  flexShrink: 0
+  marginBlockStart: "var(--ds-space-075, 6px)"
 });
 var buttonWrapperBaseStyles = (0, _react.css)({
   boxSizing: 'border-box',
@@ -35,28 +35,35 @@ var buttonWrapperBaseStyles = (0, _react.css)({
   zIndex: 200,
   backgroundColor: "var(--ds-surface-overlay, ".concat(_colors.N0, ")"),
   borderRadius: "var(--ds-border-radius, 3px)",
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  boxShadow: "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(_colors.N50A, ", 0 0 1px ").concat(_colors.N60A), ")"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
   fontSize: _constants.fontSize,
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
   '&:last-child': {
     marginInlineStart: "var(--ds-space-050, 4px)"
   },
-  boxShadow: "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(_colors.N50A, ", 0 0 1px ").concat(_colors.N60A), ")"),
-  // These buttons are floating, so they need an override to overlay interaction states
-  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& > button': {
     backgroundColor: "var(--ds-surface-overlay, ".concat(_colors.N20A, ")")
   },
-  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& > button:hover': {
     backgroundColor: "var(--ds-surface-overlay-hovered, ".concat(_colors.N30A, ")")
   },
-  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& > button:active': {
     backgroundColor: "var(--ds-surface-overlay-pressed, rgba(179, 212, 255, 0.6))",
     color: "var(--ds-text, ".concat(_colors.B400, ")")
   }
 });
+// TODO: Fill in the component {description} and ensure links point to the correct {packageName} location.
+// Remove links that the component does not have (such as usage). If there are no links remove them all.
+/**
+ * __Buttons__
+ *
+ * A buttons {description}.
+ *
+ * - [Examples](https://atlassian.design/components/{packageName}/examples)
+ * - [Code](https://atlassian.design/components/{packageName}/code)
+ * - [Usage](https://atlassian.design/components/{packageName}/usage)
+ */
 var Buttons = function Buttons(_ref) {
   var confirmButtonLabel = _ref.confirmButtonLabel,
     cancelButtonLabel = _ref.cancelButtonLabel,
@@ -66,7 +73,8 @@ var Buttons = function Buttons(_ref) {
   return (0, _react.jsx)("div", {
     css: buttonsContainerStyles
   }, (0, _react.jsx)("div", {
-    css: buttonWrapperBaseStyles
+    css: buttonWrapperBaseStyles,
+    tabIndex: -1
   }, (0, _react.jsx)(_new.IconButton, {
     type: "submit",
     icon: function icon(iconProps) {
@@ -78,7 +86,8 @@ var Buttons = function Buttons(_ref) {
     label: confirmButtonLabel,
     testId: testId && "".concat(testId, "--confirm")
   })), (0, _react.jsx)("div", {
-    css: buttonWrapperBaseStyles
+    css: buttonWrapperBaseStyles,
+    tabIndex: -1
   }, (0, _react.jsx)(_new.IconButton, {
     icon: function icon(iconProps) {
       return (0, _react.jsx)(_cross.default, (0, _extends2.default)({}, iconProps, {

package/dist/cjs/internal/read-view.js

@@ -11,7 +11,7 @@ var _primitives = require("@atlaskit/primitives");
 var _colors = require("@atlaskit/theme/colors");
 var _constants = require("./constants");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /**
  * @jsxRuntime classic
  * @jsx jsx

package/dist/es2019/inline-edit.js

@@ -10,6 +10,7 @@ import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next';
 import __noop from '@atlaskit/ds-lib/noop';
 import Field from '@atlaskit/form/Field';
 import Form from '@atlaskit/form/Form';
+import { fg } from '@atlaskit/platform-feature-flags';
 import Pressable from '@atlaskit/primitives/pressable';
 import VisuallyHidden from '@atlaskit/visually-hidden';
 import Buttons from './internal/buttons';
@@ -22,7 +23,7 @@ const fieldStyles = css({
 const analyticsAttributes = {
   componentName: 'inlineEdit',
   packageName: "@atlaskit/inline-edit",
-  packageVersion: "13.7.1"
+  packageVersion: "13.7.3"
 };
 const InnerInlineEdit = props => {
   const {
@@ -167,6 +168,9 @@ const InnerInlineEdit = props => {
     onKeyDown: e => {
       onKeyDown(e);
       if (e.key === 'Esc' || e.key === 'Escape') {
+        if (fg('platform-design-system-inline-edit-reset-on-escape')) {
+          reset();
+        }
         onCancel();
       }
     },
@@ -184,8 +188,10 @@ const InnerInlineEdit = props => {
     error
   }) => jsx("div", {
     css: fieldStyles,
-    onBlur: () => {
-      onEditViewWrapperBlur(fieldProps.isInvalid, onSubmit, formRef);
+    onBlur: e => {
+      if (!e.currentTarget.contains(e.relatedTarget)) {
+        onEditViewWrapperBlur(fieldProps.isInvalid, onSubmit, formRef);
+      }
     },
     onFocus: onEditViewWrapperFocus
   }, editView({

package/dist/es2019/internal/buttons.js

@@ -1,4 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
+/* eslint-disable @atlaskit/design-system/no-nested-styles */
+/* eslint-disable @atlaskit/ui-styling-standard/no-nested-selectors */
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -13,13 +15,11 @@ import { B400, N0, N20A, N30A, N50A, N60A } from '@atlaskit/theme/colors';
 import { fontSize } from './constants';
 const buttonsContainerStyles = css({
   display: 'flex',
-  marginBlockStart: "var(--ds-space-075, 6px)",
   position: 'absolute',
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+  flexShrink: 0,
   insetBlockStart: '100%',
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
   insetInlineEnd: 0,
-  flexShrink: 0
+  marginBlockStart: "var(--ds-space-075, 6px)"
 });
 const buttonWrapperBaseStyles = css({
   boxSizing: 'border-box',
@@ -27,28 +27,35 @@ const buttonWrapperBaseStyles = css({
   zIndex: 200,
   backgroundColor: `var(--ds-surface-overlay, ${N0})`,
   borderRadius: "var(--ds-border-radius, 3px)",
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  boxShadow: `var(--ds-shadow-overlay, ${`0 4px 8px -2px ${N50A}, 0 0 1px ${N60A}`})`,
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
   fontSize: fontSize,
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
   '&:last-child': {
     marginInlineStart: "var(--ds-space-050, 4px)"
   },
-  boxShadow: `var(--ds-shadow-overlay, ${`0 4px 8px -2px ${N50A}, 0 0 1px ${N60A}`})`,
-  // These buttons are floating, so they need an override to overlay interaction states
-  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& > button': {
     backgroundColor: `var(--ds-surface-overlay, ${N20A})`
   },
-  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& > button:hover': {
     backgroundColor: `var(--ds-surface-overlay-hovered, ${N30A})`
   },
-  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& > button:active': {
     backgroundColor: "var(--ds-surface-overlay-pressed, rgba(179, 212, 255, 0.6))",
     color: `var(--ds-text, ${B400})`
   }
 });
+// TODO: Fill in the component {description} and ensure links point to the correct {packageName} location.
+// Remove links that the component does not have (such as usage). If there are no links remove them all.
+/**
+ * __Buttons__
+ *
+ * A buttons {description}.
+ *
+ * - [Examples](https://atlassian.design/components/{packageName}/examples)
+ * - [Code](https://atlassian.design/components/{packageName}/code)
+ * - [Usage](https://atlassian.design/components/{packageName}/usage)
+ */
 const Buttons = ({
   confirmButtonLabel,
   cancelButtonLabel,
@@ -59,7 +66,8 @@ const Buttons = ({
   return jsx("div", {
     css: buttonsContainerStyles
   }, jsx("div", {
-    css: buttonWrapperBaseStyles
+    css: buttonWrapperBaseStyles,
+    tabIndex: -1
   }, jsx(IconButton, {
     type: "submit",
     icon: iconProps => jsx(ConfirmIcon, _extends({}, iconProps, {
@@ -69,7 +77,8 @@ const Buttons = ({
     label: confirmButtonLabel,
     testId: testId && `${testId}--confirm`
   })), jsx("div", {
-    css: buttonWrapperBaseStyles
+    css: buttonWrapperBaseStyles,
+    tabIndex: -1
   }, jsx(IconButton, {
     icon: iconProps => jsx(CancelIcon, _extends({}, iconProps, {
       size: "small"

package/dist/esm/inline-edit.js

@@ -14,6 +14,7 @@ import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next';
 import __noop from '@atlaskit/ds-lib/noop';
 import Field from '@atlaskit/form/Field';
 import Form from '@atlaskit/form/Form';
+import { fg } from '@atlaskit/platform-feature-flags';
 import Pressable from '@atlaskit/primitives/pressable';
 import VisuallyHidden from '@atlaskit/visually-hidden';
 import Buttons from './internal/buttons';
@@ -26,7 +27,7 @@ var fieldStyles = css({
 var analyticsAttributes = {
   componentName: 'inlineEdit',
   packageName: "@atlaskit/inline-edit",
-  packageVersion: "13.7.1"
+  packageVersion: "13.7.3"
 };
 var InnerInlineEdit = function InnerInlineEdit(props) {
   var _props$startWithEditV = props.startWithEditViewOpen,
@@ -184,6 +185,9 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
       onKeyDown: function onKeyDown(e) {
         _onKeyDown(e);
         if (e.key === 'Esc' || e.key === 'Escape') {
+          if (fg('platform-design-system-inline-edit-reset-on-escape')) {
+            reset();
+          }
           onCancel();
         }
       },
@@ -201,8 +205,10 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
         error = _ref2.error;
       return jsx("div", {
         css: fieldStyles,
-        onBlur: function onBlur() {
-          onEditViewWrapperBlur(fieldProps.isInvalid, onSubmit, formRef);
+        onBlur: function onBlur(e) {
+          if (!e.currentTarget.contains(e.relatedTarget)) {
+            onEditViewWrapperBlur(fieldProps.isInvalid, onSubmit, formRef);
+          }
         },
         onFocus: onEditViewWrapperFocus
       }, editView(_objectSpread(_objectSpread({}, fieldProps), {}, {

package/dist/esm/internal/buttons.js

@@ -1,4 +1,6 @@
 import _extends from "@babel/runtime/helpers/extends";
+/* eslint-disable @atlaskit/design-system/no-nested-styles */
+/* eslint-disable @atlaskit/ui-styling-standard/no-nested-selectors */
 /**
  * @jsxRuntime classic
  * @jsx jsx
@@ -13,13 +15,11 @@ import { B400, N0, N20A, N30A, N50A, N60A } from '@atlaskit/theme/colors';
 import { fontSize } from './constants';
 var buttonsContainerStyles = css({
   display: 'flex',
-  marginBlockStart: "var(--ds-space-075, 6px)",
   position: 'absolute',
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
+  flexShrink: 0,
   insetBlockStart: '100%',
-  // eslint-disable-next-line @atlaskit/design-system/ensure-design-token-usage
   insetInlineEnd: 0,
-  flexShrink: 0
+  marginBlockStart: "var(--ds-space-075, 6px)"
 });
 var buttonWrapperBaseStyles = css({
   boxSizing: 'border-box',
@@ -27,28 +27,35 @@ var buttonWrapperBaseStyles = css({
   zIndex: 200,
   backgroundColor: "var(--ds-surface-overlay, ".concat(N0, ")"),
   borderRadius: "var(--ds-border-radius, 3px)",
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
+  boxShadow: "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(N50A, ", 0 0 1px ").concat(N60A), ")"),
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
   fontSize: fontSize,
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
   '&:last-child': {
     marginInlineStart: "var(--ds-space-050, 4px)"
   },
-  boxShadow: "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(N50A, ", 0 0 1px ").concat(N60A), ")"),
-  // These buttons are floating, so they need an override to overlay interaction states
-  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& > button': {
     backgroundColor: "var(--ds-surface-overlay, ".concat(N20A, ")")
   },
-  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& > button:hover': {
     backgroundColor: "var(--ds-surface-overlay-hovered, ".concat(N30A, ")")
   },
-  // eslint-disable-next-line @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
   '& > button:active': {
     backgroundColor: "var(--ds-surface-overlay-pressed, rgba(179, 212, 255, 0.6))",
     color: "var(--ds-text, ".concat(B400, ")")
   }
 });
+// TODO: Fill in the component {description} and ensure links point to the correct {packageName} location.
+// Remove links that the component does not have (such as usage). If there are no links remove them all.
+/**
+ * __Buttons__
+ *
+ * A buttons {description}.
+ *
+ * - [Examples](https://atlassian.design/components/{packageName}/examples)
+ * - [Code](https://atlassian.design/components/{packageName}/code)
+ * - [Usage](https://atlassian.design/components/{packageName}/usage)
+ */
 var Buttons = function Buttons(_ref) {
   var confirmButtonLabel = _ref.confirmButtonLabel,
     cancelButtonLabel = _ref.cancelButtonLabel,
@@ -58,7 +65,8 @@ var Buttons = function Buttons(_ref) {
   return jsx("div", {
     css: buttonsContainerStyles
   }, jsx("div", {
-    css: buttonWrapperBaseStyles
+    css: buttonWrapperBaseStyles,
+    tabIndex: -1
   }, jsx(IconButton, {
     type: "submit",
     icon: function icon(iconProps) {
@@ -70,7 +78,8 @@ var Buttons = function Buttons(_ref) {
     label: confirmButtonLabel,
     testId: testId && "".concat(testId, "--confirm")
   })), jsx("div", {
-    css: buttonWrapperBaseStyles
+    css: buttonWrapperBaseStyles,
+    tabIndex: -1
   }, jsx(IconButton, {
     icon: function icon(iconProps) {
       return jsx(CancelIcon, _extends({}, iconProps, {

package/dist/types/internal/buttons.d.ts

@@ -11,5 +11,14 @@ interface ButtonsProp {
     onCancelClick: (event: React.MouseEvent<HTMLElement>) => void;
     testId?: string;
 }
+/**
+ * __Buttons__
+ *
+ * A buttons {description}.
+ *
+ * - [Examples](https://atlassian.design/components/{packageName}/examples)
+ * - [Code](https://atlassian.design/components/{packageName}/code)
+ * - [Usage](https://atlassian.design/components/{packageName}/usage)
+ */
 declare const Buttons: ({ confirmButtonLabel, cancelButtonLabel, onMouseDown, onCancelClick, testId, }: ButtonsProp) => jsx.JSX.Element;
 export default Buttons;

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

@@ -11,5 +11,14 @@ interface ButtonsProp {
     onCancelClick: (event: React.MouseEvent<HTMLElement>) => void;
     testId?: string;
 }
+/**
+ * __Buttons__
+ *
+ * A buttons {description}.
+ *
+ * - [Examples](https://atlassian.design/components/{packageName}/examples)
+ * - [Code](https://atlassian.design/components/{packageName}/code)
+ * - [Usage](https://atlassian.design/components/{packageName}/usage)
+ */
 declare const Buttons: ({ confirmButtonLabel, cancelButtonLabel, onMouseDown, onCancelClick, testId, }: ButtonsProp) => jsx.JSX.Element;
 export default Buttons;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/inline-edit",
-	"version": "13.7.1",
+	"version": "13.7.3",
 	"description": "An inline edit displays a custom input component that switches between reading and editing on the same page.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -25,10 +25,6 @@
 	"homepage": "https://atlassian.design/components/inline-edit/",
 	"atlassian": {
 		"team": "Design System Team",
-		"releaseModel": "continuous",
-		"productPushConsumption": [
-			"jira"
-		],
 		"website": {
 			"name": "Inline edit",
 			"category": "Components"
@@ -40,12 +36,13 @@
 		"@atlaskit/button": "^20.1.0",
 		"@atlaskit/codemod-utils": "^4.2.0",
 		"@atlaskit/form": "^10.5.0",
-		"@atlaskit/icon": "^22.15.0",
+		"@atlaskit/icon": "^22.18.0",
 		"@atlaskit/inline-dialog": "^15.0.0",
-		"@atlaskit/primitives": "^12.0.0",
+		"@atlaskit/platform-feature-flags": "^0.3.0",
+		"@atlaskit/primitives": "^12.2.0",
 		"@atlaskit/textfield": "^6.5.0",
 		"@atlaskit/theme": "^13.0.0",
-		"@atlaskit/tokens": "^1.59.0",
+		"@atlaskit/tokens": "^1.61.0",
 		"@atlaskit/visually-hidden": "^1.5.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1"
@@ -56,16 +53,17 @@
 	"devDependencies": {
 		"@af/accessibility-testing": "*",
 		"@af/integration-testing": "*",
-		"@atlaskit/datetime-picker": "^14.0.0",
+		"@atlaskit/datetime-picker": "^14.1.0",
 		"@atlaskit/docs": "*",
-		"@atlaskit/ds-lib": "^2.5.0",
+		"@atlaskit/ds-lib": "^2.6.0",
 		"@atlaskit/section-message": "^6.6.0",
-		"@atlaskit/select": "^17.15.0",
+		"@atlaskit/select": "^17.19.0",
 		"@atlaskit/ssr": "*",
-		"@atlaskit/tag": "^12.5.0",
-		"@atlaskit/tag-group": "^10.5.0",
+		"@atlaskit/tag": "^12.6.0",
+		"@atlaskit/tag-group": "^10.6.0",
 		"@atlaskit/textarea": "^5.6.0",
 		"@atlaskit/visual-regression": "*",
+		"@atlassian/feature-flags-test-utils": "*",
 		"@emotion/styled": "^11.0.0",
 		"@testing-library/dom": "^10.1.0",
 		"@testing-library/react": "^12.1.5",
@@ -106,5 +104,10 @@
 		"./inline-editable-textfield": "./src/entry-points/inline-editable-textfield.ts",
 		"./types": "./src/entry-points/types.ts",
 		".": "./src/index.ts"
+	},
+	"platform-feature-flags": {
+		"platform-design-system-inline-edit-reset-on-escape": {
+			"type": "boolean"
+		}
 	}
 }