@atlaskit/reactions 33.2.19 → 33.2.21

package/dist/esm/components/ReactionPickerNew.js

@@ -1,412 +0,0 @@
-/* ReactionPickerNew.tsx generated by @compiled/babel-plugin v0.36.1 */
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import "./ReactionPickerNew.compiled.css";
-import { ax, ix } from "@compiled/react/runtime";
-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) { _defineProperty(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; }
-import React, { useCallback, useLayoutEffect, useRef, useState } from 'react';
-import { FormattedMessage, useIntl } from 'react-intl-next';
-import { EmojiPicker } from '@atlaskit/emoji/picker';
-import { Manager, Popper, Reference } from '@atlaskit/popper';
-import { layers } from '@atlaskit/theme/constants';
-import { Box } from '@atlaskit/primitives/compiled';
-import { fg } from '@atlaskit/platform-feature-flags';
-import { useCloseManagerV2 } from '../hooks/useCloseManager';
-import { useDelayedState } from '../hooks/useDelayedState';
-import { useFocusTrap } from '../hooks/useFocusTrap';
-import { messages } from '../shared/i18n';
-import { PickerRender } from '../ufo';
-import { Selector } from './Selector';
-import { Trigger } from './Trigger';
-import { RepositionOnUpdate } from './RepositionOnUpdate';
-import { N0, N50A, N60A } from '@atlaskit/theme/colors';
-import Portal from '@atlaskit/portal';
-var pickerStyle = null;
-var popupWrapperStyle = null;
-var popupStyle = null;
-var popupStyleWithMarginTop = null;
-var additionalStyles = {
-  selectorContainer: "_1e0c1txw"
-};
-
-/**
- * Test id for wrapper ReactionPicker div
- */
-export var RENDER_REACTIONPICKER_TESTID = 'reactionPicker-testid';
-
-/**
- * Test id for ReactionPicker panel div
- */
-export var RENDER_REACTIONPICKERPANEL_TESTID = 'reactionPickerPanel-testid';
-
-/**
- * Emoji Picker Controller Id for Accessibility Labels
- */
-var PICKER_CONTROL_ID = 'emoji-picker';
-/**
- * Picker component for adding reactions
- */
-export var ReactionPicker = /*#__PURE__*/React.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 ? /*#__PURE__*/React.createElement(FormattedMessage, 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,
-    reactionPickerTriggerText = props.reactionPickerTriggerText,
-    reactionPickerPlacement = props.reactionPickerPlacement,
-    _props$isListItem = props.isListItem,
-    isListItem = _props$isListItem === void 0 ? false : _props$isListItem,
-    _props$hoverableReact = props.hoverableReactionPicker,
-    hoverableReactionPicker = _props$hoverableReact === void 0 ? false : _props$hoverableReact,
-    _props$hoverableReact2 = props.hoverableReactionPickerDelay,
-    hoverableReactionPickerDelay = _props$hoverableReact2 === void 0 ? 0 : _props$hoverableReact2;
-  var _useState = useState(null),
-    _useState2 = _slicedToArray(_useState, 2),
-    triggerRef = _useState2[0],
-    setTriggerRef = _useState2[1];
-  var _useState3 = useState(false),
-    _useState4 = _slicedToArray(_useState3, 2),
-    isHoverableReactionPickerEmojiPickerOpen = _useState4[0],
-    setIsHoverableReactionPickerEmojiPickerOpen = _useState4[1];
-  var _useState5 = useState(false),
-    _useState6 = _slicedToArray(_useState5, 2),
-    isHoveringTrigger = _useState6[0],
-    setIsHoveringTrigger = _useState6[1];
-  var _useState7 = useState(false),
-    _useState8 = _slicedToArray(_useState7, 2),
-    isHoveringPopup = _useState8[0],
-    setIsHoveringPopup = _useState8[1];
-  var _useState9 = useState(false),
-    _useState0 = _slicedToArray(_useState9, 2),
-    isTriggerClicked = _useState0[0],
-    setIsTriggerClicked = _useState0[1];
-  var _useDelayedState = useDelayedState(false, hoverableReactionPickerDelay),
-    _useDelayedState2 = _slicedToArray(_useDelayedState, 2),
-    isPopupTrayOpen = _useDelayedState2[0],
-    setIsPopupTrayOpen = _useDelayedState2[1];
-
-  /**
-   * Container <div /> reference (used by custom hook to detect click outside)
-   */
-  var wrapperRef = useRef(null);
-  var updatePopper = 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, fg('platform-reactions-offset-based-popper') ? 4 : 0]
-    }
-  }, {
-    name: 'flip',
-    enabled: true,
-    options: {
-      flipVariations: true,
-      boundariesElement: 'scrollParent'
-    }
-  }];
-  var _useState1 = useState({
-      /**
-       * Show the full custom emoji list picker or the default list of emojis
-       */
-      showFullPicker: !!allowAllEmojis && Array.isArray(pickerQuickReactionEmojiIds) && pickerQuickReactionEmojiIds.length === 0,
-      /**
-       * Use placement for popper based on reactionPickerPlacement prop
-       */
-      popperPlacement: popperPlacement
-    }),
-    _useState10 = _slicedToArray(_useState1, 2),
-    settings = _useState10[0],
-    setSettings = _useState10[1];
-
-  /**
-   * 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 = useCallback(function (_id) {
-    setIsPopupTrayOpen(false, true);
-    // ufo abort reaction experience
-    PickerRender.abort({
-      metadata: {
-        emojiId: _id,
-        source: 'ReactionPicker',
-        reason: 'close dialog'
-      }
-    });
-    if (hoverableReactionPicker) {
-      setIsHoverableReactionPickerEmojiPickerOpen(false);
-      setIsTriggerClicked(false);
-      setIsHoveringTrigger(false);
-      setIsHoveringPopup(false);
-    }
-  }, [setIsPopupTrayOpen, setIsHoverableReactionPickerEmojiPickerOpen, hoverableReactionPicker, setIsTriggerClicked, setIsHoveringTrigger, setIsHoveringPopup]);
-
-  /**
-   * Event handle rwhen selecting to show the custom emoji icons picker
-   * @param e event param
-   */
-  var onSelectMoreClick = useCallback(function (e) {
-    e.preventDefault();
-    setSettings({
-      showFullPicker: hoverableReactionPicker ? settings.showFullPicker : true,
-      popperPlacement: popperPlacement
-    });
-    setIsPopupTrayOpen(true);
-    if (hoverableReactionPicker) {
-      setIsHoverableReactionPickerEmojiPickerOpen(!isHoverableReactionPickerEmojiPickerOpen);
-      setIsTriggerClicked(false);
-    }
-    onShowMore();
-  }, [settings.showFullPicker, setIsPopupTrayOpen, onShowMore, popperPlacement, hoverableReactionPicker, setIsHoverableReactionPickerEmojiPickerOpen, isHoverableReactionPickerEmojiPickerOpen]);
-
-  /**
-   * Event callback when an emoji icon is selected
-   * @param item selected item
-   */
-  var onEmojiSelected = useCallback(function (item) {
-    // no emoji was selected
-    if (!item.id) {
-      return;
-    }
-    onSelection(item.id, settings.showFullPicker || hoverableReactionPicker && isHoverableReactionPickerEmojiPickerOpen ? 'emojiPicker' : 'quickSelector');
-    close(item.id);
-  }, [close, onSelection, settings.showFullPicker, hoverableReactionPicker, isHoverableReactionPickerEmojiPickerOpen]);
-
-  /**
-   * Event handler when the emoji icon to open the custom picker is selected
-   */
-  var onTriggerClick = useCallback(function () {
-    // ufo start reactions picker open experience
-    PickerRender.start();
-    setSettings(_objectSpread(_objectSpread({}, settings), {}, {
-      popperPlacement: popperPlacement
-    }));
-    if (hoverableReactionPicker) {
-      if (isHoverableReactionPickerEmojiPickerOpen || isTriggerClicked) {
-        // if either the emoji picker is open or the trigger was clicked, close the popup and reset the state
-        setIsTriggerClicked(false);
-        setIsPopupTrayOpen(false, true);
-      } else {
-        // if neither condition is true, open the popup and set the state
-        setIsTriggerClicked(true);
-        setIsPopupTrayOpen(true, true);
-      }
-      // close the emoji picker
-      setIsHoverableReactionPickerEmojiPickerOpen(false);
-    } else {
-      setIsPopupTrayOpen(!isPopupTrayOpen);
-    }
-    onOpen();
-    // ufo reactions picker opened success
-    PickerRender.success();
-  }, [hoverableReactionPicker, isPopupTrayOpen, setIsPopupTrayOpen, isTriggerClicked, setIsTriggerClicked, isHoverableReactionPickerEmojiPickerOpen, onOpen, settings, popperPlacement]);
-  var handleTriggerMouseEnter = useCallback(function () {
-    if (hoverableReactionPicker) {
-      setIsHoveringTrigger(true);
-      if (!isHoverableReactionPickerEmojiPickerOpen) {
-        setIsPopupTrayOpen(true);
-      }
-    }
-  }, [hoverableReactionPicker, isHoverableReactionPickerEmojiPickerOpen, setIsPopupTrayOpen]);
-  var handleTriggerMouseLeave = useCallback(function () {
-    if (hoverableReactionPicker) {
-      setIsHoveringTrigger(false);
-      if (!isHoveringPopup && !isHoverableReactionPickerEmojiPickerOpen && !isTriggerClicked) {
-        setIsPopupTrayOpen(false);
-      }
-    }
-  }, [hoverableReactionPicker, isHoveringPopup, isHoverableReactionPickerEmojiPickerOpen, setIsPopupTrayOpen, isTriggerClicked]);
-  var handlePopupMouseEnter = useCallback(function () {
-    if (hoverableReactionPicker) {
-      setIsHoveringPopup(true);
-      if (!isHoverableReactionPickerEmojiPickerOpen) {
-        setIsPopupTrayOpen(true);
-      }
-    }
-  }, [hoverableReactionPicker, isHoverableReactionPickerEmojiPickerOpen, setIsPopupTrayOpen]);
-  var handlePopupMouseLeave = useCallback(function () {
-    if (hoverableReactionPicker) {
-      setIsHoveringPopup(false);
-      if (!isHoveringTrigger && !isHoverableReactionPickerEmojiPickerOpen && !isTriggerClicked) {
-        setIsPopupTrayOpen(false);
-      }
-    }
-  }, [hoverableReactionPicker, isHoveringTrigger, isHoverableReactionPickerEmojiPickerOpen, setIsPopupTrayOpen, isTriggerClicked]);
-  var wrapperClassName = " ".concat(isPopupTrayOpen ? 'isOpen' : '', " ").concat(miniMode ? 'miniMode' : '', " ").concat(className);
-  useLayoutEffect(function () {
-    var _updatePopper$current;
-    (_updatePopper$current = updatePopper.current) === null || _updatePopper$current === void 0 || _updatePopper$current.call(updatePopper);
-  }, [settings]);
-  var onClose = function onClose() {
-    close();
-    onCancel();
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
-    className: ax(["_s7n4nkob _1pra1o8l", wrapperClassName]),
-    "data-testid": RENDER_REACTIONPICKER_TESTID,
-    ref: wrapperRef
-  }, /*#__PURE__*/React.createElement(Manager, null, /*#__PURE__*/React.createElement(Reference, null, function (_ref) {
-    var _ref2 = _ref.ref;
-    return (
-      /*#__PURE__*/
-      // Render a button to open the <Selector /> panel
-      React.createElement(Box, {
-        onMouseEnter: handleTriggerMouseEnter,
-        onMouseLeave: handleTriggerMouseLeave
-      }, /*#__PURE__*/React.createElement(Trigger, {
-        ariaAttributes: {
-          'aria-expanded': isPopupTrayOpen,
-          'aria-controls': PICKER_CONTROL_ID
-        },
-        ref: function ref(node) {
-          if (node && isPopupTrayOpen) {
-            if (typeof _ref2 === 'function') {
-              _ref2(node);
-            } else {
-              _ref2.current = node;
-            }
-            setTriggerRef(node);
-          }
-        },
-        isSelected: isPopupTrayOpen,
-        onClick: onTriggerClick,
-        miniMode: miniMode,
-        disabled: disabled,
-        tooltipContent: isPopupTrayOpen ? null : tooltipContent,
-        showOpaqueBackground: showOpaqueBackground,
-        showAddReactionText: showAddReactionText,
-        subtleReactionsSummaryAndPicker: subtleReactionsSummaryAndPicker,
-        reactionPickerTriggerIcon: reactionPickerTriggerIcon,
-        reactionPickerTriggerText: reactionPickerTriggerText,
-        isListItem: isListItem
-      }))
-    );
-  }), isPopupTrayOpen && /*#__PURE__*/React.createElement(Portal, {
-    zIndex: layers.flag()
-  }, /*#__PURE__*/React.createElement(PopperWrapper, {
-    settings: settings,
-    popperModifiers: popperModifiers,
-    isOpen: isPopupTrayOpen,
-    onClose: onClose,
-    triggerRef: triggerRef
-  }, settings.showFullPicker || hoverableReactionPicker && isHoverableReactionPickerEmojiPickerOpen ? /*#__PURE__*/React.createElement(EmojiPicker, {
-    emojiProvider: emojiProvider,
-    onSelection: onEmojiSelected,
-    size: emojiPickerSize
-  }) : /*#__PURE__*/React.createElement(Box, {
-    xcss: additionalStyles.selectorContainer,
-    onMouseEnter: handlePopupMouseEnter,
-    onMouseLeave: handlePopupMouseLeave
-  }, /*#__PURE__*/React.createElement(Selector, {
-    emojiProvider: emojiProvider,
-    onSelection: onEmojiSelected,
-    showMore: allowAllEmojis,
-    onMoreClick: onSelectMoreClick,
-    pickerQuickReactionEmojiIds: pickerQuickReactionEmojiIds,
-    hoverableReactionPickerSelector: hoverableReactionPicker
-  }))))));
-});
-export var PopperWrapper = function PopperWrapper(props) {
-  var triggerRef = props.triggerRef,
-    settings = props.settings,
-    isOpen = props.isOpen,
-    onClose = props.onClose,
-    children = props.children,
-    popperModifiers = props.popperModifiers;
-  var _useState11 = useState(null),
-    _useState12 = _slicedToArray(_useState11, 2),
-    popupRef = _useState12[0],
-    setPopupRef = _useState12[1];
-  var _useIntl = useIntl(),
-    formatMessage = _useIntl.formatMessage;
-  /**
-   * add focus lock to popup
-   */
-  useFocusTrap({
-    initialFocusRef: null,
-    targetRef: popupRef
-  });
-
-  /**
-   * Custom hook triggers when user clicks outside the reactions picker
-   */
-  useCloseManagerV2(popupRef, triggerRef, function (callbackType) {
-    onClose();
-    if (popupRef && callbackType === 'ESCAPE') {
-      requestAnimationFrame(function () {
-        return triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.focus();
-      });
-    }
-  }, true, isOpen);
-  return /*#__PURE__*/React.createElement(Popper, {
-    placement: settings.popperPlacement,
-    modifiers: popperModifiers
-  }, function (_ref3) {
-    var _ref4 = _ref3.ref,
-      style = _ref3.style,
-      update = _ref3.update;
-    return /*#__PURE__*/React.createElement("div", {
-      role: "group",
-      "aria-label": formatMessage(messages.popperWrapperLabel),
-      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: 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 jsx-a11y/no-noninteractive-tabindex
-      tabIndex: 0,
-      className: ax(["_nt751r31 _49pcglyw _1hvw1o36"])
-    }, /*#__PURE__*/React.createElement(RepositionOnUpdate, {
-      update: update,
-      settings: settings
-    }, /*#__PURE__*/React.createElement("div", {
-      className: ax(["_2rkofajl _bfhk13b4 _16qs1a23 _79pa1b66", !fg('platform-reactions-offset-based-popper') && "_1bch1b66"]),
-      style: {
-        "--_1f6rtr1": ix("var(--ds-surface-overlay, ".concat(N0, ")")),
-        "--_3t1odq": ix("var(--ds-shadow-overlay, ".concat("0 4px 8px -2px ".concat(N50A, ", 0 0 1px ").concat(N60A), ")"))
-      }
-    }, children)));
-  });
-};

package/dist/types/components/ReactionPickerNew.d.ts

@@ -1,114 +0,0 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import React, { type PropsWithChildren } from 'react';
-import { type PickerSize } from '@atlaskit/emoji/types';
-import { type EmojiProvider } from '@atlaskit/emoji/resource';
-import { type PopperProps, type Placement } from '@atlaskit/popper';
-import { type ReactionSource } from '../types';
-import { type SelectorProps } from './Selector';
-import { type TriggerProps } from './Trigger';
-/**
- * Test id for wrapper ReactionPicker div
- */
-export declare const RENDER_REACTIONPICKER_TESTID = "reactionPicker-testid";
-/**
- * Test id for ReactionPicker panel div
- */
-export declare const RENDER_REACTIONPICKERPANEL_TESTID = "reactionPickerPanel-testid";
-export interface ReactionPickerProps extends Pick<SelectorProps, 'pickerQuickReactionEmojiIds'>, Partial<Pick<TriggerProps, 'tooltipContent' | 'miniMode'>> {
-    /**
-     * Optional Show the "more emoji" selector icon for choosing emoji beyond the default list of emojis (defaults to false)
-     */
-    allowAllEmojis?: boolean;
-    /**
-     * Optional class name
-     */
-    className?: string;
-    /**
-     * Enable/Disable the button to be clickable (defaults to false)
-     */
-    disabled?: boolean;
-    /**
-     * Optional emoji picker size to control the size of emoji picker
-     */
-    emojiPickerSize?: PickerSize;
-    /**
-     * Provider for loading emojis
-     */
-    emojiProvider: Promise<EmojiProvider>;
-    /**
-     * Optional prop for hoverable reaction picker
-     */
-    hoverableReactionPicker?: boolean;
-    /**
-     * Optional prop to set a delay for the reaction picker when it opens/closes on hover
-     */
-    hoverableReactionPickerDelay?: number;
-    /**
-     * Optional prop to say if the reactions component is in a list
-     */
-    isListItem?: boolean;
-    /**
-     * Optional event handler when the emoji picker is clicked outside and closed
-     */
-    onCancel?: () => void;
-    /**
-     * Optional event handler when the emoji picker is opened
-     */
-    onOpen?: () => void;
-    /**
-     * Event callback when an emoji button is selected
-     * @param emojiId emoji unique id
-     * @param source source where the reaction was picked (either the initial default reactions or the custom reactions picker)
-     */
-    onSelection: (emojiId: string, source: ReactionSource) => void;
-    /**
-     * Optional event handler when the custom emoji picker icon is selected
-     */
-    onShowMore?: () => void;
-    /**
-     * Optional prop for controlling the picker location
-     */
-    reactionPickerPlacement?: Placement;
-    /**
-     * Optional prop to set the strategy of the reaction picker popup
-     */
-    reactionPickerStrategy?: PopperProps<{}>['strategy'];
-    /**
-     * Optional prop for controlling icon inside Trigger
-     */
-    reactionPickerTriggerIcon?: React.ReactNode;
-    /**
-     * Optional prop for controlling text of the trigger button
-     */
-    reactionPickerTriggerText?: string;
-    /**
-     * Optional prop for displaying text to add a reaction
-     */
-    showAddReactionText?: boolean;
-    /**
-     * Optional prop for using an opaque button background instead of a transparent background
-     */
-    showOpaqueBackground?: boolean;
-    /**
-     * Optional prop for applying subtle styling to reaction summary and picker
-     */
-    subtleReactionsSummaryAndPicker?: boolean;
-}
-/**
- * Picker component for adding reactions
- */
-export declare const ReactionPicker: React.MemoExoticComponent<(props: ReactionPickerProps) => JSX.Element>;
-export interface PopperWrapperProps {
-    isOpen: boolean;
-    onClose: () => void;
-    popperModifiers?: PopperProps<{}>['modifiers'];
-    settings: {
-        popperPlacement: Placement;
-        showFullPicker: boolean;
-    };
-    triggerRef: HTMLDivElement | HTMLButtonElement | null;
-}
-export declare const PopperWrapper: (props: PropsWithChildren<PopperWrapperProps>) => JSX.Element;

package/dist/types-ts4.5/components/ReactionPickerNew.d.ts

@@ -1,114 +0,0 @@
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-import React, { type PropsWithChildren } from 'react';
-import { type PickerSize } from '@atlaskit/emoji/types';
-import { type EmojiProvider } from '@atlaskit/emoji/resource';
-import { type PopperProps, type Placement } from '@atlaskit/popper';
-import { type ReactionSource } from '../types';
-import { type SelectorProps } from './Selector';
-import { type TriggerProps } from './Trigger';
-/**
- * Test id for wrapper ReactionPicker div
- */
-export declare const RENDER_REACTIONPICKER_TESTID = "reactionPicker-testid";
-/**
- * Test id for ReactionPicker panel div
- */
-export declare const RENDER_REACTIONPICKERPANEL_TESTID = "reactionPickerPanel-testid";
-export interface ReactionPickerProps extends Pick<SelectorProps, 'pickerQuickReactionEmojiIds'>, Partial<Pick<TriggerProps, 'tooltipContent' | 'miniMode'>> {
-    /**
-     * Optional Show the "more emoji" selector icon for choosing emoji beyond the default list of emojis (defaults to false)
-     */
-    allowAllEmojis?: boolean;
-    /**
-     * Optional class name
-     */
-    className?: string;
-    /**
-     * Enable/Disable the button to be clickable (defaults to false)
-     */
-    disabled?: boolean;
-    /**
-     * Optional emoji picker size to control the size of emoji picker
-     */
-    emojiPickerSize?: PickerSize;
-    /**
-     * Provider for loading emojis
-     */
-    emojiProvider: Promise<EmojiProvider>;
-    /**
-     * Optional prop for hoverable reaction picker
-     */
-    hoverableReactionPicker?: boolean;
-    /**
-     * Optional prop to set a delay for the reaction picker when it opens/closes on hover
-     */
-    hoverableReactionPickerDelay?: number;
-    /**
-     * Optional prop to say if the reactions component is in a list
-     */
-    isListItem?: boolean;
-    /**
-     * Optional event handler when the emoji picker is clicked outside and closed
-     */
-    onCancel?: () => void;
-    /**
-     * Optional event handler when the emoji picker is opened
-     */
-    onOpen?: () => void;
-    /**
-     * Event callback when an emoji button is selected
-     * @param emojiId emoji unique id
-     * @param source source where the reaction was picked (either the initial default reactions or the custom reactions picker)
-     */
-    onSelection: (emojiId: string, source: ReactionSource) => void;
-    /**
-     * Optional event handler when the custom emoji picker icon is selected
-     */
-    onShowMore?: () => void;
-    /**
-     * Optional prop for controlling the picker location
-     */
-    reactionPickerPlacement?: Placement;
-    /**
-     * Optional prop to set the strategy of the reaction picker popup
-     */
-    reactionPickerStrategy?: PopperProps<{}>['strategy'];
-    /**
-     * Optional prop for controlling icon inside Trigger
-     */
-    reactionPickerTriggerIcon?: React.ReactNode;
-    /**
-     * Optional prop for controlling text of the trigger button
-     */
-    reactionPickerTriggerText?: string;
-    /**
-     * Optional prop for displaying text to add a reaction
-     */
-    showAddReactionText?: boolean;
-    /**
-     * Optional prop for using an opaque button background instead of a transparent background
-     */
-    showOpaqueBackground?: boolean;
-    /**
-     * Optional prop for applying subtle styling to reaction summary and picker
-     */
-    subtleReactionsSummaryAndPicker?: boolean;
-}
-/**
- * Picker component for adding reactions
- */
-export declare const ReactionPicker: React.MemoExoticComponent<(props: ReactionPickerProps) => JSX.Element>;
-export interface PopperWrapperProps {
-    isOpen: boolean;
-    onClose: () => void;
-    popperModifiers?: PopperProps<{}>['modifiers'];
-    settings: {
-        popperPlacement: Placement;
-        showFullPicker: boolean;
-    };
-    triggerRef: HTMLDivElement | HTMLButtonElement | null;
-}
-export declare const PopperWrapper: (props: PropsWithChildren<PopperWrapperProps>) => JSX.Element;