@atlaskit/reactions 21.2.5 → 21.3.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @atlaskit/reactions
 
+## 21.3.0
+
+### Minor Changes
+
+- [`8db47b60a8f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8db47b60a8f) - [ux] Updated reactions count color to be accessible, pluralize the more emojis tooltip, and stopped the reactions button click event from propagating into the reactions tooltip.
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 21.2.5
 
 ### Patch Changes

package/dist/cjs/components/Counter.js

@@ -31,7 +31,7 @@ exports.counterTestId = counterTestId;
 var countStyle = (0, _core.css)({
   fontSize: 11,
   // TODO: nice to have a theme level token for fontSize
-  color: (0, _tokens.token)('color.text.subtlest', _colors.N90),
+  color: (0, _tokens.token)('color.text.subtlest', _colors.N500),
   overflow: 'hidden',
   position: 'relative',
   padding: '4px 8px 4px 0',

package/dist/cjs/components/Reaction.js

@@ -112,6 +112,7 @@ var ReactionWithoutAnalytics = /*#__PURE__*/function (_PureComponent) {
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "mounted", false);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleMouseDown", function (event) {
       event.preventDefault();
+      event.stopPropagation();
 
       if (_this.props.onClick && (0, _utils.isLeftClick)(event)) {
         var _this$props = _this.props,

package/dist/cjs/components/i18n.js

@@ -14,8 +14,8 @@ var messages = (0, _reactIntlNext.defineMessages)({
     description: 'Message while reactions are being loaded'
   },
   moreEmoji: {
-    id: 'fabric.reactions.more.emoji',
-    defaultMessage: 'More emoji',
+    id: 'fabric.reactions.more.emojis',
+    defaultMessage: 'More emojis',
     description: 'Tooltip of the "show more" button in the quick reaction selector. The full emoji selector is displayed when the user clicks on it.'
   },
   unexpectedError: {

package/dist/cjs/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/reactions",
-	"version": "21.2.5"
+	"version": "21.3.0"
 }

package/dist/es2019/components/Counter.js

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import { jsx, css } from '@emotion/core';
-import { N90, B400 } from '@atlaskit/theme/colors';
+import { N500, B400 } from '@atlaskit/theme/colors';
 import { token } from '@atlaskit/tokens';
 import React, { memo } from 'react';
 import { SlideIn, ExitingPersistence, mediumDurationMs } from '@atlaskit/motion';
@@ -9,7 +9,7 @@ export const counterTestId = 'counter-container';
 export const countStyle = css({
   fontSize: 11,
   // TODO: nice to have a theme level token for fontSize
-  color: token('color.text.subtlest', N90),
+  color: token('color.text.subtlest', N500),
   overflow: 'hidden',
   position: 'relative',
   padding: '4px 8px 4px 0',

package/dist/es2019/components/Reaction.js

@@ -68,6 +68,7 @@ class ReactionWithoutAnalytics extends PureComponent {
 
     _defineProperty(this, "handleMouseDown", event => {
       event.preventDefault();
+      event.stopPropagation();
 
       if (this.props.onClick && isLeftClick(event)) {
         const {

package/dist/es2019/components/i18n.js

@@ -6,8 +6,8 @@ export const messages = defineMessages({
     description: 'Message while reactions are being loaded'
   },
   moreEmoji: {
-    id: 'fabric.reactions.more.emoji',
-    defaultMessage: 'More emoji',
+    id: 'fabric.reactions.more.emojis',
+    defaultMessage: 'More emojis',
     description: 'Tooltip of the "show more" button in the quick reaction selector. The full emoji selector is displayed when the user clicks on it.'
   },
   unexpectedError: {

package/dist/es2019/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/reactions",
-	"version": "21.2.5"
+	"version": "21.3.0"
 }

package/dist/esm/components/Counter.js

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import { jsx, css } from '@emotion/core';
-import { N90, B400 } from '@atlaskit/theme/colors';
+import { N500, B400 } from '@atlaskit/theme/colors';
 import { token } from '@atlaskit/tokens';
 import React, { memo } from 'react';
 import { SlideIn, ExitingPersistence, mediumDurationMs } from '@atlaskit/motion';
@@ -9,7 +9,7 @@ export var counterTestId = 'counter-container';
 export var countStyle = css({
   fontSize: 11,
   // TODO: nice to have a theme level token for fontSize
-  color: token('color.text.subtlest', N90),
+  color: token('color.text.subtlest', N500),
   overflow: 'hidden',
   position: 'relative',
   padding: '4px 8px 4px 0',

package/dist/esm/components/Reaction.js

@@ -86,6 +86,7 @@ var ReactionWithoutAnalytics = /*#__PURE__*/function (_PureComponent) {
 
     _defineProperty(_assertThisInitialized(_this), "handleMouseDown", function (event) {
       event.preventDefault();
+      event.stopPropagation();
 
       if (_this.props.onClick && isLeftClick(event)) {
         var _this$props = _this.props,

package/dist/esm/components/i18n.js

@@ -6,8 +6,8 @@ export var messages = defineMessages({
     description: 'Message while reactions are being loaded'
   },
   moreEmoji: {
-    id: 'fabric.reactions.more.emoji',
-    defaultMessage: 'More emoji',
+    id: 'fabric.reactions.more.emojis',
+    defaultMessage: 'More emojis',
     description: 'Tooltip of the "show more" button in the quick reaction selector. The full emoji selector is displayed when the user clicks on it.'
   },
   unexpectedError: {

package/dist/esm/version.json

@@ -1,4 +1,4 @@
 {
 	"name": "@atlaskit/reactions",
-	"version": "21.2.5"
+	"version": "21.3.0"
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/reactions",
-  "version": "21.2.5",
+  "version": "21.3.0",
   "description": "Reactions component",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -30,7 +30,7 @@
     "@atlaskit/analytics-next": "^8.2.0",
     "@atlaskit/button": "^16.3.0",
     "@atlaskit/ds-lib": "^1.4.0",
-    "@atlaskit/emoji": "^64.5.0",
+    "@atlaskit/emoji": "^64.6.0",
     "@atlaskit/icon": "^21.10.0",
     "@atlaskit/motion": "^1.0.3",
     "@atlaskit/popper": "^5.0.0",