@atlaskit/reactions 31.20.0 → 32.0.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 +8 -0
- package/dist/cjs/analytics/index.js +1 -1
- package/dist/cjs/components/ReactionPicker.js +2 -5
- package/dist/cjs/components/ReactionPickerNew.js +2 -5
- package/dist/cjs/components/Trigger.compiled.css +0 -2
- package/dist/cjs/components/Trigger.js +1 -4
- package/dist/es2019/analytics/index.js +1 -1
- package/dist/es2019/components/ReactionPicker.js +2 -4
- package/dist/es2019/components/ReactionPickerNew.js +2 -4
- package/dist/es2019/components/Trigger.compiled.css +0 -2
- package/dist/es2019/components/Trigger.js +1 -3
- package/dist/esm/analytics/index.js +1 -1
- package/dist/esm/components/ReactionPicker.js +2 -5
- package/dist/esm/components/ReactionPickerNew.js +2 -5
- package/dist/esm/components/Trigger.compiled.css +0 -2
- package/dist/esm/components/Trigger.js +1 -4
- package/dist/types/components/ReactionPicker.d.ts +1 -5
- package/dist/types/components/ReactionPickerNew.d.ts +1 -5
- package/dist/types/components/Trigger.d.ts +0 -4
- package/dist/types-ts4.5/components/ReactionPicker.d.ts +1 -5
- package/dist/types-ts4.5/components/ReactionPickerNew.d.ts +1 -5
- package/dist/types-ts4.5/components/Trigger.d.ts +0 -4
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# @atlaskit/reactions
|
|
2
2
|
|
|
3
|
+
## 32.0.0
|
|
4
|
+
|
|
5
|
+
### Major Changes
|
|
6
|
+
|
|
7
|
+
- [#166079](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/166079)
|
|
8
|
+
[`938072fa984ec`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/938072fa984ec) -
|
|
9
|
+
[ux] Removes showRoundTrigger prop and related styling since it is no longer used
|
|
10
|
+
|
|
3
11
|
## 31.20.0
|
|
4
12
|
|
|
5
13
|
### 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 = "
|
|
14
|
+
var packageVersion = "32.0.0";
|
|
15
15
|
/**
|
|
16
16
|
* TODO: move to utility package?
|
|
17
17
|
* A random sampling function
|
|
@@ -78,8 +78,6 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
|
|
|
78
78
|
subtleReactionsSummaryAndPicker = _props$subtleReaction === void 0 ? false : _props$subtleReaction,
|
|
79
79
|
_props$showAddReactio = props.showAddReactionText,
|
|
80
80
|
showAddReactionText = _props$showAddReactio === void 0 ? false : _props$showAddReactio,
|
|
81
|
-
_props$showRoundTrigg = props.showRoundTrigger,
|
|
82
|
-
showRoundTrigger = _props$showRoundTrigg === void 0 ? false : _props$showRoundTrigg,
|
|
83
81
|
reactionPickerTriggerIcon = props.reactionPickerTriggerIcon,
|
|
84
82
|
reactionPickerTriggerText = props.reactionPickerTriggerText,
|
|
85
83
|
reactionPickerPlacement = props.reactionPickerPlacement,
|
|
@@ -120,7 +118,7 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
|
|
|
120
118
|
*/
|
|
121
119
|
var wrapperRef = (0, _react.useRef)(null);
|
|
122
120
|
var updatePopper = (0, _react.useRef)();
|
|
123
|
-
var popperPlacement =
|
|
121
|
+
var popperPlacement = reactionPickerPlacement || 'bottom-start';
|
|
124
122
|
var popperModifiers = [
|
|
125
123
|
/**
|
|
126
124
|
Removing this applyStyle modifier as it throws client errors ref:
|
|
@@ -156,7 +154,7 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
|
|
|
156
154
|
*/
|
|
157
155
|
showFullPicker: !!allowAllEmojis && Array.isArray(pickerQuickReactionEmojiIds) && pickerQuickReactionEmojiIds.length === 0,
|
|
158
156
|
/**
|
|
159
|
-
* Use
|
|
157
|
+
* Use placement for popper based on reactionPickerPlacement prop
|
|
160
158
|
*/
|
|
161
159
|
popperPlacement: popperPlacement
|
|
162
160
|
}),
|
|
@@ -331,7 +329,6 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
|
|
|
331
329
|
showOpaqueBackground: showOpaqueBackground,
|
|
332
330
|
showAddReactionText: showAddReactionText,
|
|
333
331
|
subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
|
|
334
|
-
showRoundTrigger: showRoundTrigger,
|
|
335
332
|
reactionPickerTriggerIcon: reactionPickerTriggerIcon,
|
|
336
333
|
reactionPickerTriggerText: reactionPickerTriggerText,
|
|
337
334
|
isListItem: isListItem
|
|
@@ -79,8 +79,6 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
|
|
|
79
79
|
subtleReactionsSummaryAndPicker = _props$subtleReaction === void 0 ? false : _props$subtleReaction,
|
|
80
80
|
_props$showAddReactio = props.showAddReactionText,
|
|
81
81
|
showAddReactionText = _props$showAddReactio === void 0 ? false : _props$showAddReactio,
|
|
82
|
-
_props$showRoundTrigg = props.showRoundTrigger,
|
|
83
|
-
showRoundTrigger = _props$showRoundTrigg === void 0 ? false : _props$showRoundTrigg,
|
|
84
82
|
reactionPickerTriggerIcon = props.reactionPickerTriggerIcon,
|
|
85
83
|
reactionPickerTriggerText = props.reactionPickerTriggerText,
|
|
86
84
|
reactionPickerPlacement = props.reactionPickerPlacement,
|
|
@@ -121,7 +119,7 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
|
|
|
121
119
|
*/
|
|
122
120
|
var wrapperRef = (0, _react.useRef)(null);
|
|
123
121
|
var updatePopper = (0, _react.useRef)();
|
|
124
|
-
var popperPlacement =
|
|
122
|
+
var popperPlacement = reactionPickerPlacement || 'bottom-start';
|
|
125
123
|
var popperModifiers = [
|
|
126
124
|
/**
|
|
127
125
|
Removing this applyStyle modifier as it throws client errors ref:
|
|
@@ -157,7 +155,7 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
|
|
|
157
155
|
*/
|
|
158
156
|
showFullPicker: !!allowAllEmojis && Array.isArray(pickerQuickReactionEmojiIds) && pickerQuickReactionEmojiIds.length === 0,
|
|
159
157
|
/**
|
|
160
|
-
* Use
|
|
158
|
+
* Use placement for popper based on reactionPickerPlacement prop
|
|
161
159
|
*/
|
|
162
160
|
popperPlacement: popperPlacement
|
|
163
161
|
}),
|
|
@@ -323,7 +321,6 @@ var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(f
|
|
|
323
321
|
showOpaqueBackground: showOpaqueBackground,
|
|
324
322
|
showAddReactionText: showAddReactionText,
|
|
325
323
|
subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
|
|
326
|
-
showRoundTrigger: showRoundTrigger,
|
|
327
324
|
reactionPickerTriggerIcon: reactionPickerTriggerIcon,
|
|
328
325
|
reactionPickerTriggerText: reactionPickerTriggerText,
|
|
329
326
|
isListItem: isListItem
|
|
@@ -13,14 +13,12 @@
|
|
|
13
13
|
._19bvze3t{padding-left:var(--ds-space-0,0)}
|
|
14
14
|
._1bah1h6o{justify-content:center}
|
|
15
15
|
._1bsb1osq{width:100%}
|
|
16
|
-
._1bsbviql{width:2rem}
|
|
17
16
|
._1e0c1txw{display:flex}
|
|
18
17
|
._1ul9146b{min-width:110px}
|
|
19
18
|
._1ul91tcg{min-width:24px}
|
|
20
19
|
._1ul9zwfg{min-width:2pc}
|
|
21
20
|
._4cvr1h6o{align-items:center}
|
|
22
21
|
._4t3i1tcg{height:24px}
|
|
23
|
-
._4t3iviql{height:2rem}
|
|
24
22
|
._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
25
23
|
._bfhksyzs{background-color:var(--ds-background-disabled,#091e4208)}
|
|
26
24
|
._bfhkvuon{background-color:var(--ds-surface,#fff)}
|
|
@@ -21,7 +21,6 @@ var styles = {
|
|
|
21
21
|
subtleTrigger: "_1dqoglyw _1ul91tcg",
|
|
22
22
|
expandedTrigger: "_1ul9146b",
|
|
23
23
|
triggerStylesRefresh: "_2rkoglpi",
|
|
24
|
-
roundTrigger: "_2rko14q2 _4t3iviql _1bsbviql",
|
|
25
24
|
transparentEnabledTrigger: "_1h6dmuej _bfhksm61 _irr3166n _1di61dty",
|
|
26
25
|
opaqueEnabledTrigger: "_1h6dmuej _bfhkvuon _irr3108i _1di61ji5",
|
|
27
26
|
disabledTrigger: "_1h6d13gt _bfhksyzs",
|
|
@@ -69,8 +68,6 @@ var Trigger = exports.Trigger = /*#__PURE__*/_react2.default.forwardRef(function
|
|
|
69
68
|
showAddReactionText = _props$showAddReactio === void 0 ? false : _props$showAddReactio,
|
|
70
69
|
_props$subtleReaction = props.subtleReactionsSummaryAndPicker,
|
|
71
70
|
subtleReactionsSummaryAndPicker = _props$subtleReaction === void 0 ? false : _props$subtleReaction,
|
|
72
|
-
_props$showRoundTrigg = props.showRoundTrigger,
|
|
73
|
-
showRoundTrigger = _props$showRoundTrigg === void 0 ? false : _props$showRoundTrigg,
|
|
74
71
|
reactionPickerTriggerIcon = props.reactionPickerTriggerIcon,
|
|
75
72
|
_props$reactionPicker = props.reactionPickerTriggerText,
|
|
76
73
|
reactionPickerTriggerText = _props$reactionPicker === void 0 ? formatMessage(i18n.addReaction) : _props$reactionPicker,
|
|
@@ -90,7 +87,7 @@ var Trigger = exports.Trigger = /*#__PURE__*/_react2.default.forwardRef(function
|
|
|
90
87
|
testId: RENDER_TRIGGER_BUTTON_TESTID,
|
|
91
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,
|
|
92
89
|
// eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
|
|
93
|
-
(0, _platformFeatureFlags.fg)('platform-component-visual-refresh') && styles.triggerStylesRefresh
|
|
90
|
+
(0, _platformFeatureFlags.fg)('platform-component-visual-refresh') && styles.triggerStylesRefresh),
|
|
94
91
|
style: {
|
|
95
92
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/design-system/use-tokens-typography
|
|
96
93
|
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 = "32.0.0";
|
|
5
5
|
/**
|
|
6
6
|
* TODO: move to utility package?
|
|
7
7
|
* A random sampling function
|
|
@@ -59,7 +59,6 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
|
|
|
59
59
|
showOpaqueBackground = false,
|
|
60
60
|
subtleReactionsSummaryAndPicker = false,
|
|
61
61
|
showAddReactionText = false,
|
|
62
|
-
showRoundTrigger = false,
|
|
63
62
|
reactionPickerTriggerIcon,
|
|
64
63
|
reactionPickerTriggerText,
|
|
65
64
|
reactionPickerPlacement,
|
|
@@ -80,7 +79,7 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
|
|
|
80
79
|
*/
|
|
81
80
|
const wrapperRef = useRef(null);
|
|
82
81
|
const updatePopper = useRef();
|
|
83
|
-
const popperPlacement =
|
|
82
|
+
const popperPlacement = reactionPickerPlacement || 'bottom-start';
|
|
84
83
|
const popperModifiers = [
|
|
85
84
|
/**
|
|
86
85
|
Removing this applyStyle modifier as it throws client errors ref:
|
|
@@ -117,7 +116,7 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
|
|
|
117
116
|
*/
|
|
118
117
|
showFullPicker: !!allowAllEmojis && Array.isArray(pickerQuickReactionEmojiIds) && pickerQuickReactionEmojiIds.length === 0,
|
|
119
118
|
/**
|
|
120
|
-
* Use
|
|
119
|
+
* Use placement for popper based on reactionPickerPlacement prop
|
|
121
120
|
*/
|
|
122
121
|
popperPlacement
|
|
123
122
|
});
|
|
@@ -288,7 +287,6 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
|
|
|
288
287
|
showOpaqueBackground: showOpaqueBackground,
|
|
289
288
|
showAddReactionText: showAddReactionText,
|
|
290
289
|
subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
|
|
291
|
-
showRoundTrigger: showRoundTrigger,
|
|
292
290
|
reactionPickerTriggerIcon: reactionPickerTriggerIcon,
|
|
293
291
|
reactionPickerTriggerText: reactionPickerTriggerText,
|
|
294
292
|
isListItem: isListItem
|
|
@@ -60,7 +60,6 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
|
|
|
60
60
|
showOpaqueBackground = false,
|
|
61
61
|
subtleReactionsSummaryAndPicker = false,
|
|
62
62
|
showAddReactionText = false,
|
|
63
|
-
showRoundTrigger = false,
|
|
64
63
|
reactionPickerTriggerIcon,
|
|
65
64
|
reactionPickerTriggerText,
|
|
66
65
|
reactionPickerPlacement,
|
|
@@ -81,7 +80,7 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
|
|
|
81
80
|
*/
|
|
82
81
|
const wrapperRef = useRef(null);
|
|
83
82
|
const updatePopper = useRef();
|
|
84
|
-
const popperPlacement =
|
|
83
|
+
const popperPlacement = reactionPickerPlacement || 'bottom-start';
|
|
85
84
|
const popperModifiers = [
|
|
86
85
|
/**
|
|
87
86
|
Removing this applyStyle modifier as it throws client errors ref:
|
|
@@ -118,7 +117,7 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
|
|
|
118
117
|
*/
|
|
119
118
|
showFullPicker: !!allowAllEmojis && Array.isArray(pickerQuickReactionEmojiIds) && pickerQuickReactionEmojiIds.length === 0,
|
|
120
119
|
/**
|
|
121
|
-
* Use
|
|
120
|
+
* Use placement for popper based on reactionPickerPlacement prop
|
|
122
121
|
*/
|
|
123
122
|
popperPlacement
|
|
124
123
|
});
|
|
@@ -282,7 +281,6 @@ export const ReactionPicker = /*#__PURE__*/React.memo(props => {
|
|
|
282
281
|
showOpaqueBackground: showOpaqueBackground,
|
|
283
282
|
showAddReactionText: showAddReactionText,
|
|
284
283
|
subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
|
|
285
|
-
showRoundTrigger: showRoundTrigger,
|
|
286
284
|
reactionPickerTriggerIcon: reactionPickerTriggerIcon,
|
|
287
285
|
reactionPickerTriggerText: reactionPickerTriggerText,
|
|
288
286
|
isListItem: isListItem
|
|
@@ -13,14 +13,12 @@
|
|
|
13
13
|
._19bvze3t{padding-left:var(--ds-space-0,0)}
|
|
14
14
|
._1bah1h6o{justify-content:center}
|
|
15
15
|
._1bsb1osq{width:100%}
|
|
16
|
-
._1bsbviql{width:2rem}
|
|
17
16
|
._1e0c1txw{display:flex}
|
|
18
17
|
._1ul9146b{min-width:110px}
|
|
19
18
|
._1ul91tcg{min-width:24px}
|
|
20
19
|
._1ul9zwfg{min-width:2pc}
|
|
21
20
|
._4cvr1h6o{align-items:center}
|
|
22
21
|
._4t3i1tcg{height:24px}
|
|
23
|
-
._4t3iviql{height:2rem}
|
|
24
22
|
._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
25
23
|
._bfhksyzs{background-color:var(--ds-background-disabled,#091e4208)}
|
|
26
24
|
._bfhkvuon{background-color:var(--ds-surface,#fff)}
|
|
@@ -14,7 +14,6 @@ const styles = {
|
|
|
14
14
|
subtleTrigger: "_1dqoglyw _1ul91tcg",
|
|
15
15
|
expandedTrigger: "_1ul9146b",
|
|
16
16
|
triggerStylesRefresh: "_2rkoglpi",
|
|
17
|
-
roundTrigger: "_2rko14q2 _4t3iviql _1bsbviql",
|
|
18
17
|
transparentEnabledTrigger: "_1h6dmuej _bfhksm61 _irr3166n _1di61dty",
|
|
19
18
|
opaqueEnabledTrigger: "_1h6dmuej _bfhkvuon _irr3108i _1di61ji5",
|
|
20
19
|
disabledTrigger: "_1h6d13gt _bfhksyzs",
|
|
@@ -59,7 +58,6 @@ export const Trigger = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
59
58
|
showOpaqueBackground = false,
|
|
60
59
|
showAddReactionText = false,
|
|
61
60
|
subtleReactionsSummaryAndPicker = false,
|
|
62
|
-
showRoundTrigger = false,
|
|
63
61
|
reactionPickerTriggerIcon,
|
|
64
62
|
reactionPickerTriggerText = formatMessage(i18n.addReaction),
|
|
65
63
|
fullWidthSummaryViewReactionPickerTrigger = false,
|
|
@@ -75,7 +73,7 @@ export const Trigger = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
|
75
73
|
testId: RENDER_TRIGGER_BUTTON_TESTID,
|
|
76
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,
|
|
77
75
|
// eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
|
|
78
|
-
fg('platform-component-visual-refresh') && styles.triggerStylesRefresh
|
|
76
|
+
fg('platform-component-visual-refresh') && styles.triggerStylesRefresh),
|
|
79
77
|
style: {
|
|
80
78
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/design-system/use-tokens-typography
|
|
81
79
|
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 = "32.0.0";
|
|
8
8
|
/**
|
|
9
9
|
* TODO: move to utility package?
|
|
10
10
|
* A random sampling function
|
|
@@ -69,8 +69,6 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
|
|
|
69
69
|
subtleReactionsSummaryAndPicker = _props$subtleReaction === void 0 ? false : _props$subtleReaction,
|
|
70
70
|
_props$showAddReactio = props.showAddReactionText,
|
|
71
71
|
showAddReactionText = _props$showAddReactio === void 0 ? false : _props$showAddReactio,
|
|
72
|
-
_props$showRoundTrigg = props.showRoundTrigger,
|
|
73
|
-
showRoundTrigger = _props$showRoundTrigg === void 0 ? false : _props$showRoundTrigg,
|
|
74
72
|
reactionPickerTriggerIcon = props.reactionPickerTriggerIcon,
|
|
75
73
|
reactionPickerTriggerText = props.reactionPickerTriggerText,
|
|
76
74
|
reactionPickerPlacement = props.reactionPickerPlacement,
|
|
@@ -111,7 +109,7 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
|
|
|
111
109
|
*/
|
|
112
110
|
var wrapperRef = useRef(null);
|
|
113
111
|
var updatePopper = useRef();
|
|
114
|
-
var popperPlacement =
|
|
112
|
+
var popperPlacement = reactionPickerPlacement || 'bottom-start';
|
|
115
113
|
var popperModifiers = [
|
|
116
114
|
/**
|
|
117
115
|
Removing this applyStyle modifier as it throws client errors ref:
|
|
@@ -147,7 +145,7 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
|
|
|
147
145
|
*/
|
|
148
146
|
showFullPicker: !!allowAllEmojis && Array.isArray(pickerQuickReactionEmojiIds) && pickerQuickReactionEmojiIds.length === 0,
|
|
149
147
|
/**
|
|
150
|
-
* Use
|
|
148
|
+
* Use placement for popper based on reactionPickerPlacement prop
|
|
151
149
|
*/
|
|
152
150
|
popperPlacement: popperPlacement
|
|
153
151
|
}),
|
|
@@ -322,7 +320,6 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
|
|
|
322
320
|
showOpaqueBackground: showOpaqueBackground,
|
|
323
321
|
showAddReactionText: showAddReactionText,
|
|
324
322
|
subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
|
|
325
|
-
showRoundTrigger: showRoundTrigger,
|
|
326
323
|
reactionPickerTriggerIcon: reactionPickerTriggerIcon,
|
|
327
324
|
reactionPickerTriggerText: reactionPickerTriggerText,
|
|
328
325
|
isListItem: isListItem
|
|
@@ -70,8 +70,6 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
|
|
|
70
70
|
subtleReactionsSummaryAndPicker = _props$subtleReaction === void 0 ? false : _props$subtleReaction,
|
|
71
71
|
_props$showAddReactio = props.showAddReactionText,
|
|
72
72
|
showAddReactionText = _props$showAddReactio === void 0 ? false : _props$showAddReactio,
|
|
73
|
-
_props$showRoundTrigg = props.showRoundTrigger,
|
|
74
|
-
showRoundTrigger = _props$showRoundTrigg === void 0 ? false : _props$showRoundTrigg,
|
|
75
73
|
reactionPickerTriggerIcon = props.reactionPickerTriggerIcon,
|
|
76
74
|
reactionPickerTriggerText = props.reactionPickerTriggerText,
|
|
77
75
|
reactionPickerPlacement = props.reactionPickerPlacement,
|
|
@@ -112,7 +110,7 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
|
|
|
112
110
|
*/
|
|
113
111
|
var wrapperRef = useRef(null);
|
|
114
112
|
var updatePopper = useRef();
|
|
115
|
-
var popperPlacement =
|
|
113
|
+
var popperPlacement = reactionPickerPlacement || 'bottom-start';
|
|
116
114
|
var popperModifiers = [
|
|
117
115
|
/**
|
|
118
116
|
Removing this applyStyle modifier as it throws client errors ref:
|
|
@@ -148,7 +146,7 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
|
|
|
148
146
|
*/
|
|
149
147
|
showFullPicker: !!allowAllEmojis && Array.isArray(pickerQuickReactionEmojiIds) && pickerQuickReactionEmojiIds.length === 0,
|
|
150
148
|
/**
|
|
151
|
-
* Use
|
|
149
|
+
* Use placement for popper based on reactionPickerPlacement prop
|
|
152
150
|
*/
|
|
153
151
|
popperPlacement: popperPlacement
|
|
154
152
|
}),
|
|
@@ -314,7 +312,6 @@ export var ReactionPicker = /*#__PURE__*/React.memo(function (props) {
|
|
|
314
312
|
showOpaqueBackground: showOpaqueBackground,
|
|
315
313
|
showAddReactionText: showAddReactionText,
|
|
316
314
|
subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
|
|
317
|
-
showRoundTrigger: showRoundTrigger,
|
|
318
315
|
reactionPickerTriggerIcon: reactionPickerTriggerIcon,
|
|
319
316
|
reactionPickerTriggerText: reactionPickerTriggerText,
|
|
320
317
|
isListItem: isListItem
|
|
@@ -13,14 +13,12 @@
|
|
|
13
13
|
._19bvze3t{padding-left:var(--ds-space-0,0)}
|
|
14
14
|
._1bah1h6o{justify-content:center}
|
|
15
15
|
._1bsb1osq{width:100%}
|
|
16
|
-
._1bsbviql{width:2rem}
|
|
17
16
|
._1e0c1txw{display:flex}
|
|
18
17
|
._1ul9146b{min-width:110px}
|
|
19
18
|
._1ul91tcg{min-width:24px}
|
|
20
19
|
._1ul9zwfg{min-width:2pc}
|
|
21
20
|
._4cvr1h6o{align-items:center}
|
|
22
21
|
._4t3i1tcg{height:24px}
|
|
23
|
-
._4t3iviql{height:2rem}
|
|
24
22
|
._bfhksm61{background-color:var(--ds-background-neutral-subtle,#00000000)}
|
|
25
23
|
._bfhksyzs{background-color:var(--ds-background-disabled,#091e4208)}
|
|
26
24
|
._bfhkvuon{background-color:var(--ds-surface,#fff)}
|
|
@@ -14,7 +14,6 @@ var styles = {
|
|
|
14
14
|
subtleTrigger: "_1dqoglyw _1ul91tcg",
|
|
15
15
|
expandedTrigger: "_1ul9146b",
|
|
16
16
|
triggerStylesRefresh: "_2rkoglpi",
|
|
17
|
-
roundTrigger: "_2rko14q2 _4t3iviql _1bsbviql",
|
|
18
17
|
transparentEnabledTrigger: "_1h6dmuej _bfhksm61 _irr3166n _1di61dty",
|
|
19
18
|
opaqueEnabledTrigger: "_1h6dmuej _bfhkvuon _irr3108i _1di61ji5",
|
|
20
19
|
disabledTrigger: "_1h6d13gt _bfhksyzs",
|
|
@@ -62,8 +61,6 @@ export var Trigger = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
62
61
|
showAddReactionText = _props$showAddReactio === void 0 ? false : _props$showAddReactio,
|
|
63
62
|
_props$subtleReaction = props.subtleReactionsSummaryAndPicker,
|
|
64
63
|
subtleReactionsSummaryAndPicker = _props$subtleReaction === void 0 ? false : _props$subtleReaction,
|
|
65
|
-
_props$showRoundTrigg = props.showRoundTrigger,
|
|
66
|
-
showRoundTrigger = _props$showRoundTrigg === void 0 ? false : _props$showRoundTrigg,
|
|
67
64
|
reactionPickerTriggerIcon = props.reactionPickerTriggerIcon,
|
|
68
65
|
_props$reactionPicker = props.reactionPickerTriggerText,
|
|
69
66
|
reactionPickerTriggerText = _props$reactionPicker === void 0 ? formatMessage(i18n.addReaction) : _props$reactionPicker,
|
|
@@ -83,7 +80,7 @@ export var Trigger = /*#__PURE__*/React.forwardRef(function (props, ref) {
|
|
|
83
80
|
testId: RENDER_TRIGGER_BUTTON_TESTID,
|
|
84
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,
|
|
85
82
|
// eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
|
|
86
|
-
fg('platform-component-visual-refresh') && styles.triggerStylesRefresh
|
|
83
|
+
fg('platform-component-visual-refresh') && styles.triggerStylesRefresh),
|
|
87
84
|
style: {
|
|
88
85
|
// eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop, @atlaskit/design-system/use-tokens-typography
|
|
89
86
|
lineHeight: '16px'
|
|
@@ -69,11 +69,7 @@ export interface ReactionPickerProps extends Pick<SelectorProps, 'pickerQuickRea
|
|
|
69
69
|
*/
|
|
70
70
|
showAddReactionText?: boolean;
|
|
71
71
|
/**
|
|
72
|
-
* Optional prop for controlling
|
|
73
|
-
*/
|
|
74
|
-
showRoundTrigger?: boolean;
|
|
75
|
-
/**
|
|
76
|
-
* Optional prop for controlling the picker location, gets overrided by showRoundTrigger
|
|
72
|
+
* Optional prop for controlling the picker location
|
|
77
73
|
*/
|
|
78
74
|
reactionPickerPlacement?: Placement;
|
|
79
75
|
/**
|
|
@@ -69,11 +69,7 @@ export interface ReactionPickerProps extends Pick<SelectorProps, 'pickerQuickRea
|
|
|
69
69
|
*/
|
|
70
70
|
showAddReactionText?: boolean;
|
|
71
71
|
/**
|
|
72
|
-
* Optional prop for controlling
|
|
73
|
-
*/
|
|
74
|
-
showRoundTrigger?: boolean;
|
|
75
|
-
/**
|
|
76
|
-
* Optional prop for controlling the picker location, gets overrided by showRoundTrigger
|
|
72
|
+
* Optional prop for controlling the picker location
|
|
77
73
|
*/
|
|
78
74
|
reactionPickerPlacement?: Placement;
|
|
79
75
|
/**
|
|
@@ -47,10 +47,6 @@ export interface TriggerProps {
|
|
|
47
47
|
* Optional prop for applying subtle styling to reaction picker
|
|
48
48
|
*/
|
|
49
49
|
subtleReactionsSummaryAndPicker?: boolean;
|
|
50
|
-
/**
|
|
51
|
-
* Optional prop for controlling if the picker hover border will be rounded
|
|
52
|
-
*/
|
|
53
|
-
showRoundTrigger?: boolean;
|
|
54
50
|
/**
|
|
55
51
|
* Optional prop for controlling icon inside Trigger
|
|
56
52
|
*/
|
|
@@ -69,11 +69,7 @@ export interface ReactionPickerProps extends Pick<SelectorProps, 'pickerQuickRea
|
|
|
69
69
|
*/
|
|
70
70
|
showAddReactionText?: boolean;
|
|
71
71
|
/**
|
|
72
|
-
* Optional prop for controlling
|
|
73
|
-
*/
|
|
74
|
-
showRoundTrigger?: boolean;
|
|
75
|
-
/**
|
|
76
|
-
* Optional prop for controlling the picker location, gets overrided by showRoundTrigger
|
|
72
|
+
* Optional prop for controlling the picker location
|
|
77
73
|
*/
|
|
78
74
|
reactionPickerPlacement?: Placement;
|
|
79
75
|
/**
|
|
@@ -69,11 +69,7 @@ export interface ReactionPickerProps extends Pick<SelectorProps, 'pickerQuickRea
|
|
|
69
69
|
*/
|
|
70
70
|
showAddReactionText?: boolean;
|
|
71
71
|
/**
|
|
72
|
-
* Optional prop for controlling
|
|
73
|
-
*/
|
|
74
|
-
showRoundTrigger?: boolean;
|
|
75
|
-
/**
|
|
76
|
-
* Optional prop for controlling the picker location, gets overrided by showRoundTrigger
|
|
72
|
+
* Optional prop for controlling the picker location
|
|
77
73
|
*/
|
|
78
74
|
reactionPickerPlacement?: Placement;
|
|
79
75
|
/**
|
|
@@ -47,10 +47,6 @@ export interface TriggerProps {
|
|
|
47
47
|
* Optional prop for applying subtle styling to reaction picker
|
|
48
48
|
*/
|
|
49
49
|
subtleReactionsSummaryAndPicker?: boolean;
|
|
50
|
-
/**
|
|
51
|
-
* Optional prop for controlling if the picker hover border will be rounded
|
|
52
|
-
*/
|
|
53
|
-
showRoundTrigger?: boolean;
|
|
54
50
|
/**
|
|
55
51
|
* Optional prop for controlling icon inside Trigger
|
|
56
52
|
*/
|