@atlaskit/reactions 33.5.0 → 33.6.0

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @atlaskit/reactions
 
+## 33.6.0
+
+### Minor Changes
+
+- [`e120a04be28c8`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e120a04be28c8) -
+  [ux] Return focus to add reactions button after selecting emoji
+
 ## 33.5.0
 
 ### Minor Changes

package/dist/cjs/analytics/index.js

@@ -11,7 +11,7 @@ var _analyticsGasTypes = require("@atlaskit/analytics-gas-types");
 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 packageName = "@atlaskit/reactions";
-var packageVersion = "0.0.0-development";
+var packageVersion = "33.5.0";
 /**
  * TODO: move to utility package?
  * A random sampling function

package/dist/cjs/components/ReactionPicker.js

@@ -209,7 +209,14 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
     }
     onSelection(item.id, settings.showFullPicker || hoverableReactionPicker && isHoverableReactionPickerEmojiPickerOpen ? 'emojiPicker' : 'quickSelector');
     close(item.id);
-  }, [close, onSelection, settings.showFullPicker, hoverableReactionPicker, isHoverableReactionPickerEmojiPickerOpen]);
+    if ((0, _platformFeatureFlags.fg)('platform_emoji_picker_focus_on_button')) {
+      // After selecting an emoji, we would like focus to be returned to the trigger button
+      // This is for the purposes of navigation for keyboard users
+      requestAnimationFrame(function () {
+        return triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.focus();
+      });
+    }
+  }, [close, onSelection, settings.showFullPicker, hoverableReactionPicker, isHoverableReactionPickerEmojiPickerOpen, triggerRef]);
 
   /**
    * Event handler when the emoji icon to open the custom picker is selected

package/dist/es2019/analytics/index.js

@@ -1,7 +1,7 @@
 import { createAndFireEvent } from '@atlaskit/analytics-next';
 import { UI_EVENT_TYPE, OPERATIONAL_EVENT_TYPE } from '@atlaskit/analytics-gas-types';
 const packageName = "@atlaskit/reactions";
-const packageVersion = "0.0.0-development";
+const packageVersion = "33.5.0";
 /**
  * TODO: move to utility package?
  * A random sampling function

package/dist/es2019/components/ReactionPicker.js

@@ -167,7 +167,12 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
     }
     onSelection(item.id, settings.showFullPicker || hoverableReactionPicker && isHoverableReactionPickerEmojiPickerOpen ? 'emojiPicker' : 'quickSelector');
     close(item.id);
-  }, [close, onSelection, settings.showFullPicker, hoverableReactionPicker, isHoverableReactionPickerEmojiPickerOpen]);
+    if (fg('platform_emoji_picker_focus_on_button')) {
+      // After selecting an emoji, we would like focus to be returned to the trigger button
+      // This is for the purposes of navigation for keyboard users
+      requestAnimationFrame(() => triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.focus());
+    }
+  }, [close, onSelection, settings.showFullPicker, hoverableReactionPicker, isHoverableReactionPickerEmojiPickerOpen, triggerRef]);
 
   /**
    * Event handler when the emoji icon to open the custom picker is selected

package/dist/esm/analytics/index.js

@@ -4,7 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { createAndFireEvent } from '@atlaskit/analytics-next';
 import { UI_EVENT_TYPE, OPERATIONAL_EVENT_TYPE } from '@atlaskit/analytics-gas-types';
 var packageName = "@atlaskit/reactions";
-var packageVersion = "0.0.0-development";
+var packageVersion = "33.5.0";
 /**
  * TODO: move to utility package?
  * A random sampling function

package/dist/esm/components/ReactionPicker.js

@@ -200,7 +200,14 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
     }
     onSelection(item.id, settings.showFullPicker || hoverableReactionPicker && isHoverableReactionPickerEmojiPickerOpen ? 'emojiPicker' : 'quickSelector');
     close(item.id);
-  }, [close, onSelection, settings.showFullPicker, hoverableReactionPicker, isHoverableReactionPickerEmojiPickerOpen]);
+    if (fg('platform_emoji_picker_focus_on_button')) {
+      // After selecting an emoji, we would like focus to be returned to the trigger button
+      // This is for the purposes of navigation for keyboard users
+      requestAnimationFrame(function () {
+        return triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.focus();
+      });
+    }
+  }, [close, onSelection, settings.showFullPicker, hoverableReactionPicker, isHoverableReactionPickerEmojiPickerOpen, triggerRef]);
 
   /**
    * Event handler when the emoji icon to open the custom picker is selected

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/reactions",
-	"version": "33.5.0",
+	"version": "33.6.0",
 	"description": "Reactions component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -115,6 +115,9 @@
 		"start:edge": "cd ../../ && PROXY_TARGET_ENV=edge yarn start:webpack reactions --proxy ./packages/elements/reactions/proxy.ts"
 	},
 	"platform-feature-flags": {
+		"platform_emoji_picker_focus_on_button": {
+			"type": "boolean"
+		},
 		"platform-component-visual-refresh": {
 			"type": "boolean"
 		},