@atlaskit/reactions 32.0.1 → 33.0.1

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/reactions
 
+## 33.0.1
+
+### Patch Changes
+
+- [#168917](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/168917)
+  [`06e3a9a376da3`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/06e3a9a376da3) -
+  [ux] Bug fix for wrong animation being rendered on the byline for page reactions
+
+## 33.0.0
+
+### Major Changes
+
+- [#167562](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/167562)
+  [`7716ba2e99acf`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7716ba2e99acf) -
+  [ux] Removing prevent overflow options from the reactions picker component since it is no longer
+  being used
+
 ## 32.0.1
 
 ### Patch 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 = "32.0.1";
+var packageVersion = "33.0.1";
 /**
  * TODO: move to utility package?
  * A random sampling function

package/dist/cjs/components/ReactionPicker.js

@@ -81,7 +81,6 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
     reactionPickerTriggerIcon = props.reactionPickerTriggerIcon,
     reactionPickerTriggerText = props.reactionPickerTriggerText,
     reactionPickerPlacement = props.reactionPickerPlacement,
-    reactionsPickerPreventOverflowOptions = props.reactionsPickerPreventOverflowOptions,
     _props$isListItem = props.isListItem,
     isListItem = _props$isListItem === void 0 ? false : _props$isListItem,
     _props$hoverableReact = props.hoverableReactionPicker,
@@ -142,12 +141,7 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
       flipVariations: true,
       boundariesElement: 'scrollParent'
     }
-  }, _objectSpread({
-    name: 'preventOverflow',
-    enabled: true
-  }, reactionsPickerPreventOverflowOptions && {
-    options: reactionsPickerPreventOverflowOptions
-  })];
+  }];
   var _useState1 = (0, _react.useState)({
       /**
        * Show the full custom emoji list picker or the default list of emojis

package/dist/cjs/components/ReactionPickerNew.js

@@ -82,7 +82,6 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
     reactionPickerTriggerIcon = props.reactionPickerTriggerIcon,
     reactionPickerTriggerText = props.reactionPickerTriggerText,
     reactionPickerPlacement = props.reactionPickerPlacement,
-    reactionsPickerPreventOverflowOptions = props.reactionsPickerPreventOverflowOptions,
     _props$isListItem = props.isListItem,
     isListItem = _props$isListItem === void 0 ? false : _props$isListItem,
     _props$hoverableReact = props.hoverableReactionPicker,
@@ -143,12 +142,7 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
       flipVariations: true,
       boundariesElement: 'scrollParent'
     }
-  }, _objectSpread({
-    name: 'preventOverflow',
-    enabled: true
-  }, reactionsPickerPreventOverflowOptions && {
-    options: reactionsPickerPreventOverflowOptions
-  })];
+  }];
   var _useState1 = (0, _react.useState)({
       /**
        * Show the full custom emoji list picker or the default list of emojis

package/dist/cjs/components/ReactionSummaryView.js

@@ -15,6 +15,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _popup = _interopRequireDefault(require("@atlaskit/popup"));
 var _picker = require("@atlaskit/emoji/picker");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _useDelayedState3 = require("../hooks/useDelayedState");
 var _Reaction = require("./Reaction");
 var _Trigger = require("./Trigger");
@@ -248,6 +249,7 @@ var ReactionSummaryView = exports.ReactionSummaryView = function ReactionSummary
         summaryButtonIconAfter: summaryButtonIconAfter,
         summaryViewParticleEffectEmojiId: summaryViewParticleEffectEmojiId
       }));
-    }
+    },
+    shouldRenderToParent: (0, _platformFeatureFlags.fg)('should-render-to-parent-should-be-true-editor-coll')
   });
 };

package/dist/cjs/components/Reactions.js

@@ -162,6 +162,13 @@ var Reactions = exports.Reactions = /*#__PURE__*/_react.default.memo(function (_
     _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
     summaryViewParticleEffectEmojiId = _useState4[0],
     setSummaryViewParticleEffectEmojiId = _useState4[1];
+
+  // if the reactions are empty, then set summaryViewParticleEffectEmojiId to null to clear the particle effect state
+  (0, _react.useEffect)(function () {
+    if (reactions.length === 0) {
+      setSummaryViewParticleEffectEmojiId(null);
+    }
+  }, [reactions]);
   var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
     createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   var openTime = (0, _react.useRef)();

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

package/dist/es2019/components/ReactionPicker.js

@@ -62,7 +62,6 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
     reactionPickerTriggerIcon,
     reactionPickerTriggerText,
     reactionPickerPlacement,
-    reactionsPickerPreventOverflowOptions,
     isListItem = false,
     hoverableReactionPicker = false,
     hoverableReactionPickerDelay = 0
@@ -103,12 +102,6 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
       flipVariations: true,
       boundariesElement: 'scrollParent'
     }
-  }, {
-    name: 'preventOverflow',
-    enabled: true,
-    ...(reactionsPickerPreventOverflowOptions && {
-      options: reactionsPickerPreventOverflowOptions
-    })
   }];
   const [settings, setSettings] = useState({
     /**

package/dist/es2019/components/ReactionPickerNew.js

@@ -63,7 +63,6 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
     reactionPickerTriggerIcon,
     reactionPickerTriggerText,
     reactionPickerPlacement,
-    reactionsPickerPreventOverflowOptions,
     isListItem = false,
     hoverableReactionPicker = false,
     hoverableReactionPickerDelay = 0
@@ -104,12 +103,6 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
       flipVariations: true,
       boundariesElement: 'scrollParent'
     }
-  }, {
-    name: 'preventOverflow',
-    enabled: true,
-    ...(reactionsPickerPreventOverflowOptions && {
-      options: reactionsPickerPreventOverflowOptions
-    })
   }];
   const [settings, setSettings] = useState({
     /**

package/dist/es2019/components/ReactionSummaryView.js

@@ -6,6 +6,7 @@ import { ax, ix } from "@compiled/react/runtime";
 import { useCallback, useState } from 'react';
 import Popup from '@atlaskit/popup';
 import { EmojiPicker } from '@atlaskit/emoji/picker';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { useDelayedState } from '../hooks/useDelayedState';
 import { Reaction } from './Reaction';
 import { Trigger as EmojiPickerTrigger } from './Trigger';
@@ -210,6 +211,7 @@ export const ReactionSummaryView = ({
       summaryGetOptimisticImageURL: summaryGetOptimisticImageURL,
       summaryButtonIconAfter: summaryButtonIconAfter,
       summaryViewParticleEffectEmojiId: summaryViewParticleEffectEmojiId
-    }))
+    })),
+    shouldRenderToParent: fg('should-render-to-parent-should-be-true-editor-coll')
   });
 };

package/dist/es2019/components/Reactions.js

@@ -119,6 +119,13 @@ export const Reactions = /*#__PURE__*/React.memo(({
 }) => {
   const [selectedEmojiId, setSelectedEmojiId] = useState('');
   const [summaryViewParticleEffectEmojiId, setSummaryViewParticleEffectEmojiId] = useState(null);
+
+  // if the reactions are empty, then set summaryViewParticleEffectEmojiId to null to clear the particle effect state
+  useEffect(() => {
+    if (reactions.length === 0) {
+      setSummaryViewParticleEffectEmojiId(null);
+    }
+  }, [reactions]);
   const {
     createAnalyticsEvent
   } = useAnalyticsEvents();

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

package/dist/esm/components/ReactionPicker.js

@@ -72,7 +72,6 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
     reactionPickerTriggerIcon = props.reactionPickerTriggerIcon,
     reactionPickerTriggerText = props.reactionPickerTriggerText,
     reactionPickerPlacement = props.reactionPickerPlacement,
-    reactionsPickerPreventOverflowOptions = props.reactionsPickerPreventOverflowOptions,
     _props$isListItem = props.isListItem,
     isListItem = _props$isListItem === void 0 ? false : _props$isListItem,
     _props$hoverableReact = props.hoverableReactionPicker,
@@ -133,12 +132,7 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
       flipVariations: true,
       boundariesElement: 'scrollParent'
     }
-  }, _objectSpread({
-    name: 'preventOverflow',
-    enabled: true
-  }, reactionsPickerPreventOverflowOptions && {
-    options: reactionsPickerPreventOverflowOptions
-  })];
+  }];
   var _useState1 = useState({
       /**
        * Show the full custom emoji list picker or the default list of emojis

package/dist/esm/components/ReactionPickerNew.js

@@ -73,7 +73,6 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
     reactionPickerTriggerIcon = props.reactionPickerTriggerIcon,
     reactionPickerTriggerText = props.reactionPickerTriggerText,
     reactionPickerPlacement = props.reactionPickerPlacement,
-    reactionsPickerPreventOverflowOptions = props.reactionsPickerPreventOverflowOptions,
     _props$isListItem = props.isListItem,
     isListItem = _props$isListItem === void 0 ? false : _props$isListItem,
     _props$hoverableReact = props.hoverableReactionPicker,
@@ -134,12 +133,7 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
       flipVariations: true,
       boundariesElement: 'scrollParent'
     }
-  }, _objectSpread({
-    name: 'preventOverflow',
-    enabled: true
-  }, reactionsPickerPreventOverflowOptions && {
-    options: reactionsPickerPreventOverflowOptions
-  })];
+  }];
   var _useState1 = useState({
       /**
        * Show the full custom emoji list picker or the default list of emojis

package/dist/esm/components/ReactionSummaryView.js

@@ -7,6 +7,7 @@ import { ax, ix } from "@compiled/react/runtime";
 import { useCallback, useState } from 'react';
 import Popup from '@atlaskit/popup';
 import { EmojiPicker } from '@atlaskit/emoji/picker';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { useDelayedState } from '../hooks/useDelayedState';
 import { Reaction } from './Reaction';
 import { Trigger as EmojiPickerTrigger } from './Trigger';
@@ -239,6 +240,7 @@ export var ReactionSummaryView = function ReactionSummaryView(_ref) {
         summaryButtonIconAfter: summaryButtonIconAfter,
         summaryViewParticleEffectEmojiId: summaryViewParticleEffectEmojiId
       }));
-    }
+    },
+    shouldRenderToParent: fg('should-render-to-parent-should-be-true-editor-coll')
   });
 };

package/dist/esm/components/Reactions.js

@@ -151,6 +151,13 @@ export var Reactions = /*#__PURE__*/React.memo(function (_ref) {
     _useState4 = _slicedToArray(_useState3, 2),
     summaryViewParticleEffectEmojiId = _useState4[0],
     setSummaryViewParticleEffectEmojiId = _useState4[1];
+
+  // if the reactions are empty, then set summaryViewParticleEffectEmojiId to null to clear the particle effect state
+  useEffect(function () {
+    if (reactions.length === 0) {
+      setSummaryViewParticleEffectEmojiId(null);
+    }
+  }, [reactions]);
   var _useAnalyticsEvents = useAnalyticsEvents(),
     createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   var openTime = useRef();

package/dist/types/components/ReactionPicker.d.ts

@@ -72,10 +72,6 @@ export interface ReactionPickerProps extends Pick<SelectorProps, 'pickerQuickRea
      * Optional prop for controlling the picker location
      */
     reactionPickerPlacement?: Placement;
-    /**
-     * Optional prop for controlling the overflow of the reaction picker
-     */
-    reactionsPickerPreventOverflowOptions?: Record<string, any>;
     /**
      * Optional prop for controlling icon inside Trigger
      */

package/dist/types/components/ReactionPickerNew.d.ts

@@ -72,10 +72,6 @@ export interface ReactionPickerProps extends Pick<SelectorProps, 'pickerQuickRea
      * Optional prop for controlling the picker location
      */
     reactionPickerPlacement?: Placement;
-    /**
-     * Optional prop for controlling the overflow of the reaction picker
-     */
-    reactionsPickerPreventOverflowOptions?: Record<string, any>;
     /**
      * Optional prop for controlling icon inside Trigger
      */

package/dist/types/components/ReactionSummaryView.d.ts

@@ -45,9 +45,10 @@ interface ReactionSummaryViewProps extends Pick<ReactionsProps, 'emojiProvider'
     /**
      * Optional function when the user wants to open the Reactions Dialog
      */
-    handleOpenReactionsDialog?: (options?: OpenReactionsDialogOptions) => void /**
+    handleOpenReactionsDialog?: (options?: OpenReactionsDialogOptions) => void;
+    /**
      * Optional prop for controlling if the reactions component is view only, disabling adding reactions
-     */;
+     */
     isViewOnly?: boolean;
     /**
      * Optional event handler when the emoji picker is opened

package/dist/types/components/Reactions.d.ts

@@ -33,7 +33,7 @@ export declare const RENDER_VIEWALL_REACTED_USERS_DIALOG = "viewall-reacted-user
  * Test id for summary view of reactions
  */
 export declare const RENDER_REACTIONS_SUMMARY_TESTID = "reaction-summary-view";
-export interface ReactionsProps extends Pick<ReactionPickerProps, 'allowAllEmojis' | 'emojiProvider' | 'emojiPickerSize' | 'miniMode' | 'reactionPickerTriggerIcon' | 'reactionPickerPlacement' | 'reactionsPickerPreventOverflowOptions'>, Pick<SelectorProps, 'pickerQuickReactionEmojiIds'> {
+export interface ReactionsProps extends Pick<ReactionPickerProps, 'allowAllEmojis' | 'emojiProvider' | 'emojiPickerSize' | 'miniMode' | 'reactionPickerTriggerIcon' | 'reactionPickerPlacement'>, Pick<SelectorProps, 'pickerQuickReactionEmojiIds'> {
     /**
      * event handler to fetching the reactions
      */

package/dist/types-ts4.5/components/ReactionPicker.d.ts

@@ -72,10 +72,6 @@ export interface ReactionPickerProps extends Pick<SelectorProps, 'pickerQuickRea
      * Optional prop for controlling the picker location
      */
     reactionPickerPlacement?: Placement;
-    /**
-     * Optional prop for controlling the overflow of the reaction picker
-     */
-    reactionsPickerPreventOverflowOptions?: Record<string, any>;
     /**
      * Optional prop for controlling icon inside Trigger
      */

package/dist/types-ts4.5/components/ReactionPickerNew.d.ts

@@ -72,10 +72,6 @@ export interface ReactionPickerProps extends Pick<SelectorProps, 'pickerQuickRea
      * Optional prop for controlling the picker location
      */
     reactionPickerPlacement?: Placement;
-    /**
-     * Optional prop for controlling the overflow of the reaction picker
-     */
-    reactionsPickerPreventOverflowOptions?: Record<string, any>;
     /**
      * Optional prop for controlling icon inside Trigger
      */

package/dist/types-ts4.5/components/ReactionSummaryView.d.ts

@@ -45,9 +45,10 @@ interface ReactionSummaryViewProps extends Pick<ReactionsProps, 'emojiProvider'
     /**
      * Optional function when the user wants to open the Reactions Dialog
      */
-    handleOpenReactionsDialog?: (options?: OpenReactionsDialogOptions) => void /**
+    handleOpenReactionsDialog?: (options?: OpenReactionsDialogOptions) => void;
+    /**
      * Optional prop for controlling if the reactions component is view only, disabling adding reactions
-     */;
+     */
     isViewOnly?: boolean;
     /**
      * Optional event handler when the emoji picker is opened

package/dist/types-ts4.5/components/Reactions.d.ts

@@ -33,7 +33,7 @@ export declare const RENDER_VIEWALL_REACTED_USERS_DIALOG = "viewall-reacted-user
  * Test id for summary view of reactions
  */
 export declare const RENDER_REACTIONS_SUMMARY_TESTID = "reaction-summary-view";
-export interface ReactionsProps extends Pick<ReactionPickerProps, 'allowAllEmojis' | 'emojiProvider' | 'emojiPickerSize' | 'miniMode' | 'reactionPickerTriggerIcon' | 'reactionPickerPlacement' | 'reactionsPickerPreventOverflowOptions'>, Pick<SelectorProps, 'pickerQuickReactionEmojiIds'> {
+export interface ReactionsProps extends Pick<ReactionPickerProps, 'allowAllEmojis' | 'emojiProvider' | 'emojiPickerSize' | 'miniMode' | 'reactionPickerTriggerIcon' | 'reactionPickerPlacement'>, Pick<SelectorProps, 'pickerQuickReactionEmojiIds'> {
     /**
      * event handler to fetching the reactions
      */

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/reactions",
-	"version": "32.0.1",
+	"version": "33.0.1",
 	"description": "Reactions component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -134,6 +134,9 @@
 		},
 		"dst-a11y__replace-anchor-with-link__editor-collabo": {
 			"type": "boolean"
+		},
+		"should-render-to-parent-should-be-true-editor-coll": {
+			"type": "boolean"
 		}
 	},
 	"sideEffects": [