@atlaskit/reactions 30.0.6 → 30.0.8

package/dist/cjs/components/ReactionPicker/ReactionPicker.js

@@ -1,321 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ReactionPicker = exports.RENDER_REACTIONPICKER_TESTID = exports.RENDER_REACTIONPICKERPANEL_TESTID = exports.PopperWrapper = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _react2 = require("@emotion/react");
-var _reactIntlNext = require("react-intl-next");
-var _picker = require("@atlaskit/emoji/picker");
-var _popper = require("@atlaskit/popper");
-var _constants = require("@atlaskit/theme/constants");
-var _useCloseManager = require("../../hooks/useCloseManager");
-var _useFocusTrap = require("../../hooks/useFocusTrap");
-var _i18n = require("../../shared/i18n");
-var _ufo = require("../../ufo");
-var _Selector = require("../Selector");
-var _Trigger = require("../Trigger");
-var _styles = require("./styles");
-var _RepositionOnUpdate = require("./RepositionOnUpdate");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-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
-/**
- * Test id for wrapper ReactionPicker div
- */
-var RENDER_REACTIONPICKER_TESTID = exports.RENDER_REACTIONPICKER_TESTID = 'reactionPicker-testid';
-
-/**
- * Test id for ReactionPicker panel div
- */
-var RENDER_REACTIONPICKERPANEL_TESTID = exports.RENDER_REACTIONPICKERPANEL_TESTID = 'reactionPickerPanel-testid';
-
-/**
- * Emoji Picker Controller Id for Accessibility Labels
- */
-var PICKER_CONTROL_ID = 'emoji-picker';
-/**
- * Picker component for adding reactions
- */
-var ReactionPicker = exports.ReactionPicker = /*#__PURE__*/_react.default.memo(function (props) {
-  var miniMode = props.miniMode,
-    className = props.className,
-    emojiProvider = props.emojiProvider,
-    onSelection = props.onSelection,
-    allowAllEmojis = props.allowAllEmojis,
-    disabled = props.disabled,
-    pickerQuickReactionEmojiIds = props.pickerQuickReactionEmojiIds,
-    _props$onShowMore = props.onShowMore,
-    onShowMore = _props$onShowMore === void 0 ? function () {} : _props$onShowMore,
-    _props$onOpen = props.onOpen,
-    onOpen = _props$onOpen === void 0 ? function () {} : _props$onOpen,
-    _props$onCancel = props.onCancel,
-    onCancel = _props$onCancel === void 0 ? function () {} : _props$onCancel,
-    _props$tooltipContent = props.tooltipContent,
-    tooltipContent = _props$tooltipContent === void 0 ? (0, _react2.jsx)(_reactIntlNext.FormattedMessage, _i18n.messages.addReaction) : _props$tooltipContent,
-    emojiPickerSize = props.emojiPickerSize,
-    _props$showOpaqueBack = props.showOpaqueBackground,
-    showOpaqueBackground = _props$showOpaqueBack === void 0 ? false : _props$showOpaqueBack,
-    _props$subtleReaction = props.subtleReactionsSummaryAndPicker,
-    subtleReactionsSummaryAndPicker = _props$subtleReaction === void 0 ? false : _props$subtleReaction,
-    _props$showAddReactio = props.showAddReactionText,
-    showAddReactionText = _props$showAddReactio === void 0 ? false : _props$showAddReactio,
-    reactionPickerTriggerIcon = props.reactionPickerTriggerIcon,
-    reactionPickerPlacement = props.reactionPickerPlacement,
-    reactionsPickerPreventOverflowOptions = props.reactionsPickerPreventOverflowOptions;
-  var _useState = (0, _react.useState)(null),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    triggerRef = _useState2[0],
-    setTriggerRef = _useState2[1];
-
-  /**
-   * Container <div /> reference (used by custom hook to detect click outside)
-   */
-  var wrapperRef = (0, _react.useRef)(null);
-  var updatePopper = (0, _react.useRef)();
-  var popperPlacement = reactionPickerPlacement || 'bottom-start';
-  var popperModifiers = [
-  /**
-    Removing this applyStyle modifier as it throws client errors ref:
-   https://popper.js.org/docs/v1/#modifiers
-   https://popper.js.org/docs/v1/#modifiers..applyStyle
-   { name: 'applyStyle', enabled: false },
-    */
-  {
-    name: 'hide',
-    enabled: false
-  }, {
-    name: 'offset',
-    enabled: true,
-    options: {
-      offset: [0, 0]
-    }
-  }, {
-    name: 'flip',
-    enabled: true,
-    options: {
-      flipVariations: true,
-      boundariesElement: 'scrollParent'
-    }
-  }, _objectSpread({
-    name: 'preventOverflow',
-    enabled: true
-  }, reactionsPickerPreventOverflowOptions && {
-    options: reactionsPickerPreventOverflowOptions
-  })];
-  var _useState3 = (0, _react.useState)({
-      /**
-       * Show the picker floating panel
-       */
-      isOpen: false,
-      /**
-       * Show the full custom emoji list picker or the default list of emojis
-       */
-      showFullPicker: !!allowAllEmojis && Array.isArray(pickerQuickReactionEmojiIds) && pickerQuickReactionEmojiIds.length === 0,
-      /**
-       * Placement for popper
-       */
-      popperPlacement: popperPlacement
-    }),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    settings = _useState4[0],
-    setSettings = _useState4[1];
-
-  /**
-   * Custom hook triggers when user clicks outside the reactions picker
-   */
-  (0, _useCloseManager.useCloseManager)(wrapperRef, function (callbackType) {
-    close();
-    onCancel();
-    if (triggerRef && callbackType === 'ESCAPE') {
-      requestAnimationFrame(function () {
-        return triggerRef.focus();
-      });
-    }
-  }, true, settings.isOpen);
-
-  /**
-   * Event callback when the picker is closed
-   * @param _id Optional id if an emoji button was selected or undefineed if was clicked outside the picker
-   */
-  var close = (0, _react.useCallback)(function (_id) {
-    setSettings(_objectSpread(_objectSpread({}, settings), {}, {
-      isOpen: false
-    }));
-    // ufo abort reaction experience
-    _ufo.PickerRender.abort({
-      metadata: {
-        emojiId: _id,
-        source: 'ReactionPicker',
-        reason: 'close dialog'
-      }
-    });
-  }, [settings]);
-
-  /**
-   * Event handle rwhen selecting to show the custom emoji icons picker
-   * @param e event param
-   */
-  var onSelectMoreClick = (0, _react.useCallback)(function (e) {
-    e.preventDefault();
-    setSettings({
-      isOpen: true,
-      showFullPicker: true,
-      popperPlacement: popperPlacement
-    });
-    onShowMore();
-  }, [onShowMore, popperPlacement]);
-
-  /**
-   * Event callback when an emoji icon is selected
-   * @param item selected item
-   */
-  var onEmojiSelected = (0, _react.useCallback)(function (item) {
-    // no emoji was selected
-    if (!item.id) {
-      return;
-    }
-    onSelection(item.id, settings.showFullPicker ? 'emojiPicker' : 'quickSelector');
-    close(item.id);
-  }, [close, onSelection, settings.showFullPicker]);
-
-  /**
-   * Event handler when the emoji icon to open the custom picker is selected
-   */
-  var onTriggerClick = function onTriggerClick() {
-    // ufo start reactions picker open experience
-    _ufo.PickerRender.start();
-    setSettings({
-      isOpen: !settings.isOpen,
-      showFullPicker: !!allowAllEmojis && Array.isArray(pickerQuickReactionEmojiIds) && pickerQuickReactionEmojiIds.length === 0,
-      popperPlacement: popperPlacement
-    });
-    onOpen();
-    // ufo reactions picker opened success
-    _ufo.PickerRender.success();
-  };
-  var wrapperClassName = " ".concat(settings.isOpen ? 'isOpen' : '', " ").concat(miniMode ? 'miniMode' : '', " ").concat(className);
-  (0, _react.useLayoutEffect)(function () {
-    var _updatePopper$current;
-    (_updatePopper$current = updatePopper.current) === null || _updatePopper$current === void 0 || _updatePopper$current.call(updatePopper);
-  }, [settings]);
-  return (0, _react2.jsx)("div", {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    className: wrapperClassName
-    // 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: _styles.pickerStyle,
-    "data-testid": RENDER_REACTIONPICKER_TESTID,
-    ref: wrapperRef
-  }, (0, _react2.jsx)(_popper.Manager, null, (0, _react2.jsx)(_popper.Reference, null, function (_ref) {
-    var _ref2 = _ref.ref;
-    return (
-      // Render a button to open the <Selector /> panel
-      (0, _react2.jsx)(_Trigger.Trigger, {
-        ariaAttributes: {
-          'aria-expanded': settings.isOpen,
-          'aria-controls': PICKER_CONTROL_ID
-        },
-        ref: function ref(node) {
-          if (node && settings.isOpen) {
-            if (typeof _ref2 === 'function') {
-              _ref2(node);
-            } else {
-              _ref2.current = node;
-            }
-            setTriggerRef(node);
-          }
-        },
-        onClick: onTriggerClick,
-        miniMode: miniMode,
-        disabled: disabled,
-        tooltipContent: settings.isOpen ? null : tooltipContent,
-        showOpaqueBackground: showOpaqueBackground,
-        showAddReactionText: showAddReactionText,
-        subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
-        reactionPickerTriggerIcon: reactionPickerTriggerIcon
-      })
-    );
-  }), settings.isOpen && (0, _react2.jsx)(PopperWrapper, {
-    settings: settings,
-    popperModifiers: popperModifiers
-  }, settings.showFullPicker ? (0, _react2.jsx)(_picker.EmojiPicker, {
-    emojiProvider: emojiProvider,
-    onSelection: onEmojiSelected,
-    size: emojiPickerSize
-  }) :
-  // 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, _react2.jsx)("div", {
-    css: _styles.contentStyle
-  }, (0, _react2.jsx)(_Selector.Selector, {
-    emojiProvider: emojiProvider,
-    onSelection: onEmojiSelected,
-    showMore: allowAllEmojis,
-    onMoreClick: onSelectMoreClick,
-    pickerQuickReactionEmojiIds: pickerQuickReactionEmojiIds
-  })))));
-});
-var PopperWrapper = exports.PopperWrapper = function PopperWrapper(props) {
-  var settings = props.settings,
-    children = props.children,
-    popperModifiers = props.popperModifiers;
-  var _useState5 = (0, _react.useState)(null),
-    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
-    popupRef = _useState6[0],
-    setPopupRef = _useState6[1];
-  /**
-   * add focus lock to popup
-   */
-  (0, _useFocusTrap.useFocusTrap)({
-    initialFocusRef: null,
-    targetRef: popupRef
-  });
-  return (0, _react2.jsx)(_popper.Popper, {
-    placement: settings.popperPlacement,
-    modifiers: popperModifiers,
-    strategy: "absolute"
-  }, function (_ref3) {
-    var _ref4 = _ref3.ref,
-      style = _ref3.style,
-      update = _ref3.update;
-    return (0, _react2.jsx)("div", {
-      id: PICKER_CONTROL_ID,
-      "data-testid": RENDER_REACTIONPICKERPANEL_TESTID
-      // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop -- Ignored via go/DSP-18766
-      ,
-      style: _objectSpread({
-        zIndex: _constants.layers.layer()
-      }, style),
-      ref: function ref(node) {
-        if (node) {
-          if (typeof _ref4 === 'function') {
-            _ref4(node);
-          } else {
-            _ref4.current = node;
-          }
-          setPopupRef(node);
-        }
-      }
-      // 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: _styles.popupWrapperStyle
-      // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
-      ,
-      tabIndex: 0
-    }, (0, _react2.jsx)(_RepositionOnUpdate.RepositionOnUpdate, {
-      update: update,
-      settings: settings
-    }, (0, _react2.jsx)("div", {
-      css: _styles.popupStyle
-    }, children)));
-  });
-};

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

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

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

@@ -1,51 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.popupWrapperStyle = exports.popupStyle = exports.pickerStyle = exports.contentStyle = void 0;
-var _react = require("@emotion/react");
-var _constants = require("@atlaskit/theme/constants");
-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
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-var pickerStyle = exports.pickerStyle = (0, _react.css)({
-  verticalAlign: 'middle',
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '&.miniMode': {
-    display: 'inline-block'
-  }
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-var contentStyle = exports.contentStyle = (0, _react.css)({
-  display: 'flex'
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-var popupWrapperStyle = exports.popupWrapperStyle = (0, _react.css)({
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
-  ':focus': {
-    outline: 'none'
-  }
-});
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-var popupStyle = exports.popupStyle = (0, _react.css)({
-  background: "var(--ds-surface-overlay, ".concat(_colors.N0, ")"),
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  borderRadius: "".concat((0, _constants.borderRadius)(), "px"),
-  boxShadow: "var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(_colors.N50A, ", 0 0 1px ").concat(_colors.N60A), ")"),
-  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors -- Ignored via go/DSP-18766
-  '&> div': {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-    boxShadow: undefined,
-    marginTop: "var(--ds-space-050, 4px)",
-    marginBottom: "var(--ds-space-050, 4px)"
-  }
-});

package/dist/cjs/components/ReactionSummary/ReactionSummaryButton.js

@@ -1,130 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ReactionSummaryButton = exports.RENDER_SUMMARY_EMOJI_TESTID = exports.RENDER_SUMMARY_BUTTON_TESTID = void 0;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactIntlNext = require("react-intl-next");
-var _emoji = require("@atlaskit/emoji");
-var _primitives = require("@atlaskit/primitives");
-var _i18n = require("../../shared/i18n");
-var _Counter = require("../Counter");
-var _Reaction = require("../Reaction");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-var emojiStyle = (0, _primitives.xcss)({
-  transformOrigin: 'center center 0',
-  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
-  lineHeight: '12px'
-});
-var buttonStyle = (0, _primitives.xcss)({
-  paddingTop: 'space.050',
-  paddingRight: 'space.050',
-  paddingBottom: 'space.050',
-  paddingLeft: 'space.100'
-});
-var compactButtonStyle = (0, _primitives.xcss)({
-  height: '20px',
-  alignItems: 'center',
-  marginTop: 'space.075'
-});
-var compactPaddingStyles = (0, _primitives.xcss)({
-  paddingTop: 'space.025'
-});
-var opaqueBackgroundStyles = (0, _primitives.xcss)({
-  backgroundColor: 'elevation.surface',
-  ':hover': {
-    backgroundColor: 'elevation.surface.hovered'
-  },
-  ':active': {
-    backgroundColor: 'elevation.surface.pressed'
-  }
-});
-var containerStyle = (0, _primitives.xcss)({
-  position: 'relative'
-});
-var hideBorderStyle = (0, _primitives.xcss)({
-  border: 'none'
-});
-/**
- * Test id for summary reaction wrapper button
- */
-var RENDER_SUMMARY_BUTTON_TESTID = exports.RENDER_SUMMARY_BUTTON_TESTID = 'reaction-summary-button';
-
-/**
- * Test id for emojis displayed inside summary button. All emoji's in the summary button will have this test id
- */
-var RENDER_SUMMARY_EMOJI_TESTID = exports.RENDER_SUMMARY_EMOJI_TESTID = 'summary-emoji-display';
-
-// forwardRef is used here so that the parent popup component can properly interact with the button
-var ReactionSummaryButton = exports.ReactionSummaryButton = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
-  var emojiProvider = _ref.emojiProvider,
-    _ref$reactions = _ref.reactions,
-    reactions = _ref$reactions === void 0 ? [] : _ref$reactions,
-    _ref$emojisToShow = _ref.emojisToShow,
-    emojisToShow = _ref$emojisToShow === void 0 ? 3 : _ref$emojisToShow,
-    onClick = _ref.onClick,
-    _ref$showOpaqueBackgr = _ref.showOpaqueBackground,
-    showOpaqueBackground = _ref$showOpaqueBackgr === void 0 ? false : _ref$showOpaqueBackgr,
-    _ref$subtleReactionsS = _ref.subtleReactionsSummaryAndPicker,
-    subtleReactionsSummaryAndPicker = _ref$subtleReactionsS === void 0 ? false : _ref$subtleReactionsS,
-    _ref$useCompactStyles = _ref.useCompactStyles,
-    useCompactStyles = _ref$useCompactStyles === void 0 ? false : _ref$useCompactStyles,
-    _ref$useButtonAlignme = _ref.useButtonAlignmentStyling,
-    useButtonAlignmentStyling = _ref$useButtonAlignme === void 0 ? false : _ref$useButtonAlignme;
-  var intl = (0, _reactIntlNext.useIntl)();
-
-  // Helper function to sort reactions by count and return top N
-  var getTopReactions = function getTopReactions(reactions, topN) {
-    return (0, _toConsumableArray2.default)(reactions).sort(function (a, b) {
-      return b.count - a.count;
-    }).slice(0, topN);
-  };
-  var totalReactionsCount = (0, _react.useMemo)(function () {
-    return reactions.reduce(function (accum, current) {
-      return accum += (current === null || current === void 0 ? void 0 : current.count) || 0;
-    }, 0);
-  }, [reactions]);
-  var topReactions = (0, _react.useMemo)(function () {
-    return getTopReactions(reactions, emojisToShow);
-  }, [emojisToShow, reactions]);
-  var buttonStyles = showOpaqueBackground ? [opaqueBackgroundStyles] : [];
-  var subtleSummaryStyles = subtleReactionsSummaryAndPicker ? [hideBorderStyle] : [];
-  var compactButtonStyles = useCompactStyles ? [compactButtonStyle] : [];
-  return /*#__PURE__*/_react.default.createElement(_primitives.Flex, {
-    xcss: containerStyle,
-    ref: ref,
-    alignItems: "center",
-    justifyContent: "center"
-  }, /*#__PURE__*/_react.default.createElement(_Reaction.ReactionButton, {
-    onClick: onClick,
-    testId: RENDER_SUMMARY_BUTTON_TESTID,
-    ariaLabel: intl.formatMessage(_i18n.messages.summary),
-    additionalStyles: [].concat(buttonStyles, subtleSummaryStyles, compactButtonStyles)
-  }, /*#__PURE__*/_react.default.createElement(_primitives.Inline, {
-    space: "space.050",
-    xcss: useCompactStyles ? [buttonStyle, compactPaddingStyles] : buttonStyle,
-    testId: "reaction-summary-wrapper"
-  }, topReactions.map(function (reaction) {
-    return /*#__PURE__*/_react.default.createElement(_primitives.Box, {
-      xcss: emojiStyle,
-      testId: RENDER_SUMMARY_EMOJI_TESTID
-    }, /*#__PURE__*/_react.default.createElement(_emoji.ResourcedEmoji, {
-      key: reaction.emojiId,
-      emojiProvider: emojiProvider,
-      emojiId: {
-        id: reaction.emojiId,
-        shortName: ''
-      },
-      fitToHeight: useCompactStyles ? 12 : 16
-    }));
-  })), /*#__PURE__*/_react.default.createElement(_Counter.Counter, {
-    value: totalReactionsCount,
-    useDarkerFont: useCompactStyles || useButtonAlignmentStyling,
-    useUpdatedStyles: !useCompactStyles && useButtonAlignmentStyling
-  })));
-});

package/dist/cjs/components/ReactionSummary/ReactionSummaryView.js

@@ -1,115 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ReactionSummaryView = exports.RENDER_SUMMARY_VIEW_POPUP_TESTID = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _popup = _interopRequireDefault(require("@atlaskit/popup"));
-var _primitives = require("@atlaskit/primitives");
-var _Reaction = require("../Reaction");
-var _ReactionSummaryViewEmojiPicker = require("./ReactionSummaryViewEmojiPicker");
-var _ReactionSummaryButton = require("./ReactionSummaryButton");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-var summaryPopupStyles = (0, _primitives.xcss)({
-  padding: 'space.100',
-  paddingTop: 'space.050',
-  maxWidth: '325px'
-});
-
-/**
- * Test id for the Reactions summary view popup
- */
-var RENDER_SUMMARY_VIEW_POPUP_TESTID = exports.RENDER_SUMMARY_VIEW_POPUP_TESTID = 'render-summary-view-popup';
-var ReactionSummaryView = exports.ReactionSummaryView = function ReactionSummaryView(_ref) {
-  var emojiProvider = _ref.emojiProvider,
-    _ref$reactions = _ref.reactions,
-    reactions = _ref$reactions === void 0 ? [] : _ref$reactions,
-    _ref$flash = _ref.flash,
-    flash = _ref$flash === void 0 ? {} : _ref$flash,
-    _ref$particleEffectBy = _ref.particleEffectByEmoji,
-    particleEffectByEmoji = _ref$particleEffectBy === void 0 ? {} : _ref$particleEffectBy,
-    _ref$placement = _ref.placement,
-    placement = _ref$placement === void 0 ? 'auto-start' : _ref$placement,
-    onReactionClick = _ref.onReactionClick,
-    onReactionFocused = _ref.onReactionFocused,
-    onReactionMouseEnter = _ref.onReactionMouseEnter,
-    _ref$showOpaqueBackgr = _ref.showOpaqueBackground,
-    showOpaqueBackground = _ref$showOpaqueBackgr === void 0 ? false : _ref$showOpaqueBackgr,
-    _ref$subtleReactionsS = _ref.subtleReactionsSummaryAndPicker,
-    subtleReactionsSummaryAndPicker = _ref$subtleReactionsS === void 0 ? false : _ref$subtleReactionsS,
-    allowUserDialog = _ref.allowUserDialog,
-    handleOpenReactionsDialog = _ref.handleOpenReactionsDialog,
-    _ref$isViewOnly = _ref.isViewOnly,
-    isViewOnly = _ref$isViewOnly === void 0 ? false : _ref$isViewOnly,
-    allowSelectFromSummaryView = _ref.allowSelectFromSummaryView,
-    disabled = _ref.disabled,
-    emojiPickerSize = _ref.emojiPickerSize,
-    onSelection = _ref.onSelection,
-    tooltipContent = _ref.tooltipContent,
-    reactionPickerTriggerIcon = _ref.reactionPickerTriggerIcon,
-    onOpen = _ref.onOpen,
-    useButtonAlignmentStyling = _ref.useButtonAlignmentStyling;
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    isSummaryPopupOpen = _useState2[0],
-    setSummaryPopupOpen = _useState2[1];
-  var handlePopupClose = (0, _react.useCallback)(function () {
-    return setSummaryPopupOpen(false);
-  }, []);
-  var handleSummaryClick = (0, _react.useCallback)(function () {
-    return setSummaryPopupOpen(!isSummaryPopupOpen);
-  }, [isSummaryPopupOpen]);
-  return /*#__PURE__*/_react.default.createElement(_popup.default, {
-    placement: placement,
-    content: function content() {
-      return /*#__PURE__*/_react.default.createElement(_primitives.Inline, {
-        xcss: summaryPopupStyles,
-        testId: RENDER_SUMMARY_VIEW_POPUP_TESTID,
-        space: "space.025",
-        shouldWrap: true,
-        alignBlock: "center"
-      }, reactions.map(function (reaction) {
-        return /*#__PURE__*/_react.default.createElement(_Reaction.Reaction, {
-          key: reaction.emojiId,
-          reaction: reaction,
-          emojiProvider: emojiProvider,
-          onClick: onReactionClick,
-          onFocused: onReactionFocused,
-          onMouseEnter: onReactionMouseEnter,
-          flash: flash[reaction.emojiId],
-          showParticleEffect: particleEffectByEmoji[reaction.emojiId],
-          allowUserDialog: allowUserDialog,
-          handleOpenReactionsDialog: handleOpenReactionsDialog,
-          isViewOnly: isViewOnly
-        });
-      }), allowSelectFromSummaryView && /*#__PURE__*/_react.default.createElement(_ReactionSummaryViewEmojiPicker.ReactionSummaryViewEmojiPicker, {
-        emojiProvider: emojiProvider,
-        disabled: disabled,
-        onSelection: onSelection,
-        emojiPickerSize: emojiPickerSize,
-        tooltipContent: tooltipContent,
-        reactionPickerTriggerIcon: reactionPickerTriggerIcon,
-        onOpen: onOpen
-      }));
-    },
-    isOpen: isSummaryPopupOpen,
-    onClose: handlePopupClose,
-    trigger: function trigger(triggerProps) {
-      return /*#__PURE__*/_react.default.createElement(_ReactionSummaryButton.ReactionSummaryButton, (0, _extends2.default)({}, triggerProps, {
-        emojiProvider: emojiProvider,
-        reactions: reactions,
-        onClick: handleSummaryClick,
-        showOpaqueBackground: showOpaqueBackground,
-        subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
-        useCompactStyles: allowSelectFromSummaryView,
-        useButtonAlignmentStyling: useButtonAlignmentStyling
-      }));
-    }
-  });
-};

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

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