@atlaskit/inline-edit 13.0.6 → 13.0.7

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/inline-edit
 
+## 13.0.7
+
+### Patch Changes
+
+- [#65569](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/65569) [`bd5d46cc5c52`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/bd5d46cc5c52) - Fixes an issue introduced by 12.3.5 that could lead to a page refresh in some cases when event bubbling caused the wrapping form to submit to the current page.
+
 ## 13.0.6
 
 ### Patch Changes

package/dist/cjs/inline-edit.js

@@ -27,7 +27,7 @@ var fieldStyles = (0, _react2.css)({
 var analyticsAttributes = {
   componentName: 'inlineEdit',
   packageName: "@atlaskit/inline-edit",
-  packageVersion: "13.0.6"
+  packageVersion: "13.0.7"
 };
 var noop = function noop() {};
 var InnerInlineEdit = function InnerInlineEdit(props) {
@@ -96,7 +96,7 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
     action: 'confirmed',
     analyticsData: analyticsContext
   }, analyticsAttributes));
-  var onCancelClick = (0, _react.useCallback)(function (event) {
+  var _onCancelClick = (0, _react.useCallback)(function (event) {
     event.preventDefault();
     onCancel();
   }, [onCancel]);
@@ -110,7 +110,7 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
   }, [doNotFocusOnEditButton]);
 
   /** If keepEditViewOpenOnBlur prop is set to false, will call confirmIfUnfocused() which
-   *  confirms the value, if the focus is not transferred to the action buttons
+   *  confirms the value, if the focus is not transferred to the action buttons.
    *
    *  When you're in `editing` state, the focus will be on the input field. And if you use keyboard
    *  to navigate to `submit` button, this function will be invoked. Then function `onEditViewWrapperFocus`
@@ -120,7 +120,7 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
    *  There are two paths here the function can be triggered:
    *
    *  - focus on input first, and then use keyboard to `submit`
-   *  - focus on input first, and then click anywhere else on the page (outside of edit view wrapper) to `submit` (auto save)
+   *  - focus on input first, and then click anywhere else on the page (outside of edit view wrapper) to `submit` (auto save).
    */
   var onEditViewWrapperBlur = (0, _react.useCallback)(function (isFieldInvalid, onSubmit, formRef) {
     if (!keepEditViewOpenOnBlur) {
@@ -131,13 +131,13 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
     }
   }, [keepEditViewOpenOnBlur, tryAutoSubmitWhenBlur]);
 
-  /** Gets called when focus is transferred to the editView, or action buttons
+  /** Gets called when focus is transferred to the editView, or action buttons.
    *
    * There are three paths here the function can be called:
    *
    * - when a user click the `editView`
    * - when a user use keyboard to tab into `editView`
-   * - when a user use keyboard to tab into `submit` when they were on input field
+   * - when a user use keyboard to tab into `submit` when they were on input field.
    */
   var onEditViewWrapperFocus = (0, _react.useCallback)(function () {
     wasFocusReceivedSinceLastBlurRef.current = true;
@@ -152,77 +152,77 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
       readView: readView
     });
   };
-  if (shouldBeEditing) {
-    return (0, _react2.jsx)(_Form.default, {
-      onSubmit: function onSubmit(data) {
-        return onConfirm(data.inlineEdit);
-      }
-    }, function (_ref) {
-      var _ref$formProps = _ref.formProps,
-        _onKeyDown = _ref$formProps.onKeyDown,
-        onSubmit = _ref$formProps.onSubmit,
-        formRef = _ref$formProps.ref;
-      return (0, _react2.jsx)("form", {
-        /**
-         * It is not normally acceptable to add key handlers to non-interactive elements
-         * as this is an accessibility anti-pattern. However, because this instance is
-         * to add support for keyboard functionality instead of creating an inaccessible
-         * custom element, we can add role="presentation" so that there is no negative
-         * impacts to assistive technologies.
-         */
-        role: "presentation",
-        onKeyDown: function onKeyDown(e) {
-          _onKeyDown(e);
-          if (e.key === 'Esc' || e.key === 'Escape') {
-            onCancel();
-          }
+  return (0, _react2.jsx)(_Form.default, {
+    onSubmit: function onSubmit(data) {
+      return onConfirm(data.inlineEdit);
+    }
+  }, function (_ref) {
+    var _ref$formProps = _ref.formProps,
+      _onKeyDown = _ref$formProps.onKeyDown,
+      onSubmit = _ref$formProps.onSubmit,
+      formRef = _ref$formProps.ref,
+      reset = _ref.reset;
+    return (0, _react2.jsx)("form", {
+      /**
+       * It is not normally acceptable to add key handlers to non-interactive elements
+       * as this is an accessibility anti-pattern. However, because this instance is
+       * to add support for keyboard functionality instead of creating an inaccessible
+       * custom element, we can add role="presentation" so that there is no negative
+       * impacts to assistive technologies.
+       */
+      role: "presentation",
+      onKeyDown: function onKeyDown(e) {
+        _onKeyDown(e);
+        if (e.key === 'Esc' || e.key === 'Escape') {
+          onCancel();
+        }
+      },
+      onSubmit: onSubmit,
+      ref: formRef
+    }, shouldBeEditing ? (0, _react2.jsx)(_Field.default, {
+      name: "inlineEdit",
+      label: label,
+      defaultValue: defaultValue,
+      validate: validate,
+      isRequired: isRequired,
+      key: "edit-view" // used for reset to default value
+    }, function (_ref2) {
+      var fieldProps = _ref2.fieldProps,
+        error = _ref2.error;
+      return (0, _react2.jsx)("div", {
+        css: fieldStyles,
+        onBlur: function onBlur() {
+          onEditViewWrapperBlur(fieldProps.isInvalid, onSubmit, formRef);
+        },
+        onFocus: onEditViewWrapperFocus
+      }, editView(_objectSpread(_objectSpread({}, fieldProps), {}, {
+        errorMessage: error
+      }), editViewRef), !hideActionButtons ? (0, _react2.jsx)(_buttons.default, {
+        cancelButtonLabel: cancelButtonLabel,
+        confirmButtonLabel: confirmButtonLabel,
+        onMouseDown: function onMouseDown() {
+          /** Prevents focus on edit button only if mouse is used to click button, but not when keyboard is used */
+          doNotFocusOnEditButton();
         },
-        onSubmit: onSubmit,
-        ref: formRef
-      }, (0, _react2.jsx)(_Field.default, {
-        name: "inlineEdit",
-        label: label,
-        defaultValue: defaultValue,
-        validate: validate,
-        isRequired: isRequired,
-        key: "edit-view" // used for reset to default value
-      }, function (_ref2) {
-        var fieldProps = _ref2.fieldProps,
-          error = _ref2.error;
-        return (0, _react2.jsx)("div", {
-          css: fieldStyles,
-          onBlur: function onBlur() {
-            onEditViewWrapperBlur(fieldProps.isInvalid, onSubmit, formRef);
-          },
-          onFocus: onEditViewWrapperFocus
-        }, editView(_objectSpread(_objectSpread({}, fieldProps), {}, {
-          errorMessage: error
-        }), editViewRef), !hideActionButtons ? (0, _react2.jsx)(_buttons.default, {
-          cancelButtonLabel: cancelButtonLabel,
-          confirmButtonLabel: confirmButtonLabel,
-          onMouseDown: function onMouseDown() {
-            /** Prevents focus on edit button only if mouse is used to click button, but not when keyboard is used */
-            doNotFocusOnEditButton();
-          },
-          onCancelClick: onCancelClick
-        }) : /** This is to allow Ctrl + Enter to submit without action buttons */
-        (0, _react2.jsx)("button", {
-          hidden: true,
-          type: "submit",
-          "aria-label": "Submit"
-        }));
+        onCancelClick: function onCancelClick(e) {
+          reset();
+          _onCancelClick(e);
+        }
+      }) : /** This is to allow Ctrl + Enter to submit without action buttons */
+      (0, _react2.jsx)("button", {
+        hidden: true,
+        type: "submit",
+        "aria-label": "Submit"
       }));
-    });
-  }
-  return (/** Form, Field are used here only for the label and spacing */
-    (0, _react2.jsx)("form", null, (0, _react2.jsx)(_Field.default, {
+    }) : /** Field is used here only for the label and spacing */
+    (0, _react2.jsx)(_Field.default, {
       name: "inlineEdit",
       label: label,
       defaultValue: "",
       isRequired: isRequired,
       key: "read-view" // used for reset to default value
-    }, renderReadView))
-  );
+    }, renderReadView));
+  });
 };
 var InlineEdit = function InlineEdit(props) {
   return (0, _react2.jsx)(InnerInlineEdit, props);

package/dist/es2019/inline-edit.js

@@ -14,7 +14,7 @@ const fieldStyles = css({
 const analyticsAttributes = {
   componentName: 'inlineEdit',
   packageName: "@atlaskit/inline-edit",
-  packageVersion: "13.0.6"
+  packageVersion: "13.0.7"
 };
 const noop = () => {};
 const InnerInlineEdit = props => {
@@ -88,7 +88,7 @@ const InnerInlineEdit = props => {
   }, [doNotFocusOnEditButton]);
 
   /** If keepEditViewOpenOnBlur prop is set to false, will call confirmIfUnfocused() which
-   *  confirms the value, if the focus is not transferred to the action buttons
+   *  confirms the value, if the focus is not transferred to the action buttons.
    *
    *  When you're in `editing` state, the focus will be on the input field. And if you use keyboard
    *  to navigate to `submit` button, this function will be invoked. Then function `onEditViewWrapperFocus`
@@ -98,7 +98,7 @@ const InnerInlineEdit = props => {
    *  There are two paths here the function can be triggered:
    *
    *  - focus on input first, and then use keyboard to `submit`
-   *  - focus on input first, and then click anywhere else on the page (outside of edit view wrapper) to `submit` (auto save)
+   *  - focus on input first, and then click anywhere else on the page (outside of edit view wrapper) to `submit` (auto save).
    */
   const onEditViewWrapperBlur = useCallback((isFieldInvalid, onSubmit, formRef) => {
     if (!keepEditViewOpenOnBlur) {
@@ -107,13 +107,13 @@ const InnerInlineEdit = props => {
     }
   }, [keepEditViewOpenOnBlur, tryAutoSubmitWhenBlur]);
 
-  /** Gets called when focus is transferred to the editView, or action buttons
+  /** Gets called when focus is transferred to the editView, or action buttons.
    *
    * There are three paths here the function can be called:
    *
    * - when a user click the `editView`
    * - when a user use keyboard to tab into `editView`
-   * - when a user use keyboard to tab into `submit` when they were on input field
+   * - when a user use keyboard to tab into `submit` when they were on input field.
    */
   const onEditViewWrapperFocus = useCallback(() => {
     wasFocusReceivedSinceLastBlurRef.current = true;
@@ -128,75 +128,75 @@ const InnerInlineEdit = props => {
       readView: readView
     });
   };
-  if (shouldBeEditing) {
-    return jsx(Form, {
-      onSubmit: data => onConfirm(data.inlineEdit)
-    }, ({
-      formProps: {
-        onKeyDown,
-        onSubmit,
-        ref: formRef
-      }
-    }) => jsx("form", {
-      /**
-       * It is not normally acceptable to add key handlers to non-interactive elements
-       * as this is an accessibility anti-pattern. However, because this instance is
-       * to add support for keyboard functionality instead of creating an inaccessible
-       * custom element, we can add role="presentation" so that there is no negative
-       * impacts to assistive technologies.
-       */
-      role: "presentation",
-      onKeyDown: e => {
-        onKeyDown(e);
-        if (e.key === 'Esc' || e.key === 'Escape') {
-          onCancel();
-        }
-      },
-      onSubmit: onSubmit,
+  return jsx(Form, {
+    onSubmit: data => onConfirm(data.inlineEdit)
+  }, ({
+    formProps: {
+      onKeyDown,
+      onSubmit,
       ref: formRef
-    }, jsx(Field, {
-      name: "inlineEdit",
-      label: label,
-      defaultValue: defaultValue,
-      validate: validate,
-      isRequired: isRequired,
-      key: "edit-view" // used for reset to default value
-    }, ({
-      fieldProps,
-      error
-    }) => jsx("div", {
-      css: fieldStyles,
-      onBlur: () => {
-        onEditViewWrapperBlur(fieldProps.isInvalid, onSubmit, formRef);
-      },
-      onFocus: onEditViewWrapperFocus
-    }, editView({
-      ...fieldProps,
-      errorMessage: error
-    }, editViewRef), !hideActionButtons ? jsx(Buttons, {
-      cancelButtonLabel: cancelButtonLabel,
-      confirmButtonLabel: confirmButtonLabel,
-      onMouseDown: () => {
-        /** Prevents focus on edit button only if mouse is used to click button, but not when keyboard is used */
-        doNotFocusOnEditButton();
-      },
-      onCancelClick: onCancelClick
-    }) : /** This is to allow Ctrl + Enter to submit without action buttons */
-    jsx("button", {
-      hidden: true,
-      type: "submit",
-      "aria-label": "Submit"
-    })))));
-  }
-  return (/** Form, Field are used here only for the label and spacing */
-    jsx("form", null, jsx(Field, {
-      name: "inlineEdit",
-      label: label,
-      defaultValue: "",
-      isRequired: isRequired,
-      key: "read-view" // used for reset to default value
-    }, renderReadView))
-  );
+    },
+    reset
+  }) => jsx("form", {
+    /**
+     * It is not normally acceptable to add key handlers to non-interactive elements
+     * as this is an accessibility anti-pattern. However, because this instance is
+     * to add support for keyboard functionality instead of creating an inaccessible
+     * custom element, we can add role="presentation" so that there is no negative
+     * impacts to assistive technologies.
+     */
+    role: "presentation",
+    onKeyDown: e => {
+      onKeyDown(e);
+      if (e.key === 'Esc' || e.key === 'Escape') {
+        onCancel();
+      }
+    },
+    onSubmit: onSubmit,
+    ref: formRef
+  }, shouldBeEditing ? jsx(Field, {
+    name: "inlineEdit",
+    label: label,
+    defaultValue: defaultValue,
+    validate: validate,
+    isRequired: isRequired,
+    key: "edit-view" // used for reset to default value
+  }, ({
+    fieldProps,
+    error
+  }) => jsx("div", {
+    css: fieldStyles,
+    onBlur: () => {
+      onEditViewWrapperBlur(fieldProps.isInvalid, onSubmit, formRef);
+    },
+    onFocus: onEditViewWrapperFocus
+  }, editView({
+    ...fieldProps,
+    errorMessage: error
+  }, editViewRef), !hideActionButtons ? jsx(Buttons, {
+    cancelButtonLabel: cancelButtonLabel,
+    confirmButtonLabel: confirmButtonLabel,
+    onMouseDown: () => {
+      /** Prevents focus on edit button only if mouse is used to click button, but not when keyboard is used */
+      doNotFocusOnEditButton();
+    },
+    onCancelClick: e => {
+      reset();
+      onCancelClick(e);
+    }
+  }) : /** This is to allow Ctrl + Enter to submit without action buttons */
+  jsx("button", {
+    hidden: true,
+    type: "submit",
+    "aria-label": "Submit"
+  }))) : /** Field is used here only for the label and spacing */
+  jsx(Field, {
+    name: "inlineEdit",
+    label: label,
+    defaultValue: "",
+    isRequired: isRequired,
+    key: "read-view" // used for reset to default value
+  }, renderReadView)));
 };
 const InlineEdit = props => {
   return jsx(InnerInlineEdit, props);

package/dist/esm/inline-edit.js

@@ -18,7 +18,7 @@ var fieldStyles = css({
 var analyticsAttributes = {
   componentName: 'inlineEdit',
   packageName: "@atlaskit/inline-edit",
-  packageVersion: "13.0.6"
+  packageVersion: "13.0.7"
 };
 var noop = function noop() {};
 var InnerInlineEdit = function InnerInlineEdit(props) {
@@ -87,7 +87,7 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
     action: 'confirmed',
     analyticsData: analyticsContext
   }, analyticsAttributes));
-  var onCancelClick = useCallback(function (event) {
+  var _onCancelClick = useCallback(function (event) {
     event.preventDefault();
     onCancel();
   }, [onCancel]);
@@ -101,7 +101,7 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
   }, [doNotFocusOnEditButton]);
 
   /** If keepEditViewOpenOnBlur prop is set to false, will call confirmIfUnfocused() which
-   *  confirms the value, if the focus is not transferred to the action buttons
+   *  confirms the value, if the focus is not transferred to the action buttons.
    *
    *  When you're in `editing` state, the focus will be on the input field. And if you use keyboard
    *  to navigate to `submit` button, this function will be invoked. Then function `onEditViewWrapperFocus`
@@ -111,7 +111,7 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
    *  There are two paths here the function can be triggered:
    *
    *  - focus on input first, and then use keyboard to `submit`
-   *  - focus on input first, and then click anywhere else on the page (outside of edit view wrapper) to `submit` (auto save)
+   *  - focus on input first, and then click anywhere else on the page (outside of edit view wrapper) to `submit` (auto save).
    */
   var onEditViewWrapperBlur = useCallback(function (isFieldInvalid, onSubmit, formRef) {
     if (!keepEditViewOpenOnBlur) {
@@ -122,13 +122,13 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
     }
   }, [keepEditViewOpenOnBlur, tryAutoSubmitWhenBlur]);
 
-  /** Gets called when focus is transferred to the editView, or action buttons
+  /** Gets called when focus is transferred to the editView, or action buttons.
    *
    * There are three paths here the function can be called:
    *
    * - when a user click the `editView`
    * - when a user use keyboard to tab into `editView`
-   * - when a user use keyboard to tab into `submit` when they were on input field
+   * - when a user use keyboard to tab into `submit` when they were on input field.
    */
   var onEditViewWrapperFocus = useCallback(function () {
     wasFocusReceivedSinceLastBlurRef.current = true;
@@ -143,77 +143,77 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
       readView: readView
     });
   };
-  if (shouldBeEditing) {
-    return jsx(Form, {
-      onSubmit: function onSubmit(data) {
-        return onConfirm(data.inlineEdit);
-      }
-    }, function (_ref) {
-      var _ref$formProps = _ref.formProps,
-        _onKeyDown = _ref$formProps.onKeyDown,
-        onSubmit = _ref$formProps.onSubmit,
-        formRef = _ref$formProps.ref;
-      return jsx("form", {
-        /**
-         * It is not normally acceptable to add key handlers to non-interactive elements
-         * as this is an accessibility anti-pattern. However, because this instance is
-         * to add support for keyboard functionality instead of creating an inaccessible
-         * custom element, we can add role="presentation" so that there is no negative
-         * impacts to assistive technologies.
-         */
-        role: "presentation",
-        onKeyDown: function onKeyDown(e) {
-          _onKeyDown(e);
-          if (e.key === 'Esc' || e.key === 'Escape') {
-            onCancel();
-          }
+  return jsx(Form, {
+    onSubmit: function onSubmit(data) {
+      return onConfirm(data.inlineEdit);
+    }
+  }, function (_ref) {
+    var _ref$formProps = _ref.formProps,
+      _onKeyDown = _ref$formProps.onKeyDown,
+      onSubmit = _ref$formProps.onSubmit,
+      formRef = _ref$formProps.ref,
+      reset = _ref.reset;
+    return jsx("form", {
+      /**
+       * It is not normally acceptable to add key handlers to non-interactive elements
+       * as this is an accessibility anti-pattern. However, because this instance is
+       * to add support for keyboard functionality instead of creating an inaccessible
+       * custom element, we can add role="presentation" so that there is no negative
+       * impacts to assistive technologies.
+       */
+      role: "presentation",
+      onKeyDown: function onKeyDown(e) {
+        _onKeyDown(e);
+        if (e.key === 'Esc' || e.key === 'Escape') {
+          onCancel();
+        }
+      },
+      onSubmit: onSubmit,
+      ref: formRef
+    }, shouldBeEditing ? jsx(Field, {
+      name: "inlineEdit",
+      label: label,
+      defaultValue: defaultValue,
+      validate: validate,
+      isRequired: isRequired,
+      key: "edit-view" // used for reset to default value
+    }, function (_ref2) {
+      var fieldProps = _ref2.fieldProps,
+        error = _ref2.error;
+      return jsx("div", {
+        css: fieldStyles,
+        onBlur: function onBlur() {
+          onEditViewWrapperBlur(fieldProps.isInvalid, onSubmit, formRef);
+        },
+        onFocus: onEditViewWrapperFocus
+      }, editView(_objectSpread(_objectSpread({}, fieldProps), {}, {
+        errorMessage: error
+      }), editViewRef), !hideActionButtons ? jsx(Buttons, {
+        cancelButtonLabel: cancelButtonLabel,
+        confirmButtonLabel: confirmButtonLabel,
+        onMouseDown: function onMouseDown() {
+          /** Prevents focus on edit button only if mouse is used to click button, but not when keyboard is used */
+          doNotFocusOnEditButton();
         },
-        onSubmit: onSubmit,
-        ref: formRef
-      }, jsx(Field, {
-        name: "inlineEdit",
-        label: label,
-        defaultValue: defaultValue,
-        validate: validate,
-        isRequired: isRequired,
-        key: "edit-view" // used for reset to default value
-      }, function (_ref2) {
-        var fieldProps = _ref2.fieldProps,
-          error = _ref2.error;
-        return jsx("div", {
-          css: fieldStyles,
-          onBlur: function onBlur() {
-            onEditViewWrapperBlur(fieldProps.isInvalid, onSubmit, formRef);
-          },
-          onFocus: onEditViewWrapperFocus
-        }, editView(_objectSpread(_objectSpread({}, fieldProps), {}, {
-          errorMessage: error
-        }), editViewRef), !hideActionButtons ? jsx(Buttons, {
-          cancelButtonLabel: cancelButtonLabel,
-          confirmButtonLabel: confirmButtonLabel,
-          onMouseDown: function onMouseDown() {
-            /** Prevents focus on edit button only if mouse is used to click button, but not when keyboard is used */
-            doNotFocusOnEditButton();
-          },
-          onCancelClick: onCancelClick
-        }) : /** This is to allow Ctrl + Enter to submit without action buttons */
-        jsx("button", {
-          hidden: true,
-          type: "submit",
-          "aria-label": "Submit"
-        }));
+        onCancelClick: function onCancelClick(e) {
+          reset();
+          _onCancelClick(e);
+        }
+      }) : /** This is to allow Ctrl + Enter to submit without action buttons */
+      jsx("button", {
+        hidden: true,
+        type: "submit",
+        "aria-label": "Submit"
       }));
-    });
-  }
-  return (/** Form, Field are used here only for the label and spacing */
-    jsx("form", null, jsx(Field, {
+    }) : /** Field is used here only for the label and spacing */
+    jsx(Field, {
       name: "inlineEdit",
       label: label,
       defaultValue: "",
       isRequired: isRequired,
       key: "read-view" // used for reset to default value
-    }, renderReadView))
-  );
+    }, renderReadView));
+  });
 };
 var InlineEdit = function InlineEdit(props) {
   return jsx(InnerInlineEdit, props);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/inline-edit",
-  "version": "13.0.6",
+  "version": "13.0.7",
   "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/"
@@ -35,15 +35,15 @@
     }
   },
   "dependencies": {
-    "@atlaskit/analytics-next": "^9.1.0",
-    "@atlaskit/button": "^17.2.0",
+    "@atlaskit/analytics-next": "^9.2.0",
+    "@atlaskit/button": "^17.3.0",
     "@atlaskit/codemod-utils": "^4.2.0",
     "@atlaskit/form": "^9.0.3",
     "@atlaskit/icon": "^22.0.0",
     "@atlaskit/inline-dialog": "^14.0.0",
     "@atlaskit/textfield": "^6.0.0",
     "@atlaskit/theme": "^12.6.0",
-    "@atlaskit/tokens": "^1.35.0",
+    "@atlaskit/tokens": "^1.36.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1"
   },