@atlaskit/inline-edit 15.3.19 → 15.3.20

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @atlaskit/inline-edit
 
+## 15.3.20
+
+### Patch Changes
+
+- [`651910f627978`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/651910f627978) -
+  fixing focus issue on restoring team
+
 ## 15.3.19
 
 ### Patch Changes

package/dist/cjs/inline-edit.js

@@ -9,6 +9,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 require("./inline-edit.compiled.css");
 var _runtime = require("@compiled/react/runtime");
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
@@ -178,14 +179,14 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
       onSubmit = _ref$formProps.onSubmit,
       formRef = _ref$formProps.ref,
       reset = _ref.reset;
-    return /*#__PURE__*/_react.default.createElement("form", {
+    return /*#__PURE__*/_react.default.createElement("form", (0, _extends2.default)({
       /**
        * 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);
@@ -193,7 +194,13 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
           reset();
           onCancel();
         }
-      },
+      }
+      // Added to since field was getting focused automatically when team is restored from the banner
+      // There seems to be a fix applied below via class but it appears to be not working in our case
+      /* eslint-disable-next-line @atlassian/a11y/no-noninteractive-tabindex */
+    }, (0, _platformFeatureFlags.fg)('enable-inline-edit-focus-fix') ? {
+      tabIndex: 0
+    } : {}, {
       onSubmit: onSubmit,
       ref: formRef
       // Below we have added a class name to the form element to prevent the default focus on the form element
@@ -202,7 +209,7 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
       ,
       className: (0, _platformFeatureFlags.fg)('platform_design_system_inline_edit_dont_focus') ? 'dont-default-focus' : undefined
-    }, shouldBeEditing ? /*#__PURE__*/_react.default.createElement(_Field.default, {
+    }), shouldBeEditing ? /*#__PURE__*/_react.default.createElement(_Field.default, {
       name: "inlineEdit",
       label: label,
       defaultValue: defaultValue,

package/dist/es2019/inline-edit.js

@@ -1,4 +1,5 @@
 /* inline-edit.tsx generated by @compiled/babel-plugin v0.38.1 */
+import _extends from "@babel/runtime/helpers/extends";
 import "./inline-edit.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { useCallback, useRef, useState } from 'react';
@@ -154,14 +155,14 @@ const InnerInlineEdit = props => {
       ref: formRef
     },
     reset
-  }) => /*#__PURE__*/React.createElement("form", {
+  }) => /*#__PURE__*/React.createElement("form", _extends({
     /**
      * 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);
@@ -169,7 +170,13 @@ const InnerInlineEdit = props => {
         reset();
         onCancel();
       }
-    },
+    }
+    // Added to since field was getting focused automatically when team is restored from the banner
+    // There seems to be a fix applied below via class but it appears to be not working in our case
+    /* eslint-disable-next-line @atlassian/a11y/no-noninteractive-tabindex */
+  }, fg('enable-inline-edit-focus-fix') ? {
+    tabIndex: 0
+  } : {}, {
     onSubmit: onSubmit,
     ref: formRef
     // Below we have added a class name to the form element to prevent the default focus on the form element
@@ -178,7 +185,7 @@ const InnerInlineEdit = props => {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
     ,
     className: fg('platform_design_system_inline_edit_dont_focus') ? 'dont-default-focus' : undefined
-  }, shouldBeEditing ? /*#__PURE__*/React.createElement(Field, {
+  }), shouldBeEditing ? /*#__PURE__*/React.createElement(Field, {
     name: "inlineEdit",
     label: label,
     defaultValue: defaultValue,

package/dist/esm/inline-edit.js

@@ -1,4 +1,5 @@
 /* inline-edit.tsx generated by @compiled/babel-plugin v0.38.1 */
+import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import "./inline-edit.compiled.css";
@@ -169,14 +170,14 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
       onSubmit = _ref$formProps.onSubmit,
       formRef = _ref$formProps.ref,
       reset = _ref.reset;
-    return /*#__PURE__*/React.createElement("form", {
+    return /*#__PURE__*/React.createElement("form", _extends({
       /**
        * 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);
@@ -184,7 +185,13 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
           reset();
           onCancel();
         }
-      },
+      }
+      // Added to since field was getting focused automatically when team is restored from the banner
+      // There seems to be a fix applied below via class but it appears to be not working in our case
+      /* eslint-disable-next-line @atlassian/a11y/no-noninteractive-tabindex */
+    }, fg('enable-inline-edit-focus-fix') ? {
+      tabIndex: 0
+    } : {}, {
       onSubmit: onSubmit,
       ref: formRef
       // Below we have added a class name to the form element to prevent the default focus on the form element
@@ -193,7 +200,7 @@ var InnerInlineEdit = function InnerInlineEdit(props) {
       // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop
       ,
       className: fg('platform_design_system_inline_edit_dont_focus') ? 'dont-default-focus' : undefined
-    }, shouldBeEditing ? /*#__PURE__*/React.createElement(Field, {
+    }), shouldBeEditing ? /*#__PURE__*/React.createElement(Field, {
       name: "inlineEdit",
       label: label,
       defaultValue: defaultValue,

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/inline-edit",
-	"version": "15.3.19",
+	"version": "15.3.20",
 	"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,16 +35,15 @@
 	"dependencies": {
 		"@atlaskit/analytics-next": "^11.1.0",
 		"@atlaskit/button": "^23.6.0",
-		"@atlaskit/codemod-utils": "^4.2.0",
 		"@atlaskit/css": "^0.17.0",
 		"@atlaskit/form": "^14.3.0",
 		"@atlaskit/icon": "^29.0.0",
 		"@atlaskit/inline-dialog": "^18.0.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/primitives": "^16.3.0",
+		"@atlaskit/primitives": "^16.4.0",
 		"@atlaskit/textfield": "^8.1.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tokens": "^8.3.0",
+		"@atlaskit/tokens": "^8.4.0",
 		"@atlaskit/visually-hidden": "^3.0.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^0.18.6"
@@ -57,7 +56,6 @@
 		"@af/integration-testing": "workspace:^",
 		"@atlaskit/datetime-picker": "^17.1.0",
 		"@atlaskit/docs": "^11.2.0",
-		"@atlaskit/ds-lib": "^5.3.0",
 		"@atlaskit/heading": "^5.2.0",
 		"@atlaskit/link": "^3.2.0",
 		"@atlaskit/section-message": "^8.9.0",
@@ -65,7 +63,6 @@
 		"@atlaskit/tag": "^14.1.0",
 		"@atlaskit/tag-group": "^12.0.0",
 		"@atlaskit/textarea": "^8.1.0",
-		"@atlassian/feature-flags-test-utils": "^1.0.0",
 		"@atlassian/ssr-tests": "workspace:^",
 		"@testing-library/react": "^13.4.0",
 		"react-dom": "^18.2.0",
@@ -98,6 +95,9 @@
 	"platform-feature-flags": {
 		"platform_design_system_inline_edit_dont_focus": {
 			"type": "boolean"
+		},
+		"enable-inline-edit-focus-fix": {
+			"type": "boolean"
 		}
 	}
 }