@atlaskit/reactions 30.0.6 → 30.0.8

package/dist/cjs/components/ReactionDialog/ReactionsDialogHeader.js

@@ -1,288 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ReactionsDialogHeader = void 0;
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = require("react");
-var _reactIntlNext = require("react-intl-next");
-var _react2 = require("@emotion/react");
-var _tokens = require("@atlaskit/tokens");
-var _modalDialog = require("@atlaskit/modal-dialog");
-var _tabs = require("@atlaskit/tabs");
-var _primitives = require("@atlaskit/primitives");
-var _new = require("@atlaskit/button/new");
-var _heading = _interopRequireDefault(require("@atlaskit/heading"));
-var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
-var _chevronLeft = _interopRequireDefault(require("@atlaskit/icon/utility/chevron-left"));
-var _chevronRight = _interopRequireDefault(require("@atlaskit/icon/utility/chevron-right"));
-var _close = _interopRequireDefault(require("@atlaskit/icon/core/close"));
-var _element = require("@atlaskit/emoji/element");
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _i18n = require("../../shared/i18n");
-var _Counter = require("../Counter");
-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; }
-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; } /**
- * @jsxRuntime classic
- * @jsx jsx
- */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-var REACTIONS_CONTAINER_WIDTH = 56;
-var REACTION_CONTAINER_HEIGHT = 40;
-var containerEdgeAngle = {
-  rightEdge: 270,
-  leftEdge: 90
-};
-var leftNavigationStyle = (0, _primitives.xcss)({
-  marginTop: 'space.050',
-  alignSelf: 'self-start',
-  paddingLeft: 'space.200',
-  paddingBottom: 'space.150'
-});
-var rightNavigationStyle = (0, _primitives.xcss)({
-  marginTop: 'space.050',
-  alignSelf: 'self-start',
-  marginLeft: 'auto',
-  marginRight: 'space.100'
-});
-var fadedCss = function fadedCss(edge, theme) {
-  return (0, _react2.css)({
-    content: '""',
-    position: 'absolute',
-    left: '0px',
-    top: '0px',
-    width: "".concat(REACTIONS_CONTAINER_WIDTH, "px"),
-    height: "".concat(REACTION_CONTAINER_HEIGHT, "px"),
-    zIndex: 0,
-    background:
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    theme === 'dark' ? "linear-gradient(".concat(containerEdgeAngle[edge], "deg, rgba(34, 39, 43, 0.95) 40.23%, rgba(34, 39, 43, 0.55) 58.33%, rgba(34, 39, 43, 0) 77.49%)") : "linear-gradient(".concat(containerEdgeAngle[edge], "deg, rgba(255, 255, 255, 0.95) 40.23%, rgba(255, 255, 255, 0.55) 58.33%, rgba(255, 255, 255, 0) 77.49%)")
-  });
-};
-var customTabListStyles = (0, _react2.css)({
-  overflow: 'auto',
-  display: 'flex',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  'div[role=tablist]': {
-    flexGrow: 1,
-    // paddingInline exists to maintain styling prior to @atlaskit/tabs update that removed baked in horizontal padding
-    paddingInline: "var(--ds-space-100, 8px)",
-    // we add our own border bottom below since tablist border is not full width
-    '&::before': {
-      backgroundColor: 'transparent'
-    }
-  },
-  width: ' 100%',
-  alignItems: 'flex-start',
-  borderBottom: "1px solid ".concat("var(--ds-border, #EBECF0)")
-});
-var customTabWrapper = function customTabWrapper(theme) {
-  return (0, _react2.css)({
-    flexShrink: 0,
-    display: 'flex',
-    flexDirection: 'column',
-    textAlign: 'center',
-    alignItems: 'center',
-    justifyContent: 'center',
-    minWidth: "".concat(REACTIONS_CONTAINER_WIDTH, "px"),
-    boxSizing: 'border-box',
-    position: 'relative',
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-    '> div': {
-      minWidth: "".concat(REACTIONS_CONTAINER_WIDTH, "px"),
-      minHeight: "".concat(REACTION_CONTAINER_HEIGHT, "px"),
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-important-styles -- Ignored via go/DSP-18766
-      padding: '0px !important',
-      alignItems: 'center',
-      justifyContent: 'center'
-    },
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-    '& > span': {
-      minHeight: '16px',
-      minWidth: '16px'
-    },
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    '&.disabled:after': fadedCss('rightEdge', theme),
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    '&.disabled + &.disabled:after': fadedCss('leftEdge', theme)
-  });
-};
-var firstElement = (0, _react2.css)({
-  paddingLeft: "var(--ds-space-200, 16px)"
-});
-var fullWidthStyle = (0, _primitives.xcss)({
-  width: '100%',
-  padding: 'space.300',
-  paddingBlockEnd: 'space.400'
-});
-var emojiStyles = (0, _primitives.xcss)({
-  transformOrigin: 'center center 0',
-  paddingInlineStart: 'space.100',
-  paddingBlock: 'space.050',
-  paddingInlineEnd: 'space.050'
-});
-var counterStyle = (0, _primitives.xcss)({
-  marginTop: 'space.025'
-});
-var CloseButtonCustom = function CloseButtonCustom(_ref) {
-  var handleCloseReactionsDialog = _ref.handleCloseReactionsDialog;
-  var intl = (0, _reactIntlNext.useIntl)();
-  return (0, _react2.jsx)(_new.IconButton, {
-    onClick: handleCloseReactionsDialog,
-    icon: _close.default,
-    label: intl.formatMessage(_i18n.messages.closeReactionsDialog),
-    appearance: "subtle",
-    isTooltipDisabled: false
-  });
-};
-var LeftNavigationButton = function LeftNavigationButton(_ref2) {
-  var handlePreviousPage = _ref2.handlePreviousPage;
-  var intl = (0, _reactIntlNext.useIntl)();
-  return (0, _react2.jsx)(_primitives.Flex, {
-    xcss: leftNavigationStyle
-  }, (0, _react2.jsx)(_new.IconButton, {
-    spacing: "compact",
-    onClick: handlePreviousPage,
-    icon: _chevronLeft.default,
-    label: intl.formatMessage(_i18n.messages.leftNavigateLabel),
-    isTooltipDisabled: false
-  }));
-};
-var RightNavigationButton = function RightNavigationButton(_ref3) {
-  var handleNextPage = _ref3.handleNextPage;
-  var intl = (0, _reactIntlNext.useIntl)();
-  return (0, _react2.jsx)(_primitives.Flex, {
-    xcss: rightNavigationStyle
-  }, (0, _react2.jsx)(_new.IconButton, {
-    spacing: "compact",
-    onClick: handleNextPage,
-    icon: _chevronRight.default,
-    label: intl.formatMessage(_i18n.messages.rightNavigateLabel),
-    isTooltipDisabled: false
-  }));
-};
-var ReactionsDialogHeader = exports.ReactionsDialogHeader = function ReactionsDialogHeader(_ref4) {
-  var totalReactionsCount = _ref4.totalReactionsCount,
-    handlePreviousPage = _ref4.handlePreviousPage,
-    handleNextPage = _ref4.handleNextPage,
-    currentPage = _ref4.currentPage,
-    maxPages = _ref4.maxPages,
-    currentReactions = _ref4.currentReactions,
-    emojiProvider = _ref4.emojiProvider,
-    handleCloseReactionsDialog = _ref4.handleCloseReactionsDialog;
-  var _useState = (0, _react.useState)({}),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    cache = _useState2[0],
-    setCache = _useState2[1];
-  var _useModal = (0, _modalDialog.useModal)(),
-    titleId = _useModal.titleId;
-  var intl = (0, _reactIntlNext.useIntl)();
-  var _useThemeObserver = (0, _tokens.useThemeObserver)(),
-    colorMode = _useThemeObserver.colorMode;
-  var isSinglePage = maxPages === 1;
-  var isOnFirstPage = currentPage === 1;
-  var isOnLastPage = currentPage === maxPages;
-  var handleMouseEnter = function handleMouseEnter(reaction) {
-    var emojiId = reaction.emojiId;
-    if (!emojiId || cache[emojiId]) {
-      return;
-    }
-    (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
-      var provider, emoji, capitalizedName;
-      return _regenerator.default.wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            _context.next = 2;
-            return emojiProvider;
-          case 2:
-            provider = _context.sent;
-            _context.next = 5;
-            return provider.findByEmojiId({
-              shortName: '',
-              id: emojiId
-            });
-          case 5:
-            emoji = _context.sent;
-            if (emoji !== null && emoji !== void 0 && emoji.name) {
-              // capitalize first letter of each string
-              capitalizedName = emoji.name.replace(/\b\w/g, function (char) {
-                return char.toUpperCase();
-              });
-              setCache(function (prevCache) {
-                return _objectSpread(_objectSpread({}, prevCache), {}, (0, _defineProperty2.default)({}, emojiId, capitalizedName));
-              });
-            }
-          case 7:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee);
-    }))();
-  };
-  return (0, _react2.jsx)(_primitives.Stack, null, (0, _react2.jsx)(_primitives.Flex, {
-    direction: "row",
-    justifyContent: "space-between",
-    alignItems: "center",
-    xcss: fullWidthStyle
-  }, (0, _react2.jsx)(_heading.default, {
-    size: "medium",
-    id: titleId
-  }, intl.formatMessage(_i18n.messages.reactionsCount, {
-    count: totalReactionsCount
-  })), (0, _platformFeatureFlags.fg)('platform-make-accessible-close-button') ? (0, _react2.jsx)(_modalDialog.CloseButton, {
-    onClick: handleCloseReactionsDialog
-  }) : (0, _react2.jsx)(CloseButtonCustom, {
-    handleCloseReactionsDialog: handleCloseReactionsDialog
-  })), (0, _react2.jsx)(_primitives.Inline, null, (0, _react2.jsx)("div", {
-    css: customTabListStyles,
-    id: "reactions-dialog-tabs-list"
-  }, !isSinglePage && !isOnFirstPage && (0, _react2.jsx)(LeftNavigationButton, {
-    handlePreviousPage: handlePreviousPage
-  }), (0, _react2.jsx)(_tabs.TabList, null, currentReactions.map(function (reaction, index) {
-    var emojiId = {
-      id: reaction.emojiId,
-      shortName: ''
-    };
-    return (
-      // eslint-disable-next-line jsx-a11y/no-static-element-interactions
-      (0, _react2.jsx)("div", {
-        // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-        css: [customTabWrapper(colorMode), index === 0 ? firstElement : []]
-        // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-        ,
-        className: "reaction-elements",
-        key: reaction.emojiId,
-        "data-testid": emojiId === null || emojiId === void 0 ? void 0 : emojiId.id,
-        onMouseEnter: function onMouseEnter() {
-          handleMouseEnter(reaction);
-        }
-      }, (0, _react2.jsx)(_tabs.Tab, null, (0, _react2.jsx)(_tooltip.default, {
-        content: cache[reaction.emojiId],
-        canAppear: function canAppear() {
-          return !!cache[reaction.emojiId];
-        }
-      }, (0, _react2.jsx)(_primitives.Flex, {
-        justifyContent: "center",
-        alignItems: "center",
-        direction: "row"
-      }, (0, _react2.jsx)(_primitives.Box, {
-        xcss: emojiStyles
-      }, (0, _react2.jsx)(_element.ResourcedEmoji, {
-        emojiProvider: emojiProvider,
-        emojiId: emojiId,
-        fitToHeight: 16,
-        showTooltip: true
-      })), (0, _react2.jsx)(_primitives.Box, {
-        xcss: counterStyle
-      }, (0, _react2.jsx)(_Counter.Counter, {
-        value: reaction.count
-      }))))))
-    );
-  }), !isSinglePage && !isOnLastPage && (0, _react2.jsx)(RightNavigationButton, {
-    handleNextPage: handleNextPage
-  })))));
-};

package/dist/cjs/components/ReactionDialog/ReactionsDialogTrigger.js

@@ -1,49 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ReactionsDialogTrigger = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
-var _primitives = require("@atlaskit/primitives");
-var _showMoreHorizontal = _interopRequireDefault(require("@atlaskit/icon/core/show-more-horizontal"));
-var _reactIntlNext = require("react-intl-next");
-var _i18n = require("../../shared/i18n");
-var triggerStyles = (0, _primitives.xcss)({
-  marginRight: 'space.050',
-  marginTop: 'space.050',
-  minWidth: '32px',
-  height: '24px',
-  borderRadius: 'border.radius.100',
-  display: 'flex',
-  justifyContent: 'center',
-  alignItems: 'center'
-});
-var transparentEnabledTriggerStyles = (0, _primitives.xcss)({
-  borderColor: 'color.border',
-  ':hover': {
-    backgroundColor: 'color.background.neutral.subtle.hovered'
-  },
-  ':active': {
-    backgroundColor: 'color.background.neutral.subtle.pressed'
-  }
-});
-// Currently not in use due to Reactions Dialog trigger being moved to tooltip
-// Similar to platform/packages/elements/reactions/src/components/Trigger/Trigger.tsx
-var ReactionsDialogTrigger = exports.ReactionsDialogTrigger = function ReactionsDialogTrigger(_ref) {
-  var onClick = _ref.onClick;
-  var intl = (0, _reactIntlNext.useIntl)();
-  return /*#__PURE__*/_react.default.createElement(_primitives.Pressable, {
-    xcss: [triggerStyles, transparentEnabledTriggerStyles],
-    backgroundColor: "color.background.neutral.subtle",
-    padding: "space.0",
-    onClick: onClick,
-    "aria-label": intl.formatMessage(_i18n.messages.seeWhoReactedTooltip)
-  }, /*#__PURE__*/_react.default.createElement(_tooltip.default, {
-    content: intl.formatMessage(_i18n.messages.seeWhoReactedTooltip)
-  }, /*#__PURE__*/_react.default.createElement(_showMoreHorizontal.default, {
-    label: intl.formatMessage(_i18n.messages.seeWhoReacted)
-  })));
-};

package/dist/cjs/components/ReactionDialog/ReactionsList.js

@@ -1,31 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ReactionsList = void 0;
-var _react = require("@emotion/react");
-var _primitives = require("@atlaskit/primitives");
-var _ReactionView = require("./ReactionView");
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
-var ReactionsList = exports.ReactionsList = function ReactionsList(_ref) {
-  var reactions = _ref.reactions,
-    selectedEmojiId = _ref.selectedEmojiId,
-    ProfileCardWrapper = _ref.ProfileCardWrapper;
-  return (0, _react.jsx)(_primitives.Box, null, reactions.map(function (reaction) {
-    if (reaction.emojiId === selectedEmojiId) {
-      return (0, _react.jsx)(_ReactionView.ReactionView, {
-        key: reaction.emojiId,
-        reaction: reaction,
-        ProfileCardWrapper: ProfileCardWrapper
-      });
-    } else {
-      return null;
-    }
-  }));
-};

package/dist/cjs/components/ReactionDialog/index.js

@@ -1,12 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "ReactionsDialog", {
-  enumerable: true,
-  get: function get() {
-    return _ReactionsDialog.ReactionsDialog;
-  }
-});
-var _ReactionsDialog = require("./ReactionsDialog");

package/dist/cjs/components/ReactionDialog/styles.js

@@ -1,86 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.userStyle = exports.userListStyle = exports.navigationContainerStyle = exports.customTabListStyles = exports.containerStyle = void 0;
-var _react = require("@emotion/react");
-var _colors = require("@atlaskit/theme/colors");
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
-/*Reactions Container. Using pseudo Element :after to set border since with onClick of Reaction to higlight the
-border blue below the reaction. Setting Border Width based on number of reactions to make sure it shows up
-in case the container overflows */
-var containerStyle = exports.containerStyle = function containerStyle(reactionsBorderWidth) {
-  return (0, _react.css)({
-    overflow: 'hidden',
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    height: '100%',
-    display: 'flex',
-    justifyContent: 'start',
-    position: 'relative',
-    scrollBehavior: 'smooth',
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-    '&:after': {
-      content: '""',
-      zIndex: 0,
-      display: 'block',
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-      minWidth: "".concat(reactionsBorderWidth, "%"),
-      bottom: '0px',
-      position: 'absolute'
-    }
-  });
-};
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-var navigationContainerStyle = exports.navigationContainerStyle = (0, _react.css)({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '> button': {
-    cursor: 'pointer'
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-  'button:last-child': {
-    marginLeft: "var(--ds-space-200, 16px)"
-  }
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-var userListStyle = exports.userListStyle = (0, _react.css)({
-  listStyle: 'none',
-  marginTop: "var(--ds-space-200, 16px)",
-  padding: 0,
-  textAlign: 'left',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  li: {
-    color: "".concat("var(--ds-text, ".concat(_colors.N500, ")")),
-    font: "var(--ds-font-body, normal 400 14px/20px ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Ubuntu, \"Helvetica Neue\", sans-serif)"
-  }
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-var userStyle = exports.userStyle = (0, _react.css)({
-  display: 'flex',
-  alignItems: 'center',
-  padding: "var(--ds-space-050, 4px)".concat(" 0px ", "var(--ds-space-050, 4px)", " 0px"),
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '> span': {
-    marginLeft: "var(--ds-space-200, 16px)"
-  }
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-var customTabListStyles = exports.customTabListStyles = (0, _react.css)({
-  overflow: 'auto',
-  display: 'flex',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  'div[role=tablist]': {
-    flexGrow: 1,
-    // paddingInline exists to maintain styling prior to @atlaskit/tabs update that removed baked in horizontal padding
-    paddingInline: "var(--ds-space-100, 8px)"
-  }
-});

package/dist/cjs/components/ReactionParticleEffect/ReactionParticleEffect.js

@@ -1,41 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ReactionParticleEffect = exports.PARTICLE_COUNT = void 0;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _emoji = require("@atlaskit/emoji");
-var _react = require("@emotion/react");
-var _styles = require("./styles");
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
-var PARTICLE_COUNT = exports.PARTICLE_COUNT = 4;
-var ReactionParticleEffect = exports.ReactionParticleEffect = function ReactionParticleEffect(_ref) {
-  var emojiProvider = _ref.emojiProvider,
-    emojiId = _ref.emojiId;
-  return (
-    // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-    (0, _react.jsx)("div", {
-      css: _styles.containerStyle
-    }, (0, _toConsumableArray2.default)(Array(PARTICLE_COUNT)).map(function (_, index) {
-      return (
-        // eslint-disable-next-line @atlaskit/design-system/consistent-css-prop-usage, @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
-        (0, _react.jsx)("div", {
-          key: index,
-          css: _styles.reactionParticleStyle
-        }, (0, _react.jsx)(_emoji.ResourcedEmoji, {
-          emojiProvider: emojiProvider,
-          emojiId: emojiId,
-          fitToHeight: 16
-        }))
-      );
-    }))
-  );
-};

package/dist/cjs/components/ReactionParticleEffect/index.js

@@ -1,12 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "ReactionParticleEffect", {
-  enumerable: true,
-  get: function get() {
-    return _ReactionParticleEffect.ReactionParticleEffect;
-  }
-});
-var _ReactionParticleEffect = require("./ReactionParticleEffect");

package/dist/cjs/components/ReactionParticleEffect/styles.js

@@ -1,70 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.reactionParticleStyle = exports.containerStyle = void 0;
-var _constants = require("@atlaskit/theme/constants");
-var _react = require("@emotion/react");
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
-var fade = (0, _react.keyframes)({
-  '0%': {
-    opacity: 0
-  },
-  '20%': {
-    opacity: 1
-  },
-  '60%': {
-    opacity: 1
-  },
-  '100%': {
-    opacity: 0
-  }
-});
-var float = (0, _react.keyframes)({
-  '0%': {
-    transform: 'translateY(0) scale(1)'
-  },
-  '100%': {
-    transform: 'translateY(-120px) scale(1.7)'
-  }
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-var containerStyle = exports.containerStyle = (0, _react.css)({
-  position: 'relative',
-  left: 8,
-  // Ensure the effect displays above tooltips
-  zIndex: _constants.layers.tooltip() + 1,
-  '@media (prefers-reduced-motion: reduce)': {
-    opacity: 0
-  }
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-var reactionParticleStyle = exports.reactionParticleStyle = (0, _react.css)({
-  position: 'absolute',
-  top: 0,
-  left: 0,
-  pointerEvents: 'none',
-  opacity: 0,
-  animation: "".concat(fade, " ease-in-out, ").concat(float, " ease"),
-  animationDuration: '700ms',
-  // Override position and delay for each particle
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-  ':nth-child(2)': {
-    left: -5,
-    animationDelay: '0.15s'
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-  ':nth-child(3)': {
-    left: 8,
-    animationDelay: '0.3s'
-  },
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-  ':nth-child(4)': {
-    left: -1,
-    animationDelay: '0.45s'
-  }
-});