@atlaskit/reactions 25.2.0 → 25.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # @atlaskit/reactions
2
2
 
3
+ ## 25.3.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#114320](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/114320)
8
+ [`5ab40880ad189`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/5ab40880ad189) -
9
+ [ux] Adds a new showRoundTrigger prop to the ReactionPicker component which is used in Trigger
10
+ component to display a round hover border around the trigger button.
11
+
12
+ ## 25.2.1
13
+
14
+ ### Patch Changes
15
+
16
+ - Updated dependencies
17
+
3
18
  ## 25.2.0
4
19
 
5
20
  ### Minor Changes
@@ -11,7 +11,7 @@ var _analyticsGasTypes = require("@atlaskit/analytics-gas-types");
11
11
  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; }
12
12
  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; }
13
13
  var packageName = "@atlaskit/reactions";
14
- var packageVersion = "25.2.0";
14
+ var packageVersion = "25.3.0";
15
15
  /**
16
16
  * TODO: move to utility package?
17
17
  * A random sampling function
@@ -95,7 +95,9 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
95
95
  _props$subtleReaction = props.subtleReactionsSummaryAndPicker,
96
96
  subtleReactionsSummaryAndPicker = _props$subtleReaction === void 0 ? false : _props$subtleReaction,
97
97
  _props$showAddReactio = props.showAddReactionText,
98
- showAddReactionText = _props$showAddReactio === void 0 ? false : _props$showAddReactio;
98
+ showAddReactionText = _props$showAddReactio === void 0 ? false : _props$showAddReactio,
99
+ _props$showRoundTrigg = props.showRoundTrigger,
100
+ showRoundTrigger = _props$showRoundTrigg === void 0 ? false : _props$showRoundTrigg;
99
101
  var _useState = (0, _react.useState)(null),
100
102
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
101
103
  triggerRef = _useState2[0],
@@ -229,7 +231,8 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
229
231
  tooltipContent: settings.isOpen ? null : tooltipContent,
230
232
  showOpaqueBackground: showOpaqueBackground,
231
233
  showAddReactionText: showAddReactionText,
232
- subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker
234
+ subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
235
+ showRoundTrigger: showRoundTrigger
233
236
  })
234
237
  );
235
238
  }), settings.isOpen && (0, _react2.jsx)(PopperWrapper, {
@@ -148,7 +148,9 @@ var Reactions = exports.Reactions = /*#__PURE__*/_react.default.memo(function (_
148
148
  hideDefaultReactions = _ref$hideDefaultReact === void 0 ? false : _ref$hideDefaultReact,
149
149
  ProfileCardWrapper = _ref.ProfileCardWrapper,
150
150
  _ref$onlyRenderPicker = _ref.onlyRenderPicker,
151
- onlyRenderPicker = _ref$onlyRenderPicker === void 0 ? false : _ref$onlyRenderPicker;
151
+ onlyRenderPicker = _ref$onlyRenderPicker === void 0 ? false : _ref$onlyRenderPicker,
152
+ _ref$showRoundTrigger = _ref.showRoundTrigger,
153
+ showRoundTrigger = _ref$showRoundTrigger === void 0 ? false : _ref$showRoundTrigger;
152
154
  var _useState = (0, _react.useState)(),
153
155
  _useState2 = (0, _slicedToArray2.default)(_useState, 2),
154
156
  selectedEmojiId = _useState2[0],
@@ -381,7 +383,8 @@ var Reactions = exports.Reactions = /*#__PURE__*/_react.default.memo(function (_
381
383
  miniMode: miniMode,
382
384
  showOpaqueBackground: showOpaqueBackground,
383
385
  showAddReactionText: showAddReactionText,
384
- subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker
386
+ subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
387
+ showRoundTrigger: showRoundTrigger
385
388
  }), (0, _react2.jsx)(_modalDialog.ModalTransition, null, !!selectedEmojiId && (0, _react2.jsx)(_ReactionDialog.ReactionsDialog, {
386
389
  selectedEmojiId: selectedEmojiId,
387
390
  reactions: sortedReactions,
@@ -55,6 +55,11 @@ var expandedTriggerStyles = (0, _primitives.xcss)({
55
55
  var triggerStylesRefresh = (0, _primitives.xcss)({
56
56
  borderRadius: 'border.radius'
57
57
  });
58
+ var roundTriggerStyles = (0, _primitives.xcss)({
59
+ borderRadius: '50%',
60
+ height: '2rem',
61
+ width: '2rem'
62
+ });
58
63
  var transparentEnabledTriggerStyles = (0, _primitives.xcss)({
59
64
  borderColor: 'color.border',
60
65
  backgroundColor: 'color.background.neutral.subtle',
@@ -109,7 +114,9 @@ var Trigger = exports.Trigger = /*#__PURE__*/_react.default.forwardRef(function
109
114
  _props$showAddReactio = props.showAddReactionText,
110
115
  showAddReactionText = _props$showAddReactio === void 0 ? false : _props$showAddReactio,
111
116
  _props$subtleReaction = props.subtleReactionsSummaryAndPicker,
112
- subtleReactionsSummaryAndPicker = _props$subtleReaction === void 0 ? false : _props$subtleReaction;
117
+ subtleReactionsSummaryAndPicker = _props$subtleReaction === void 0 ? false : _props$subtleReaction,
118
+ _props$showRoundTrigg = props.showRoundTrigger,
119
+ showRoundTrigger = _props$showRoundTrigg === void 0 ? false : _props$showRoundTrigg;
113
120
  var handleMouseDown = function handleMouseDown(e, analyticsEvent) {
114
121
  if (onClick && !disabled) {
115
122
  onClick(e, analyticsEvent);
@@ -120,7 +127,7 @@ var Trigger = exports.Trigger = /*#__PURE__*/_react.default.forwardRef(function
120
127
  content: tooltipContent
121
128
  }, (0, _react2.jsx)(_primitives.Pressable, (0, _extends2.default)({
122
129
  testId: RENDER_TRIGGER_BUTTON_TESTID,
123
- xcss: [triggerStyles, subtleReactionsSummaryAndPicker && subtleTriggerStyles, showAddReactionText && expandedTriggerStyles, disabled ? disabledTriggerStyles : showOpaqueBackground ? opaqueEnabledTriggerStyles : transparentEnabledTriggerStyles, miniMode && miniModeStyles, (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') && triggerStylesRefresh],
130
+ xcss: [triggerStyles, subtleReactionsSummaryAndPicker && subtleTriggerStyles, showAddReactionText && expandedTriggerStyles, disabled ? disabledTriggerStyles : showOpaqueBackground ? opaqueEnabledTriggerStyles : transparentEnabledTriggerStyles, miniMode && miniModeStyles, (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') && triggerStylesRefresh, showRoundTrigger && roundTriggerStyles],
124
131
  onClick: handleMouseDown,
125
132
  isDisabled: disabled,
126
133
  ref: ref
@@ -1,7 +1,7 @@
1
1
  import { createAndFireEvent } from '@atlaskit/analytics-next';
2
2
  import { UI_EVENT_TYPE, OPERATIONAL_EVENT_TYPE } from '@atlaskit/analytics-gas-types';
3
3
  const packageName = "@atlaskit/reactions";
4
- const packageVersion = "25.2.0";
4
+ const packageVersion = "25.3.0";
5
5
  /**
6
6
  * TODO: move to utility package?
7
7
  * A random sampling function
@@ -78,7 +78,8 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
78
78
  emojiPickerSize,
79
79
  showOpaqueBackground = false,
80
80
  subtleReactionsSummaryAndPicker = false,
81
- showAddReactionText = false
81
+ showAddReactionText = false,
82
+ showRoundTrigger = false
82
83
  } = props;
83
84
  const [triggerRef, setTriggerRef] = useState(null);
84
85
 
@@ -206,7 +207,8 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
206
207
  tooltipContent: settings.isOpen ? null : tooltipContent,
207
208
  showOpaqueBackground: showOpaqueBackground,
208
209
  showAddReactionText: showAddReactionText,
209
- subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker
210
+ subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
211
+ showRoundTrigger: showRoundTrigger
210
212
  })), settings.isOpen && jsx(PopperWrapper, {
211
213
  settings: settings
212
214
  }, settings.showFullPicker ? jsx(EmojiPicker, {
@@ -115,7 +115,8 @@ export const Reactions = /*#__PURE__*/React.memo(({
115
115
  showAddReactionText = false,
116
116
  hideDefaultReactions = false,
117
117
  ProfileCardWrapper,
118
- onlyRenderPicker = false
118
+ onlyRenderPicker = false,
119
+ showRoundTrigger = false
119
120
  }) => {
120
121
  const [selectedEmojiId, setSelectedEmojiId] = useState();
121
122
  const {
@@ -333,7 +334,8 @@ export const Reactions = /*#__PURE__*/React.memo(({
333
334
  miniMode: miniMode,
334
335
  showOpaqueBackground: showOpaqueBackground,
335
336
  showAddReactionText: showAddReactionText,
336
- subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker
337
+ subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
338
+ showRoundTrigger: showRoundTrigger
337
339
  }), jsx(ModalTransition, null, !!selectedEmojiId && jsx(ReactionsDialog, {
338
340
  selectedEmojiId: selectedEmojiId,
339
341
  reactions: sortedReactions,
@@ -47,6 +47,11 @@ const expandedTriggerStyles = xcss({
47
47
  const triggerStylesRefresh = xcss({
48
48
  borderRadius: 'border.radius'
49
49
  });
50
+ const roundTriggerStyles = xcss({
51
+ borderRadius: '50%',
52
+ height: '2rem',
53
+ width: '2rem'
54
+ });
50
55
  const transparentEnabledTriggerStyles = xcss({
51
56
  borderColor: 'color.border',
52
57
  backgroundColor: 'color.background.neutral.subtle',
@@ -98,7 +103,8 @@ export const Trigger = /*#__PURE__*/React.forwardRef((props, ref) => {
98
103
  ariaAttributes = {},
99
104
  showOpaqueBackground = false,
100
105
  showAddReactionText = false,
101
- subtleReactionsSummaryAndPicker = false
106
+ subtleReactionsSummaryAndPicker = false,
107
+ showRoundTrigger = false
102
108
  } = props;
103
109
  const handleMouseDown = (e, analyticsEvent) => {
104
110
  if (onClick && !disabled) {
@@ -110,7 +116,7 @@ export const Trigger = /*#__PURE__*/React.forwardRef((props, ref) => {
110
116
  content: tooltipContent
111
117
  }, jsx(Pressable, _extends({
112
118
  testId: RENDER_TRIGGER_BUTTON_TESTID,
113
- xcss: [triggerStyles, subtleReactionsSummaryAndPicker && subtleTriggerStyles, showAddReactionText && expandedTriggerStyles, disabled ? disabledTriggerStyles : showOpaqueBackground ? opaqueEnabledTriggerStyles : transparentEnabledTriggerStyles, miniMode && miniModeStyles, fg('platform-component-visual-refresh') && triggerStylesRefresh],
119
+ xcss: [triggerStyles, subtleReactionsSummaryAndPicker && subtleTriggerStyles, showAddReactionText && expandedTriggerStyles, disabled ? disabledTriggerStyles : showOpaqueBackground ? opaqueEnabledTriggerStyles : transparentEnabledTriggerStyles, miniMode && miniModeStyles, fg('platform-component-visual-refresh') && triggerStylesRefresh, showRoundTrigger && roundTriggerStyles],
114
120
  onClick: handleMouseDown,
115
121
  isDisabled: disabled,
116
122
  ref: ref
@@ -4,7 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
4
4
  import { createAndFireEvent } from '@atlaskit/analytics-next';
5
5
  import { UI_EVENT_TYPE, OPERATIONAL_EVENT_TYPE } from '@atlaskit/analytics-gas-types';
6
6
  var packageName = "@atlaskit/reactions";
7
- var packageVersion = "25.2.0";
7
+ var packageVersion = "25.3.0";
8
8
  /**
9
9
  * TODO: move to utility package?
10
10
  * A random sampling function
@@ -88,7 +88,9 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
88
88
  _props$subtleReaction = props.subtleReactionsSummaryAndPicker,
89
89
  subtleReactionsSummaryAndPicker = _props$subtleReaction === void 0 ? false : _props$subtleReaction,
90
90
  _props$showAddReactio = props.showAddReactionText,
91
- showAddReactionText = _props$showAddReactio === void 0 ? false : _props$showAddReactio;
91
+ showAddReactionText = _props$showAddReactio === void 0 ? false : _props$showAddReactio,
92
+ _props$showRoundTrigg = props.showRoundTrigger,
93
+ showRoundTrigger = _props$showRoundTrigg === void 0 ? false : _props$showRoundTrigg;
92
94
  var _useState = useState(null),
93
95
  _useState2 = _slicedToArray(_useState, 2),
94
96
  triggerRef = _useState2[0],
@@ -222,7 +224,8 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
222
224
  tooltipContent: settings.isOpen ? null : tooltipContent,
223
225
  showOpaqueBackground: showOpaqueBackground,
224
226
  showAddReactionText: showAddReactionText,
225
- subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker
227
+ subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
228
+ showRoundTrigger: showRoundTrigger
226
229
  })
227
230
  );
228
231
  }), settings.isOpen && jsx(PopperWrapper, {
@@ -135,7 +135,9 @@ export var Reactions = /*#__PURE__*/React.memo(function (_ref) {
135
135
  hideDefaultReactions = _ref$hideDefaultReact === void 0 ? false : _ref$hideDefaultReact,
136
136
  ProfileCardWrapper = _ref.ProfileCardWrapper,
137
137
  _ref$onlyRenderPicker = _ref.onlyRenderPicker,
138
- onlyRenderPicker = _ref$onlyRenderPicker === void 0 ? false : _ref$onlyRenderPicker;
138
+ onlyRenderPicker = _ref$onlyRenderPicker === void 0 ? false : _ref$onlyRenderPicker,
139
+ _ref$showRoundTrigger = _ref.showRoundTrigger,
140
+ showRoundTrigger = _ref$showRoundTrigger === void 0 ? false : _ref$showRoundTrigger;
139
141
  var _useState = useState(),
140
142
  _useState2 = _slicedToArray(_useState, 2),
141
143
  selectedEmojiId = _useState2[0],
@@ -368,7 +370,8 @@ export var Reactions = /*#__PURE__*/React.memo(function (_ref) {
368
370
  miniMode: miniMode,
369
371
  showOpaqueBackground: showOpaqueBackground,
370
372
  showAddReactionText: showAddReactionText,
371
- subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker
373
+ subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
374
+ showRoundTrigger: showRoundTrigger
372
375
  }), jsx(ModalTransition, null, !!selectedEmojiId && jsx(ReactionsDialog, {
373
376
  selectedEmojiId: selectedEmojiId,
374
377
  reactions: sortedReactions,
@@ -47,6 +47,11 @@ var expandedTriggerStyles = xcss({
47
47
  var triggerStylesRefresh = xcss({
48
48
  borderRadius: 'border.radius'
49
49
  });
50
+ var roundTriggerStyles = xcss({
51
+ borderRadius: '50%',
52
+ height: '2rem',
53
+ width: '2rem'
54
+ });
50
55
  var transparentEnabledTriggerStyles = xcss({
51
56
  borderColor: 'color.border',
52
57
  backgroundColor: 'color.background.neutral.subtle',
@@ -101,7 +106,9 @@ export var Trigger = /*#__PURE__*/React.forwardRef(function (props, ref) {
101
106
  _props$showAddReactio = props.showAddReactionText,
102
107
  showAddReactionText = _props$showAddReactio === void 0 ? false : _props$showAddReactio,
103
108
  _props$subtleReaction = props.subtleReactionsSummaryAndPicker,
104
- subtleReactionsSummaryAndPicker = _props$subtleReaction === void 0 ? false : _props$subtleReaction;
109
+ subtleReactionsSummaryAndPicker = _props$subtleReaction === void 0 ? false : _props$subtleReaction,
110
+ _props$showRoundTrigg = props.showRoundTrigger,
111
+ showRoundTrigger = _props$showRoundTrigg === void 0 ? false : _props$showRoundTrigg;
105
112
  var handleMouseDown = function handleMouseDown(e, analyticsEvent) {
106
113
  if (onClick && !disabled) {
107
114
  onClick(e, analyticsEvent);
@@ -112,7 +119,7 @@ export var Trigger = /*#__PURE__*/React.forwardRef(function (props, ref) {
112
119
  content: tooltipContent
113
120
  }, jsx(Pressable, _extends({
114
121
  testId: RENDER_TRIGGER_BUTTON_TESTID,
115
- xcss: [triggerStyles, subtleReactionsSummaryAndPicker && subtleTriggerStyles, showAddReactionText && expandedTriggerStyles, disabled ? disabledTriggerStyles : showOpaqueBackground ? opaqueEnabledTriggerStyles : transparentEnabledTriggerStyles, miniMode && miniModeStyles, fg('platform-component-visual-refresh') && triggerStylesRefresh],
122
+ xcss: [triggerStyles, subtleReactionsSummaryAndPicker && subtleTriggerStyles, showAddReactionText && expandedTriggerStyles, disabled ? disabledTriggerStyles : showOpaqueBackground ? opaqueEnabledTriggerStyles : transparentEnabledTriggerStyles, miniMode && miniModeStyles, fg('platform-component-visual-refresh') && triggerStylesRefresh, showRoundTrigger && roundTriggerStyles],
116
123
  onClick: handleMouseDown,
117
124
  isDisabled: disabled,
118
125
  ref: ref
@@ -68,6 +68,10 @@ export interface ReactionPickerProps extends Pick<SelectorProps, 'pickerQuickRea
68
68
  * Optional prop for displaying text to add a reaction
69
69
  */
70
70
  showAddReactionText?: boolean;
71
+ /**
72
+ * Optional prop for controlling if the picker hover border will be rounded
73
+ */
74
+ showRoundTrigger?: boolean;
71
75
  }
72
76
  /**
73
77
  * Picker component for adding reactions
@@ -143,6 +143,10 @@ export interface ReactionsProps extends Pick<ReactionPickerProps, 'allowAllEmoji
143
143
  * Optional prop to hide the user reactions and only render the picker
144
144
  */
145
145
  onlyRenderPicker?: boolean;
146
+ /**
147
+ * Optional prop for controlling if the picker hover border will be rounded
148
+ */
149
+ showRoundTrigger?: boolean;
146
150
  }
147
151
  /**
148
152
  * Get content of the tooltip
@@ -151,4 +155,4 @@ export declare function getTooltip(status: ReactionStatus, errorMessage?: string
151
155
  /**
152
156
  * Renders list of reactions
153
157
  */
154
- export declare const Reactions: React.MemoExoticComponent<({ flash, particleEffectByEmoji, status, errorMessage, loadReaction, quickReactionEmojis, pickerQuickReactionEmojiIds, getReactionDetails, onReactionHover, onSelection, reactions, emojiProvider, allowAllEmojis, onReactionClick, allowUserDialog, onDialogOpenCallback, onDialogCloseCallback, onDialogSelectReactionCallback, onDialogPageChangeCallback, emojiPickerSize, miniMode, summaryViewEnabled, summaryViewThreshold, summaryViewPlacement, showOpaqueBackground, subtleReactionsSummaryAndPicker, showAddReactionText, hideDefaultReactions, ProfileCardWrapper, onlyRenderPicker, }: ReactionsProps) => jsx.JSX.Element>;
158
+ export declare const Reactions: React.MemoExoticComponent<({ flash, particleEffectByEmoji, status, errorMessage, loadReaction, quickReactionEmojis, pickerQuickReactionEmojiIds, getReactionDetails, onReactionHover, onSelection, reactions, emojiProvider, allowAllEmojis, onReactionClick, allowUserDialog, onDialogOpenCallback, onDialogCloseCallback, onDialogSelectReactionCallback, onDialogPageChangeCallback, emojiPickerSize, miniMode, summaryViewEnabled, summaryViewThreshold, summaryViewPlacement, showOpaqueBackground, subtleReactionsSummaryAndPicker, showAddReactionText, hideDefaultReactions, ProfileCardWrapper, onlyRenderPicker, showRoundTrigger, }: ReactionsProps) => jsx.JSX.Element>;
@@ -44,6 +44,10 @@ export interface TriggerProps {
44
44
  * Optional prop for applying subtle styling to reaction picker
45
45
  */
46
46
  subtleReactionsSummaryAndPicker?: boolean;
47
+ /**
48
+ * Optional prop for controlling if the picker hover border will be rounded
49
+ */
50
+ showRoundTrigger?: boolean;
47
51
  }
48
52
  /**
49
53
  * Render an emoji button to open the reactions select picker
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { type ReactionsProps, type ReactionPickerProps } from '../../components';
3
3
  import { ReactionStatus, type Actions, type State, type StorePropInput } from '../../types';
4
4
  import { type ReactionUpdateSuccess } from '../../types/reaction';
5
- export interface ConnectedReactionsViewProps extends Pick<ReactionsProps, 'quickReactionEmojis' | 'onDialogOpenCallback' | 'onDialogCloseCallback' | 'onDialogSelectReactionCallback' | 'allowUserDialog' | 'allowAllEmojis' | 'emojiProvider' | 'emojiPickerSize' | 'miniMode' | 'summaryViewEnabled' | 'subtleReactionsSummaryAndPicker' | 'onlyRenderPicker'>, Pick<ReactionPickerProps, 'pickerQuickReactionEmojiIds'> {
5
+ export interface ConnectedReactionsViewProps extends Pick<ReactionsProps, 'quickReactionEmojis' | 'onDialogOpenCallback' | 'onDialogCloseCallback' | 'onDialogSelectReactionCallback' | 'allowUserDialog' | 'allowAllEmojis' | 'emojiProvider' | 'emojiPickerSize' | 'miniMode' | 'summaryViewEnabled' | 'subtleReactionsSummaryAndPicker' | 'onlyRenderPicker' | 'showRoundTrigger'>, Pick<ReactionPickerProps, 'pickerQuickReactionEmojiIds'> {
6
6
  /**
7
7
  * Wrapper id for reactions list
8
8
  */
@@ -68,6 +68,10 @@ export interface ReactionPickerProps extends Pick<SelectorProps, 'pickerQuickRea
68
68
  * Optional prop for displaying text to add a reaction
69
69
  */
70
70
  showAddReactionText?: boolean;
71
+ /**
72
+ * Optional prop for controlling if the picker hover border will be rounded
73
+ */
74
+ showRoundTrigger?: boolean;
71
75
  }
72
76
  /**
73
77
  * Picker component for adding reactions
@@ -143,6 +143,10 @@ export interface ReactionsProps extends Pick<ReactionPickerProps, 'allowAllEmoji
143
143
  * Optional prop to hide the user reactions and only render the picker
144
144
  */
145
145
  onlyRenderPicker?: boolean;
146
+ /**
147
+ * Optional prop for controlling if the picker hover border will be rounded
148
+ */
149
+ showRoundTrigger?: boolean;
146
150
  }
147
151
  /**
148
152
  * Get content of the tooltip
@@ -151,4 +155,4 @@ export declare function getTooltip(status: ReactionStatus, errorMessage?: string
151
155
  /**
152
156
  * Renders list of reactions
153
157
  */
154
- export declare const Reactions: React.MemoExoticComponent<({ flash, particleEffectByEmoji, status, errorMessage, loadReaction, quickReactionEmojis, pickerQuickReactionEmojiIds, getReactionDetails, onReactionHover, onSelection, reactions, emojiProvider, allowAllEmojis, onReactionClick, allowUserDialog, onDialogOpenCallback, onDialogCloseCallback, onDialogSelectReactionCallback, onDialogPageChangeCallback, emojiPickerSize, miniMode, summaryViewEnabled, summaryViewThreshold, summaryViewPlacement, showOpaqueBackground, subtleReactionsSummaryAndPicker, showAddReactionText, hideDefaultReactions, ProfileCardWrapper, onlyRenderPicker, }: ReactionsProps) => jsx.JSX.Element>;
158
+ export declare const Reactions: React.MemoExoticComponent<({ flash, particleEffectByEmoji, status, errorMessage, loadReaction, quickReactionEmojis, pickerQuickReactionEmojiIds, getReactionDetails, onReactionHover, onSelection, reactions, emojiProvider, allowAllEmojis, onReactionClick, allowUserDialog, onDialogOpenCallback, onDialogCloseCallback, onDialogSelectReactionCallback, onDialogPageChangeCallback, emojiPickerSize, miniMode, summaryViewEnabled, summaryViewThreshold, summaryViewPlacement, showOpaqueBackground, subtleReactionsSummaryAndPicker, showAddReactionText, hideDefaultReactions, ProfileCardWrapper, onlyRenderPicker, showRoundTrigger, }: ReactionsProps) => jsx.JSX.Element>;
@@ -44,6 +44,10 @@ export interface TriggerProps {
44
44
  * Optional prop for applying subtle styling to reaction picker
45
45
  */
46
46
  subtleReactionsSummaryAndPicker?: boolean;
47
+ /**
48
+ * Optional prop for controlling if the picker hover border will be rounded
49
+ */
50
+ showRoundTrigger?: boolean;
47
51
  }
48
52
  /**
49
53
  * Render an emoji button to open the reactions select picker
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { type ReactionsProps, type ReactionPickerProps } from '../../components';
3
3
  import { ReactionStatus, type Actions, type State, type StorePropInput } from '../../types';
4
4
  import { type ReactionUpdateSuccess } from '../../types/reaction';
5
- export interface ConnectedReactionsViewProps extends Pick<ReactionsProps, 'quickReactionEmojis' | 'onDialogOpenCallback' | 'onDialogCloseCallback' | 'onDialogSelectReactionCallback' | 'allowUserDialog' | 'allowAllEmojis' | 'emojiProvider' | 'emojiPickerSize' | 'miniMode' | 'summaryViewEnabled' | 'subtleReactionsSummaryAndPicker' | 'onlyRenderPicker'>, Pick<ReactionPickerProps, 'pickerQuickReactionEmojiIds'> {
5
+ export interface ConnectedReactionsViewProps extends Pick<ReactionsProps, 'quickReactionEmojis' | 'onDialogOpenCallback' | 'onDialogCloseCallback' | 'onDialogSelectReactionCallback' | 'allowUserDialog' | 'allowAllEmojis' | 'emojiProvider' | 'emojiPickerSize' | 'miniMode' | 'summaryViewEnabled' | 'subtleReactionsSummaryAndPicker' | 'onlyRenderPicker' | 'showRoundTrigger'>, Pick<ReactionPickerProps, 'pickerQuickReactionEmojiIds'> {
6
6
  /**
7
7
  * Wrapper id for reactions list
8
8
  */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/reactions",
3
- "version": "25.2.0",
3
+ "version": "25.3.0",
4
4
  "description": "Reactions component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -41,7 +41,7 @@
41
41
  "@atlaskit/heading": "^4.1.0",
42
42
  "@atlaskit/icon": "^23.9.0",
43
43
  "@atlaskit/modal-dialog": "^12.20.0",
44
- "@atlaskit/motion": "^2.0.0",
44
+ "@atlaskit/motion": "^3.0.0",
45
45
  "@atlaskit/platform-feature-flags": "^1.0.0",
46
46
  "@atlaskit/popper": "^6.4.0",
47
47
  "@atlaskit/popup": "1.31.2",