@atlaskit/reactions 33.2.25 → 33.3.1

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,18 @@
1
1
  # @atlaskit/reactions
2
2
 
3
+ ## 33.3.1
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 33.3.0
10
+
11
+ ### Minor Changes
12
+
13
+ - [`98d925e6d7670`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/98d925e6d7670) -
14
+ [ux] Fixes issue where full picker can't be interacted with when hoverableReactionPicker=true
15
+
3
16
  ## 33.2.25
4
17
 
5
18
  ### Patch 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 = "0.0.0-development";
14
+ var packageVersion = "33.3.0";
15
15
  /**
16
16
  * TODO: move to utility package?
17
17
  * A random sampling function
@@ -58,13 +58,9 @@ var ReactionButton = exports.ReactionButton = function ReactionButton(_ref) {
58
58
  "aria-label": ariaLabel,
59
59
  "aria-pressed": ariaPressed,
60
60
  testId: testId,
61
- xcss: (0, _react2.cx)(styles.reactionButton, useCompactStyles && styles.compactButton, reacted && styles.reacted, !reacted && showSubtleStyle && styles.borderless, !reacted && showOpaqueBackground && styles.opaqueBackground,
62
- // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
63
- (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') && styles.reactionStylesRefresh)
61
+ xcss: (0, _react2.cx)(styles.reactionButton, useCompactStyles && styles.compactButton, reacted && styles.reacted, !reacted && showSubtleStyle && styles.borderless, !reacted && showOpaqueBackground && styles.opaqueBackground, (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') && styles.reactionStylesRefresh)
64
62
  }, dataAttributes), /*#__PURE__*/React.createElement(_FlashAnimation.FlashAnimation, {
65
- flash: flash
66
- // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
67
- ,
63
+ flash: flash,
68
64
  className: (0, _runtime.ax)([(0, _platformFeatureFlags.fg)('platform-component-visual-refresh') ? "_2rkolb4i _1e0c1txw _2lx2vrvc _4cvr1h6o _4t3i3698" : "_2rko19bv _1e0c1txw _2lx2vrvc _4cvr1h6o _4t3i3698"]),
69
65
  style: {
70
66
  "--_1ed2mu0": (0, _runtime.ix)("".concat(flashHeight, "px"))
@@ -328,7 +328,15 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
328
328
  isOpen: isPopupTrayOpen,
329
329
  onClose: onClose,
330
330
  triggerRef: triggerRef
331
- }, settings.showFullPicker || hoverableReactionPicker && isHoverableReactionPickerEmojiPickerOpen ? /*#__PURE__*/_react.default.createElement(_picker.EmojiPicker, {
331
+ }, settings.showFullPicker || hoverableReactionPicker && isHoverableReactionPickerEmojiPickerOpen ? (0, _platformFeatureFlags.fg)('platform_reaction_full_picker_hover') ? /*#__PURE__*/_react.default.createElement(_compiled.Box, {
332
+ xcss: additionalStyles.selectorContainer,
333
+ onMouseEnter: handlePopupMouseEnter,
334
+ onMouseLeave: handlePopupMouseLeave
335
+ }, /*#__PURE__*/_react.default.createElement(_picker.EmojiPicker, {
336
+ emojiProvider: emojiProvider,
337
+ onSelection: onEmojiSelected,
338
+ size: emojiPickerSize
339
+ })) : /*#__PURE__*/_react.default.createElement(_picker.EmojiPicker, {
332
340
  emojiProvider: emojiProvider,
333
341
  onSelection: onEmojiSelected,
334
342
  size: emojiPickerSize
@@ -85,9 +85,7 @@ var Trigger = exports.Trigger = /*#__PURE__*/_react2.default.forwardRef(function
85
85
  var renderPressableButton = function renderPressableButton() {
86
86
  return /*#__PURE__*/_react2.default.createElement(_compiled.Pressable, (0, _extends2.default)({
87
87
  testId: RENDER_TRIGGER_BUTTON_TESTID,
88
- xcss: (0, _react.cx)(styles.trigger, (fullWidthSummaryViewReactionPickerTrigger || fullWidthSelectorTrayReactionPickerTrigger) && styles.fullWidth, subtleReactionsSummaryAndPicker && styles.subtleTrigger, showAddReactionText && styles.expandedTrigger, disabled ? styles.disabledTrigger : showOpaqueBackground ? styles.opaqueEnabledTrigger : styles.transparentEnabledTrigger, miniMode && styles.miniMode,
89
- // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
90
- (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') && styles.triggerStylesRefresh),
88
+ xcss: (0, _react.cx)(styles.trigger, (fullWidthSummaryViewReactionPickerTrigger || fullWidthSelectorTrayReactionPickerTrigger) && styles.fullWidth, subtleReactionsSummaryAndPicker && styles.subtleTrigger, showAddReactionText && styles.expandedTrigger, disabled ? styles.disabledTrigger : showOpaqueBackground ? styles.opaqueEnabledTrigger : styles.transparentEnabledTrigger, miniMode && styles.miniMode, (0, _platformFeatureFlags.fg)('platform-component-visual-refresh') && styles.triggerStylesRefresh),
91
89
  style: {
92
90
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/design-system/use-tokens-typography
93
91
  lineHeight: '16px'
@@ -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 = "0.0.0-development";
4
+ const packageVersion = "33.3.0";
5
5
  /**
6
6
  * TODO: move to utility package?
7
7
  * A random sampling function
@@ -48,13 +48,9 @@ export const ReactionButton = ({
48
48
  "aria-label": ariaLabel,
49
49
  "aria-pressed": ariaPressed,
50
50
  testId: testId,
51
- xcss: cx(styles.reactionButton, useCompactStyles && styles.compactButton, reacted && styles.reacted, !reacted && showSubtleStyle && styles.borderless, !reacted && showOpaqueBackground && styles.opaqueBackground,
52
- // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
53
- fg('platform-component-visual-refresh') && styles.reactionStylesRefresh)
51
+ xcss: cx(styles.reactionButton, useCompactStyles && styles.compactButton, reacted && styles.reacted, !reacted && showSubtleStyle && styles.borderless, !reacted && showOpaqueBackground && styles.opaqueBackground, fg('platform-component-visual-refresh') && styles.reactionStylesRefresh)
54
52
  }, dataAttributes), /*#__PURE__*/React.createElement(FlashAnimation, {
55
- flash: flash
56
- // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
57
- ,
53
+ flash: flash,
58
54
  className: ax([fg('platform-component-visual-refresh') ? "_2rkolb4i _1e0c1txw _2lx2vrvc _4cvr1h6o _4t3iqslr" : "_2rko19bv _1e0c1txw _2lx2vrvc _4cvr1h6o _4t3iqslr"])
59
55
  }, children));
60
56
  };
@@ -285,7 +285,15 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
285
285
  isOpen: isPopupTrayOpen,
286
286
  onClose: onClose,
287
287
  triggerRef: triggerRef
288
- }, settings.showFullPicker || hoverableReactionPicker && isHoverableReactionPickerEmojiPickerOpen ? /*#__PURE__*/React.createElement(EmojiPicker, {
288
+ }, settings.showFullPicker || hoverableReactionPicker && isHoverableReactionPickerEmojiPickerOpen ? fg('platform_reaction_full_picker_hover') ? /*#__PURE__*/React.createElement(Box, {
289
+ xcss: additionalStyles.selectorContainer,
290
+ onMouseEnter: handlePopupMouseEnter,
291
+ onMouseLeave: handlePopupMouseLeave
292
+ }, /*#__PURE__*/React.createElement(EmojiPicker, {
293
+ emojiProvider: emojiProvider,
294
+ onSelection: onEmojiSelected,
295
+ size: emojiPickerSize
296
+ })) : /*#__PURE__*/React.createElement(EmojiPicker, {
289
297
  emojiProvider: emojiProvider,
290
298
  onSelection: onEmojiSelected,
291
299
  size: emojiPickerSize
@@ -71,9 +71,7 @@ export const Trigger = /*#__PURE__*/React.forwardRef((props, ref) => {
71
71
  };
72
72
  const renderPressableButton = () => /*#__PURE__*/React.createElement(Pressable, _extends({
73
73
  testId: RENDER_TRIGGER_BUTTON_TESTID,
74
- xcss: cx(styles.trigger, (fullWidthSummaryViewReactionPickerTrigger || fullWidthSelectorTrayReactionPickerTrigger) && styles.fullWidth, subtleReactionsSummaryAndPicker && styles.subtleTrigger, showAddReactionText && styles.expandedTrigger, disabled ? styles.disabledTrigger : showOpaqueBackground ? styles.opaqueEnabledTrigger : styles.transparentEnabledTrigger, miniMode && styles.miniMode,
75
- // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
76
- fg('platform-component-visual-refresh') && styles.triggerStylesRefresh),
74
+ xcss: cx(styles.trigger, (fullWidthSummaryViewReactionPickerTrigger || fullWidthSelectorTrayReactionPickerTrigger) && styles.fullWidth, subtleReactionsSummaryAndPicker && styles.subtleTrigger, showAddReactionText && styles.expandedTrigger, disabled ? styles.disabledTrigger : showOpaqueBackground ? styles.opaqueEnabledTrigger : styles.transparentEnabledTrigger, miniMode && styles.miniMode, fg('platform-component-visual-refresh') && styles.triggerStylesRefresh),
77
75
  style: {
78
76
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/design-system/use-tokens-typography
79
77
  lineHeight: '16px'
@@ -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 = "0.0.0-development";
7
+ var packageVersion = "33.3.0";
8
8
  /**
9
9
  * TODO: move to utility package?
10
10
  * A random sampling function
@@ -49,13 +49,9 @@ export var ReactionButton = function ReactionButton(_ref) {
49
49
  "aria-label": ariaLabel,
50
50
  "aria-pressed": ariaPressed,
51
51
  testId: testId,
52
- xcss: cx(styles.reactionButton, useCompactStyles && styles.compactButton, reacted && styles.reacted, !reacted && showSubtleStyle && styles.borderless, !reacted && showOpaqueBackground && styles.opaqueBackground,
53
- // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
54
- fg('platform-component-visual-refresh') && styles.reactionStylesRefresh)
52
+ xcss: cx(styles.reactionButton, useCompactStyles && styles.compactButton, reacted && styles.reacted, !reacted && showSubtleStyle && styles.borderless, !reacted && showOpaqueBackground && styles.opaqueBackground, fg('platform-component-visual-refresh') && styles.reactionStylesRefresh)
55
53
  }, dataAttributes), /*#__PURE__*/React.createElement(FlashAnimation, {
56
- flash: flash
57
- // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
58
- ,
54
+ flash: flash,
59
55
  className: ax([fg('platform-component-visual-refresh') ? "_2rkolb4i _1e0c1txw _2lx2vrvc _4cvr1h6o _4t3i3698" : "_2rko19bv _1e0c1txw _2lx2vrvc _4cvr1h6o _4t3i3698"]),
60
56
  style: {
61
57
  "--_1ed2mu0": ix("".concat(flashHeight, "px"))
@@ -319,7 +319,15 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
319
319
  isOpen: isPopupTrayOpen,
320
320
  onClose: onClose,
321
321
  triggerRef: triggerRef
322
- }, settings.showFullPicker || hoverableReactionPicker && isHoverableReactionPickerEmojiPickerOpen ? /*#__PURE__*/React.createElement(EmojiPicker, {
322
+ }, settings.showFullPicker || hoverableReactionPicker && isHoverableReactionPickerEmojiPickerOpen ? fg('platform_reaction_full_picker_hover') ? /*#__PURE__*/React.createElement(Box, {
323
+ xcss: additionalStyles.selectorContainer,
324
+ onMouseEnter: handlePopupMouseEnter,
325
+ onMouseLeave: handlePopupMouseLeave
326
+ }, /*#__PURE__*/React.createElement(EmojiPicker, {
327
+ emojiProvider: emojiProvider,
328
+ onSelection: onEmojiSelected,
329
+ size: emojiPickerSize
330
+ })) : /*#__PURE__*/React.createElement(EmojiPicker, {
323
331
  emojiProvider: emojiProvider,
324
332
  onSelection: onEmojiSelected,
325
333
  size: emojiPickerSize
@@ -78,9 +78,7 @@ export var Trigger = /*#__PURE__*/React.forwardRef(function (props, ref) {
78
78
  var renderPressableButton = function renderPressableButton() {
79
79
  return /*#__PURE__*/React.createElement(Pressable, _extends({
80
80
  testId: RENDER_TRIGGER_BUTTON_TESTID,
81
- xcss: cx(styles.trigger, (fullWidthSummaryViewReactionPickerTrigger || fullWidthSelectorTrayReactionPickerTrigger) && styles.fullWidth, subtleReactionsSummaryAndPicker && styles.subtleTrigger, showAddReactionText && styles.expandedTrigger, disabled ? styles.disabledTrigger : showOpaqueBackground ? styles.opaqueEnabledTrigger : styles.transparentEnabledTrigger, miniMode && styles.miniMode,
82
- // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
83
- fg('platform-component-visual-refresh') && styles.triggerStylesRefresh),
81
+ xcss: cx(styles.trigger, (fullWidthSummaryViewReactionPickerTrigger || fullWidthSelectorTrayReactionPickerTrigger) && styles.fullWidth, subtleReactionsSummaryAndPicker && styles.subtleTrigger, showAddReactionText && styles.expandedTrigger, disabled ? styles.disabledTrigger : showOpaqueBackground ? styles.opaqueEnabledTrigger : styles.transparentEnabledTrigger, miniMode && styles.miniMode, fg('platform-component-visual-refresh') && styles.triggerStylesRefresh),
84
82
  style: {
85
83
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/design-system/use-tokens-typography
86
84
  lineHeight: '16px'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/reactions",
3
- "version": "33.2.25",
3
+ "version": "33.3.1",
4
4
  "description": "Reactions component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -37,8 +37,8 @@
37
37
  "@atlaskit/analytics-next": "^11.1.0",
38
38
  "@atlaskit/avatar": "^25.4.0",
39
39
  "@atlaskit/button": "^23.5.0",
40
- "@atlaskit/css": "^0.14.0",
41
- "@atlaskit/emoji": "^69.5.0",
40
+ "@atlaskit/css": "^0.15.0",
41
+ "@atlaskit/emoji": "^69.6.0",
42
42
  "@atlaskit/heading": "^5.2.0",
43
43
  "@atlaskit/icon": "^28.5.0",
44
44
  "@atlaskit/link": "^3.2.0",
@@ -49,12 +49,12 @@
49
49
  "@atlaskit/popper": "^7.1.0",
50
50
  "@atlaskit/popup": "^4.4.0",
51
51
  "@atlaskit/portal": "^5.1.0",
52
- "@atlaskit/primitives": "^14.15.0",
52
+ "@atlaskit/primitives": "^15.0.0",
53
53
  "@atlaskit/react-ufo": "^4.11.0",
54
54
  "@atlaskit/spinner": "^19.0.0",
55
55
  "@atlaskit/tabs": "^18.2.0",
56
56
  "@atlaskit/theme": "^21.0.0",
57
- "@atlaskit/tokens": "^6.4.0",
57
+ "@atlaskit/tokens": "^6.5.0",
58
58
  "@atlaskit/tooltip": "^20.5.0",
59
59
  "@atlaskit/ufo": "^0.4.0",
60
60
  "@atlaskit/util-service-support": "^6.3.0",
@@ -135,6 +135,9 @@
135
135
  },
136
136
  "platform-a11y-remove-autofocus-prop": {
137
137
  "type": "boolean"
138
+ },
139
+ "platform_reaction_full_picker_hover": {
140
+ "type": "boolean"
138
141
  }
139
142
  },
140
143
  "sideEffects": [