@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 +13 -0
- package/dist/cjs/analytics/index.js +1 -1
- package/dist/cjs/components/ReactionButton.js +2 -6
- package/dist/cjs/components/ReactionPicker.js +9 -1
- package/dist/cjs/components/Trigger.js +1 -3
- package/dist/es2019/analytics/index.js +1 -1
- package/dist/es2019/components/ReactionButton.js +2 -6
- package/dist/es2019/components/ReactionPicker.js +9 -1
- package/dist/es2019/components/Trigger.js +1 -3
- package/dist/esm/analytics/index.js +1 -1
- package/dist/esm/components/ReactionButton.js +2 -6
- package/dist/esm/components/ReactionPicker.js +9 -1
- package/dist/esm/components/Trigger.js +1 -3
- package/package.json +8 -5
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 = "
|
|
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(
|
|
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 = "
|
|
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(
|
|
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 = "
|
|
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(
|
|
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.
|
|
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.
|
|
41
|
-
"@atlaskit/emoji": "^69.
|
|
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": "^
|
|
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.
|
|
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": [
|