@atlaskit/reactions 25.4.1 → 25.5.0

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

@@ -26,5 +26,13 @@ export type ReactionTooltipProps = PropsWithChildren<{
      * Optional flag for enabling tooltip (defaults to true)
      */
     isEnabled?: boolean;
+    /**
+     * Optional prop for enabling the Reactions Dialog
+     */
+    allowUserDialog?: boolean;
+    /**
+     * Optional function when the user wants to open the Reactions Dialog
+     */
+    handleOpenReactionsDialog?: (emojiId?: string, source?: string) => void;
 }>;
-export declare const ReactionTooltip: ({ children, emojiName, reaction: { users }, maxReactions, isEnabled, }: ReactionTooltipProps) => jsx.JSX.Element;
+export declare const ReactionTooltip: ({ children, emojiName, reaction: { users }, maxReactions, isEnabled, allowUserDialog, handleOpenReactionsDialog, }: ReactionTooltipProps) => jsx.JSX.Element;

package/dist/types/components/ReactionTooltip/styles.d.ts

@@ -2,3 +2,4 @@ export declare const verticalMargin = 5;
 export declare const tooltipStyle: import("@emotion/react").SerializedStyles;
 export declare const emojiNameStyle: import("@emotion/react").SerializedStyles;
 export declare const footerStyle: import("@emotion/react").SerializedStyles;
+export declare const underlineStyle: import("@emotion/react").SerializedStyles;

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

@@ -74,11 +74,6 @@ export interface ReactionsProps extends Pick<ReactionPickerProps, 'allowAllEmoji
      * @param emojiId current reaction emoji id
      */
     getReactionDetails?: (emojiId: string) => void;
-    /**
-     * @private
-     * @deprecated use getReactionDetails instead
-     */
-    onReactionHover?: (emojiId: string) => void;
     /**
      * Optional error message to show when unable to display the reaction emoji
      */
@@ -159,4 +154,4 @@ export declare function getTooltip(status: ReactionStatus, errorMessage?: string
 /**
  * Renders list of reactions
  */
-export declare const Reactions: React.MemoExoticComponent<({ flash, particleEffectByEmoji, status, errorMessage, loadReaction, quickReactionEmojis, pickerQuickReactionEmojiIds, getReactionDetails, onReactionHover, onSelection, reactions, emojiProvider, allowAllEmojis, onReactionClick, allowUserDialog, onDialogOpenCallback, onDialogCloseCallback, onDialogSelectReactionCallback, onDialogPageChangeCallback, emojiPickerSize, miniMode, summaryViewEnabled, summaryViewThreshold, summaryViewPlacement, showOpaqueBackground, subtleReactionsSummaryAndPicker, showAddReactionText, hideDefaultReactions, ProfileCardWrapper, onlyRenderPicker, showRoundTrigger, isViewOnly, }: ReactionsProps) => jsx.JSX.Element>;
+export declare const Reactions: React.MemoExoticComponent<({ flash, particleEffectByEmoji, status, errorMessage, loadReaction, quickReactionEmojis, pickerQuickReactionEmojiIds, getReactionDetails, onSelection, reactions, emojiProvider, allowAllEmojis, onReactionClick, allowUserDialog, onDialogOpenCallback, onDialogCloseCallback, onDialogSelectReactionCallback, onDialogPageChangeCallback, emojiPickerSize, miniMode, summaryViewEnabled, summaryViewThreshold, summaryViewPlacement, showOpaqueBackground, subtleReactionsSummaryAndPicker, showAddReactionText, hideDefaultReactions, ProfileCardWrapper, onlyRenderPicker, showRoundTrigger, isViewOnly, }: ReactionsProps) => jsx.JSX.Element>;

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

@@ -39,8 +39,16 @@ export interface ReactionProps {
      * Optional prop for using an opaque button background instead of a transparent background
      */
     showOpaqueBackground?: boolean;
+    /**
+     * Optional prop for enabling the Reactions Dialog
+     */
+    allowUserDialog?: boolean;
+    /**
+     * Optional function when the user wants to open the Reactions Dialog
+     */
+    handleOpenReactionsDialog?: (emojiId?: string, source?: string) => void;
 }
 /**
  * Render an emoji reaction button
  */
-export declare const Reaction: ({ emojiProvider, onClick, reaction, onMouseEnter, onFocused, flash, showParticleEffect, showOpaqueBackground, }: ReactionProps) => jsx.JSX.Element;
+export declare const Reaction: ({ emojiProvider, onClick, reaction, onMouseEnter, onFocused, flash, showParticleEffect, showOpaqueBackground, allowUserDialog, handleOpenReactionsDialog, }: ReactionProps) => jsx.JSX.Element;

package/dist/types-ts4.5/components/ReactionDialog/ReactionView.d.ts

@@ -1,5 +1,4 @@
 import { jsx } from '@emotion/react';
-import { type EmojiProvider } from '@atlaskit/emoji/resource';
 import { type ReactionSummary, type ProfileCardWrapper } from '../../types';
 export interface ReactionViewProps {
     /**
@@ -7,13 +6,8 @@ export interface ReactionViewProps {
      */
     reaction: ReactionSummary;
     /**
-     * Current emoji selected in the reactions dialog
+     * Optional ProfileWrapper component to show profile card on hover
      */
-    selectedEmojiId: string;
-    /**
-     * Provider for loading emojis
-     */
-    emojiProvider: Promise<EmojiProvider>;
     ProfileCardWrapper?: ProfileCardWrapper;
 }
-export declare const ReactionView: ({ selectedEmojiId, emojiProvider, reaction, ProfileCardWrapper, }: ReactionViewProps) => jsx.JSX.Element;
+export declare const ReactionView: ({ reaction, ProfileCardWrapper }: ReactionViewProps) => jsx.JSX.Element;

package/dist/types-ts4.5/components/ReactionDialog/ReactionsDialog.d.ts

@@ -29,6 +29,5 @@ export interface ReactionsDialogProps {
     handleSelectReaction?: (emojiId: string) => void;
     handlePaginationChange?: (emojiId: string, currentPage: number, maxPages: number) => void;
     ProfileCardWrapper?: ProfileCardWrapper;
-    handleReactionMouseEnter?: (emojiId: string) => void;
 }
-export declare const ReactionsDialog: ({ reactions, handleCloseReactionsDialog, emojiProvider, selectedEmojiId, handleSelectReaction, handlePaginationChange, ProfileCardWrapper, handleReactionMouseEnter, }: ReactionsDialogProps) => jsx.JSX.Element;
+export declare const ReactionsDialog: ({ reactions, handleCloseReactionsDialog, emojiProvider, selectedEmojiId, handleSelectReaction, handlePaginationChange, ProfileCardWrapper, }: ReactionsDialogProps) => jsx.JSX.Element;

package/dist/types-ts4.5/components/ReactionDialog/ReactionsDialogTrigger.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+interface ReactionsDialogTriggerProps {
+    onClick: () => void;
+}
+export declare const ReactionsDialogTrigger: ({ onClick }: ReactionsDialogTriggerProps) => React.JSX.Element;
+export {};

package/dist/types-ts4.5/components/ReactionDialog/ReactionsList.d.ts

@@ -3,7 +3,6 @@
  * @jsx jsx
  */
 import { jsx } from '@emotion/react';
-import { type EmojiProvider } from '@atlaskit/emoji/resource';
 import { type ReactionSummary, type ProfileCardWrapper } from '../../types';
 export interface ReactionsListProps {
     /**
@@ -17,10 +16,9 @@ export interface ReactionsListProps {
     /**
      * Provider for loading emojis
      */
-    emojiProvider: Promise<EmojiProvider>;
     /**
      * A functional component from Confluence to show a profile card on hover
      */
     ProfileCardWrapper?: ProfileCardWrapper;
 }
-export declare const ReactionsList: ({ reactions, selectedEmojiId, emojiProvider, ProfileCardWrapper, }: ReactionsListProps) => jsx.JSX.Element;
+export declare const ReactionsList: ({ reactions, selectedEmojiId, ProfileCardWrapper, }: ReactionsListProps) => jsx.JSX.Element;

package/dist/types-ts4.5/components/ReactionSummary/ReactionSummaryView.d.ts

@@ -32,9 +32,13 @@ interface ReactionSummaryViewProps extends Pick<ReactionsProps, 'emojiProvider'
      */
     subtleReactionsSummaryAndPicker?: boolean;
     /**
-     * Optional function when the user wants to see more users in a modal
+     * Optional prop for enabling the Reactions Dialog
      */
-    handleOpenReactionsDialog?: (emojiId: string) => void;
+    allowUserDialog?: boolean;
+    /**
+     * Optional function when the user wants to open the Reactions Dialog
+     */
+    handleOpenReactionsDialog?: (emojiId?: string, source?: string) => void;
 }
-export declare const ReactionSummaryView: ({ emojiProvider, reactions, flash, particleEffectByEmoji, placement, onReactionClick, onReactionFocused, onReactionMouseEnter, showOpaqueBackground, subtleReactionsSummaryAndPicker, handleOpenReactionsDialog, allowUserDialog, }: ReactionSummaryViewProps) => React.JSX.Element;
+export declare const ReactionSummaryView: ({ emojiProvider, reactions, flash, particleEffectByEmoji, placement, onReactionClick, onReactionFocused, onReactionMouseEnter, showOpaqueBackground, subtleReactionsSummaryAndPicker, allowUserDialog, handleOpenReactionsDialog, }: ReactionSummaryViewProps) => React.JSX.Element;
 export {};

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

@@ -26,5 +26,13 @@ export type ReactionTooltipProps = PropsWithChildren<{
      * Optional flag for enabling tooltip (defaults to true)
      */
     isEnabled?: boolean;
+    /**
+     * Optional prop for enabling the Reactions Dialog
+     */
+    allowUserDialog?: boolean;
+    /**
+     * Optional function when the user wants to open the Reactions Dialog
+     */
+    handleOpenReactionsDialog?: (emojiId?: string, source?: string) => void;
 }>;
-export declare const ReactionTooltip: ({ children, emojiName, reaction: { users }, maxReactions, isEnabled, }: ReactionTooltipProps) => jsx.JSX.Element;
+export declare const ReactionTooltip: ({ children, emojiName, reaction: { users }, maxReactions, isEnabled, allowUserDialog, handleOpenReactionsDialog, }: ReactionTooltipProps) => jsx.JSX.Element;

package/dist/types-ts4.5/components/ReactionTooltip/styles.d.ts

@@ -2,3 +2,4 @@ export declare const verticalMargin = 5;
 export declare const tooltipStyle: import("@emotion/react").SerializedStyles;
 export declare const emojiNameStyle: import("@emotion/react").SerializedStyles;
 export declare const footerStyle: import("@emotion/react").SerializedStyles;
+export declare const underlineStyle: import("@emotion/react").SerializedStyles;

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

@@ -74,11 +74,6 @@ export interface ReactionsProps extends Pick<ReactionPickerProps, 'allowAllEmoji
      * @param emojiId current reaction emoji id
      */
     getReactionDetails?: (emojiId: string) => void;
-    /**
-     * @private
-     * @deprecated use getReactionDetails instead
-     */
-    onReactionHover?: (emojiId: string) => void;
     /**
      * Optional error message to show when unable to display the reaction emoji
      */
@@ -159,4 +154,4 @@ export declare function getTooltip(status: ReactionStatus, errorMessage?: string
 /**
  * Renders list of reactions
  */
-export declare const Reactions: React.MemoExoticComponent<({ flash, particleEffectByEmoji, status, errorMessage, loadReaction, quickReactionEmojis, pickerQuickReactionEmojiIds, getReactionDetails, onReactionHover, onSelection, reactions, emojiProvider, allowAllEmojis, onReactionClick, allowUserDialog, onDialogOpenCallback, onDialogCloseCallback, onDialogSelectReactionCallback, onDialogPageChangeCallback, emojiPickerSize, miniMode, summaryViewEnabled, summaryViewThreshold, summaryViewPlacement, showOpaqueBackground, subtleReactionsSummaryAndPicker, showAddReactionText, hideDefaultReactions, ProfileCardWrapper, onlyRenderPicker, showRoundTrigger, isViewOnly, }: ReactionsProps) => jsx.JSX.Element>;
+export declare const Reactions: React.MemoExoticComponent<({ flash, particleEffectByEmoji, status, errorMessage, loadReaction, quickReactionEmojis, pickerQuickReactionEmojiIds, getReactionDetails, onSelection, reactions, emojiProvider, allowAllEmojis, onReactionClick, allowUserDialog, onDialogOpenCallback, onDialogCloseCallback, onDialogSelectReactionCallback, onDialogPageChangeCallback, emojiPickerSize, miniMode, summaryViewEnabled, summaryViewThreshold, summaryViewPlacement, showOpaqueBackground, subtleReactionsSummaryAndPicker, showAddReactionText, hideDefaultReactions, ProfileCardWrapper, onlyRenderPicker, showRoundTrigger, isViewOnly, }: ReactionsProps) => jsx.JSX.Element>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/reactions",
-	"version": "25.4.1",
+	"version": "25.5.0",
 	"description": "Reactions component",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"