@atlaskit/reactions 33.2.9 → 33.2.11

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/reactions
 
+## 33.2.11
+
+### Patch Changes
+
+- [`f36f3f788a497`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f36f3f788a497) -
+  increase portal z-index value for reactions picker
+- Updated dependencies
+
+## 33.2.10
+
+### Patch Changes
+
+- [#197800](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/197800)
+  [`af8a1e4a36047`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/af8a1e4a36047) -
+  Revert platform_editor_reactions_picker_fix FG clean up
+- Updated dependencies
+
 ## 33.2.9
 
 ### Patch Changes

package/MockReactionsClient/package.json

@@ -8,7 +8,7 @@
   ],
   "types": "../dist/types/MockReactionsClient.d.ts",
   "typesVersions": {
-    ">=4.5 <5.4": {
+    ">=4.5 <5.9": {
       "*": [
         "../dist/types-ts4.5/MockReactionsClient.d.ts"
       ]

package/afm-cc/tsconfig.json

@@ -62,6 +62,9 @@
 		{
 			"path": "../../../platform/feature-flags/afm-cc/tsconfig.json"
 		},
+		{
+			"path": "../../../platform/feature-flags-react/afm-cc/tsconfig.json"
+		},
 		{
 			"path": "../../../design-system/popper/afm-cc/tsconfig.json"
 		},

package/afm-jira/tsconfig.json

@@ -62,6 +62,9 @@
 		{
 			"path": "../../../platform/feature-flags/afm-jira/tsconfig.json"
 		},
+		{
+			"path": "../../../platform/feature-flags-react/afm-jira/tsconfig.json"
+		},
 		{
 			"path": "../../../design-system/popper/afm-jira/tsconfig.json"
 		},

package/afm-passionfruit/tsconfig.json

@@ -0,0 +1,105 @@
+{
+	"extends": "../../../../tsconfig.entry-points.passionfruit.json",
+	"compilerOptions": {
+		"declaration": true,
+		"target": "es5",
+		"outDir": "../../../../../passionfruit/tsDist/@atlaskit__reactions/app",
+		"rootDir": "../",
+		"composite": true
+	},
+	"include": [
+		"../src/**/*.ts",
+		"../src/**/*.tsx"
+	],
+	"exclude": [
+		"../src/**/__tests__/*",
+		"../src/**/*.test.*",
+		"../src/**/test.*",
+		"../src/**/examples.*",
+		"../src/**/examples/*",
+		"../src/**/examples/**/*",
+		"../src/**/*.stories.*",
+		"../src/**/stories/*",
+		"../src/**/stories/**/*"
+	],
+	"references": [
+		{
+			"path": "../../../analytics/analytics-gas-types/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../analytics/analytics-namespaced-context/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../analytics/analytics-next/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/avatar/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/button/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/css/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../emoji/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/heading/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/icon/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/link/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/modal-dialog/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/motion/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../platform/feature-flags/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../platform/feature-flags-react/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/popper/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/popup/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/portal/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/primitives/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../react-ufo/atlaskit/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/spinner/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/tabs/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/theme/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/tokens/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../design-system/tooltip/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../../data/ufo-external/afm-passionfruit/tsconfig.json"
+		},
+		{
+			"path": "../../util-service-support/afm-passionfruit/tsconfig.json"
+		}
+	]
+}

package/afm-post-office/tsconfig.json

@@ -62,6 +62,9 @@
 		{
 			"path": "../../../platform/feature-flags/afm-post-office/tsconfig.json"
 		},
+		{
+			"path": "../../../platform/feature-flags-react/afm-post-office/tsconfig.json"
+		},
 		{
 			"path": "../../../design-system/popper/afm-post-office/tsconfig.json"
 		},

package/afm-townsquare/tsconfig.json

@@ -62,6 +62,9 @@
 		{
 			"path": "../../../platform/feature-flags/afm-townsquare/tsconfig.json"
 		},
+		{
+			"path": "../../../platform/feature-flags-react/afm-townsquare/tsconfig.json"
+		},
 		{
 			"path": "../../../design-system/popper/afm-townsquare/tsconfig.json"
 		},

package/afm-volt/tsconfig.json

@@ -14,7 +14,13 @@
 	"exclude": [
 		"../src/**/__tests__/*",
 		"../src/**/*.test.*",
-		"../src/**/test.*"
+		"../src/**/test.*",
+		"../src/**/examples.*",
+		"../src/**/examples/*",
+		"../src/**/examples/**/*",
+		"../src/**/*.stories.*",
+		"../src/**/stories/*",
+		"../src/**/stories/**/*"
 	],
 	"references": [
 		{

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 = "33.2.8";
+var packageVersion = "33.2.10";
 /**
  * TODO: move to utility package?
  * A random sampling function

package/dist/cjs/components/ReactionPicker.js

@@ -27,7 +27,6 @@ var _Selector = require("./Selector");
 var _Trigger = require("./Trigger");
 var _RepositionOnUpdate = require("./RepositionOnUpdate");
 var _colors = require("@atlaskit/theme/colors");
-var _portal = _interopRequireDefault(require("@atlaskit/portal"));
 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); }
 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; }
@@ -157,6 +156,19 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
     settings = _useState10[0],
     setSettings = _useState10[1];
 
+  /**
+   * Custom hook triggers when user clicks outside the reactions picker
+   */
+  (0, _useCloseManager.useCloseManager)(wrapperRef, function (callbackType) {
+    close();
+    onCancel();
+    if (triggerRef && callbackType === 'ESCAPE') {
+      requestAnimationFrame(function () {
+        return triggerRef.focus();
+      });
+    }
+  }, true, isPopupTrayOpen);
+
   /**
    * Event callback when the picker is closed
    * @param _id Optional id if an emoji button was selected or undefineed if was clicked outside the picker
@@ -275,10 +287,6 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
     var _updatePopper$current;
     (_updatePopper$current = updatePopper.current) === null || _updatePopper$current === void 0 || _updatePopper$current.call(updatePopper);
   }, [settings]);
-  var onClose = function onClose() {
-    close();
-    onCancel();
-  };
   return /*#__PURE__*/_react.default.createElement("div", {
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
     className: (0, _runtime.ax)(["_s7n4nkob _1pra1o8l", wrapperClassName]),
@@ -320,14 +328,9 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
         isListItem: isListItem
       }))
     );
-  }), isPopupTrayOpen && /*#__PURE__*/_react.default.createElement(_portal.default, {
-    zIndex: _constants.layers.layer()
-  }, /*#__PURE__*/_react.default.createElement(PopperWrapper, {
+  }), isPopupTrayOpen && /*#__PURE__*/_react.default.createElement(PopperWrapper, {
     settings: settings,
-    popperModifiers: popperModifiers,
-    isOpen: isPopupTrayOpen,
-    onClose: onClose,
-    triggerRef: triggerRef
+    popperModifiers: popperModifiers
   }, settings.showFullPicker || hoverableReactionPicker && isHoverableReactionPickerEmojiPickerOpen ? /*#__PURE__*/_react.default.createElement(_picker.EmojiPicker, {
     emojiProvider: emojiProvider,
     onSelection: onEmojiSelected,
@@ -343,13 +346,10 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
     onMoreClick: onSelectMoreClick,
     pickerQuickReactionEmojiIds: pickerQuickReactionEmojiIds,
     hoverableReactionPickerSelector: hoverableReactionPicker
-  }))))));
+  })))));
 });
 var PopperWrapper = exports.PopperWrapper = function PopperWrapper(props) {
-  var triggerRef = props.triggerRef,
-    settings = props.settings,
-    isOpen = props.isOpen,
-    onClose = props.onClose,
+  var settings = props.settings,
     children = props.children,
     popperModifiers = props.popperModifiers;
   var _useState11 = (0, _react.useState)(null),
@@ -365,21 +365,10 @@ var PopperWrapper = exports.PopperWrapper = function PopperWrapper(props) {
     initialFocusRef: null,
     targetRef: popupRef
   });
-
-  /**
-   * Custom hook triggers when user clicks outside the reactions picker
-   */
-  (0, _useCloseManager.useCloseManagerV2)(popupRef, triggerRef, function (callbackType) {
-    onClose();
-    if (popupRef && callbackType === 'ESCAPE') {
-      requestAnimationFrame(function () {
-        return triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.focus();
-      });
-    }
-  }, true, isOpen);
   return /*#__PURE__*/_react.default.createElement(_popper.Popper, {
     placement: settings.popperPlacement,
-    modifiers: popperModifiers
+    modifiers: popperModifiers,
+    strategy: "absolute"
   }, function (_ref3) {
     var _ref4 = _ref3.ref,
       style = _ref3.style,

package/dist/cjs/components/ReactionPickerNew.compiled.css

@@ -0,0 +1,11 @@
+
+._2rko1sit{border-radius:var(--ds-border-radius,3px)}._16qs1a23{box-shadow:var(--_3t1odq)}
+._1bch1b66>div{margin-top:var(--ds-space-050,4px)}
+._1e0c1txw{display:flex}
+._1pra1o8l.miniMode{display:inline-block}
+._79pa1b66>div{margin-bottom:var(--ds-space-050,4px)}
+._bfhk13b4{background-color:var(--_1f6rtr1)}
+._s7n4nkob{vertical-align:middle}
+._1hvw1o36:focus{outline-width:medium}
+._49pcglyw:focus{outline-style:none}
+._nt751r31:focus{outline-color:currentColor}