@atlaskit/reactions 22.3.1 → 22.3.2

package/dist/types-ts4.5/store/MemoryReactionsStore.d.ts

@@ -0,0 +1,94 @@
+import { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
+import * as Types from '../types';
+/**
+ * Set of all available UFO experiences relating to reaction element
+ */
+export declare const ufoExperiences: {
+    /**
+     * Experience when a reaction emoji gets added
+     */
+    add: import("@atlaskit/ufo").ConcurrentExperience;
+    /**
+     * Experience when a reaction emoji gets removed/decrement
+     */
+    remove: import("@atlaskit/ufo").ConcurrentExperience;
+    /**
+     * Experience when the list of reactions gets rendered with sampling
+     */
+    render: (instanceId: string) => import("@atlaskit/emoji").WithSamplingUFOExperience;
+    /**
+     * Experience when a reaction details gets fetched
+     */
+    fetchDetails: import("@atlaskit/ufo").ConcurrentExperience;
+};
+/**
+ * Optional metadata information in the store used in sending the API client requests
+ */
+interface StoreMetadata {
+    subproduct?: string;
+    [k: string]: any;
+}
+export declare class MemoryReactionsStore implements Types.Store {
+    private client;
+    private state;
+    private metadata;
+    private callbacks;
+    private createAnalyticsEvent?;
+    /**
+     * default initial store data
+     */
+    private initialState;
+    constructor(client: Types.Client, state?: Types.State, metadata?: StoreMetadata);
+    /**
+     * Update the store state data with a new data
+     * @param newState new store data
+     */
+    private setState;
+    /**
+     * Calls any onChange callbacks in the store using latest state data.
+     */
+    private triggerOnChange;
+    private setReactions;
+    private getReactionsState;
+    private handleDetailedReactionResponse;
+    private setFlash;
+    private flash;
+    private optmisticUpdate;
+    /**
+     * Utility function to help execute a callback to Reaction if its state is ready.
+     *
+     *
+     * @param containerAri
+     * @param ari
+     *
+     * @returns (updater: Updater<ReactionsReadyState>) => ReactionsState?
+     *  A function that will execute the received callback with the ReactionsState if
+     *  ready. If some state is returned, the new state will be applied.
+     */
+    private withReadyReaction;
+    /**
+     * Utility function to help execute actions with a reaction. It handles reaction discovery
+     * and branching between reacted and not reacted.
+     *
+     * @param reactedCallback callback that will be executed when the user has already reacted
+     * with the emoji
+     * @param notReactedCallback callback that will be executed when the user hasn't reacted
+     * with the emoji
+     *
+     * @returns (containerAri: string, ari: string, emojiId: string) => ReactionsState?
+     *  A function that will execute the correct callback to the triple containerAri, ari and
+     *  emojiId. If some state is returned, the new state will be applied.
+     */
+    private withReaction;
+    private doAddReaction;
+    private doRemoveReaction;
+    setCreateAnalyticsEvent: (createAnalyticsEvent?: CreateUIAnalyticsEvent) => void;
+    getReactions: (key: string, ...args: string[]) => void;
+    toggleReaction: (containerAri: string, ari: string, emojiId: string) => void;
+    addReaction: (containerAri: string, ari: string, emojiId: string) => void;
+    getDetailedReaction: (containerAri: string, ari: string, emojiId: string) => void;
+    getState: () => Types.State;
+    onChange: (callback: Types.OnChangeCallback) => void;
+    removeOnChangeListener: (toRemove: Types.OnChangeCallback) => void;
+}
+export {};

package/dist/types-ts4.5/store/ReactionConsumer.d.ts

@@ -0,0 +1,57 @@
+import React from 'react';
+import { Actions, State, StorePropInput, Store } from '../types';
+/**
+ * Props type for the ReactionConsumer class component
+ */
+export type ReactioConsumerProps<PropsFromState, PropsFromActions> = {
+    /**
+     * Return a plain object containing the data that the connected component needs
+     */
+    mapStateToProps?: (state: State) => PropsFromState;
+    /**
+     * Specify which actions the child component might need to dispatch from its props
+     */
+    mapActionsToProps?: (actions: Actions) => PropsFromActions;
+    /**
+     * Component to render
+     */
+    children: (props: PropsFromState & PropsFromActions) => React.ReactNode;
+    /**
+     * Reference to the store.
+     * @remarks
+     * This was initially implemented with a sync and Async versions and will be replaced with just a sync Store in a future release (Please use only the sync version)
+     */
+    store: StorePropInput;
+};
+/**
+ * State type for the ReactionConsumer class component
+ */
+export type ReactionConsumerState = {
+    store?: Store;
+};
+/**
+ * A custom mapper class that takes the store instance and mapper functions "mapStateToProps" and "mapActionsToProps" to return the renderProps pattern as a child component
+ * @deprecated please avoid using this class as it will be removed in a future release
+ */
+export declare class ReactionConsumer<PropsFromState, PropsFromActions> extends React.PureComponent<ReactioConsumerProps<PropsFromState, PropsFromActions>, ReactionConsumerState> {
+    private previousActions;
+    private propsFromActions;
+    constructor(props: ReactioConsumerProps<PropsFromState, PropsFromActions>);
+    componentDidMount(): void;
+    componentWillUnmount(): Promise<void>;
+    /**
+     * Get the actions the child component might need to dispatch from its props
+     */
+    private getPropsFromActions;
+    /**
+     *
+     * @param state Internal state data
+     * @returns object containing the data that the connected component needs
+     */
+    private getPropsFromState;
+    /**
+     *
+     */
+    private handleOnChange;
+    render(): React.ReactNode;
+}

package/dist/types-ts4.5/store/batched.d.ts

@@ -0,0 +1,2 @@
+export declare function batch<T>(callback: (args: T[][]) => void): (...args: T[]) => void;
+export declare function batchByKey<T>(callback: (key: string, args: T[][]) => void): (key: string, ...args: T[]) => void;

package/dist/types-ts4.5/store/index.d.ts

@@ -0,0 +1,3 @@
+export { ReactionConsumer } from './ReactionConsumer';
+export type { ReactioConsumerProps } from './ReactionConsumer';
+export { MemoryReactionsStore, ufoExperiences } from './MemoryReactionsStore';

package/dist/types-ts4.5/store/utils.d.ts

@@ -0,0 +1,11 @@
+import { Updater, ReactionsReadyState, ReactionSummary } from '../types';
+type ReactionSummarySortFunction = (a: ReactionSummary, b: ReactionSummary) => number;
+export declare const readyState: (reactions: ReactionSummary[]) => ReactionsReadyState;
+export declare const byEmojiId: (emojiId: string) => (reaction: ReactionSummary) => boolean;
+export declare const addOne: (reaction: ReactionSummary) => ReactionSummary;
+export declare const removeOne: (reaction: ReactionSummary) => ReactionSummary;
+export declare const updateByEmojiId: (emojiId: string, updater: Updater<ReactionSummary> | ReactionSummary) => (reaction: ReactionSummary) => void | ReactionSummary;
+export declare const getReactionsSortFunction: (reactions?: ReactionSummary[]) => ReactionSummarySortFunction;
+export declare const flattenAris: (a: string[], b: string[]) => string[];
+export declare function isRealErrorFromService(errorCode?: number): boolean;
+export {};

package/dist/types-ts4.5/types/Actions.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Event callback by the client to the API
+ * @param containerAri the container for reactions/ari in the page (attached to the "quickReactionEmojis" prop)
+ * @param ariunique Atlassian identifier for an emoji (attached to the "quickReactionEmojis" prop)
+ * @param emojiId unique identifier guid for the emoji
+ */
+export type ReactionAction = (containerAri: string, ari: string, emojiId: string) => void;
+export type Actions = {
+    /**
+     * Retrieve reaction collection api
+     * @param containerId the container for reactions/ari in the page
+     * @param aris collection of Asset ids in the container
+     */
+    getReactions: (containerId: string, aris: string) => void;
+    /**
+     * Select/deselect a rection callback
+     */
+    toggleReaction: ReactionAction;
+    /**
+     * Add a new reation api
+     */
+    addReaction: ReactionAction;
+    /**
+     * Hover an existing reaction emoji api
+     */
+    getDetailedReaction: ReactionAction;
+};

package/dist/types-ts4.5/types/Updater.d.ts

@@ -0,0 +1 @@
+export type Updater<T> = (original: T) => T | void;

package/dist/types-ts4.5/types/User.d.ts

@@ -0,0 +1,20 @@
+export interface User {
+    /**
+     * user id in system
+     */
+    id: string;
+    /**
+     * name of user clicked on the reaction
+     */
+    displayName: string;
+    /**
+     * optional path to a user profile picture
+     */
+    profilePicture?: ProfilePicture;
+}
+/**
+ * Type defining the path to a user profile picture
+ */
+export type ProfilePicture = {
+    path: string;
+};

package/dist/types-ts4.5/types/client.d.ts

@@ -0,0 +1,38 @@
+import { Reactions, ReactionSummary } from './reaction';
+export type Request<T> = (
+/**
+ * Reaction Asset id in the container
+ */
+ari: string, 
+/**
+ * the container for reactions/ari
+ */
+containerAri: string, 
+/**
+ * unique Atlassian identifier for an emoji
+ */
+emojiId: string, 
+/**
+ * Optional metadata information used in the API request
+ */
+metadata?: Record<string, any>) => Promise<T>;
+export interface Client {
+    /**
+     * fetch reactions request handler
+     * @param containerAri container wrapper id
+     * @param aris container reaction assets unique ids
+     */
+    getReactions(containerAri: string, aris: string[]): Promise<Reactions>;
+    /**
+     * Fetch details for a given reaction.
+     */
+    getDetailedReaction: Request<ReactionSummary>;
+    /**
+     * Fetch request when adding a reaction to a container.
+     */
+    addReaction: Request<ReactionSummary[]>;
+    /**
+     * Fetch request when removing a reaction from a container.
+     */
+    deleteReaction: Request<ReactionSummary[]>;
+}

package/dist/types-ts4.5/types/index.d.ts

@@ -0,0 +1,7 @@
+export type { ReactionAction, Actions } from './Actions';
+export { ReactionStatus } from './reaction';
+export type { ReactionSource, ReactionsError, ReactionsLoading, ReactionsReadyState, ReactionsState, ReactionSummary, QuickReactionEmojiSummary, ReactionsNotLoaded, Reactions, ReactionClick, ReactionMouseEnter, onDialogSelectReactionChange, } from './reaction';
+export type { Client, Request } from './client';
+export type { Updater } from './Updater';
+export type { User } from './User';
+export type { Store, StorePropInput, State, OnChangeCallback } from './store';

package/dist/types-ts4.5/types/reaction.d.ts

@@ -0,0 +1,113 @@
+/// <reference types="react" />
+import { UIAnalyticsEvent } from '@atlaskit/analytics-next';
+import { User } from './User';
+/**
+ * Collection of reactions as object (key is unique id from containerAri and ari combined)
+ */
+export type Reactions = Record<string, ReactionSummary[]>;
+/**
+ * Event handler when reactions dialog selected emoji is clicked
+ * @param emojiId selected emoji
+ * @param analyticsEvent Optional analytics event emitted from @atlaskit/tabs component
+ */
+export type onDialogSelectReactionChange = (emojiId: string, analyticsEvent: UIAnalyticsEvent) => void;
+/**
+ * MetaData for Reaction object
+ */
+export interface ReactionSummary {
+    /**
+     * Reaction Asset id in the container
+     */
+    ari: string;
+    /**
+     * the container for reactions/ari in the page
+     */
+    containerAri: string;
+    /**
+     * unique Atlassian identifier for an emoji
+     */
+    emojiId: string;
+    /**
+     * Number of selected count for the emoji
+     */
+    count: number;
+    /**
+     * Has the current user selected the emoji or not
+     */
+    reacted: boolean;
+    /**
+     * Users collection
+     */
+    users?: User[];
+    /**
+     * @deprecated Legacy content Not in use anymore
+     */
+    optimisticallyUpdated?: boolean;
+}
+/**
+ * Metadata for composing a summary of emojis that will be shown in the the primary view even if the reaction count is zero
+ */
+export interface QuickReactionEmojiSummary {
+    /**
+     * unique Atlassian identifier for an emoji (attached to the "emojiIds" when forming {@link ReactionSummary} object)
+     */
+    ari: string;
+    /**
+     * unique Atlassian identifier for the container grouping reactions/ari in the page (attached to the "emojiIds" when forming {@link ReactionSummary} object)
+     */
+    containerAri: string;
+    /**
+     * emoji ids collection that will be shown in the the primary view even if the reaction count is zero
+     */
+    emojiIds: string[];
+}
+/**
+ * Event handler for when the user clicks on the reaction
+ * @param id give id for the emoji
+ * @param event selected mouse event proerties
+ */
+export type ReactionClick = (id: string, event: React.MouseEvent<HTMLButtonElement>) => void;
+/**
+ * Event handler for when the user hovers with the mouse on the reaction
+ * @param emojiId id of emoji
+ * @param event (Optional) custom DOM event handler callback
+ */
+export type ReactionMouseEnter = (emojiId: string, event?: React.MouseEvent<any>) => void;
+/**
+ * Event handler for when the user focused on the reaction
+ * @param emojiId id of emoji
+ * @param event (Optional) custom DOM event handler callback
+ */
+export type ReactionFocused = (emojiId: string, event?: React.FocusEvent<any>) => void;
+/**
+ * Condition of the reaction when gets loaded from the store
+ */
+export declare enum ReactionStatus {
+    ready = "READY",
+    loading = "LOADING",
+    error = "ERROR",
+    notLoaded = "NOT_LOADED",
+    disabled = "DISABLED"
+}
+/**
+ * state in which the reaction is at
+ */
+export type ReactionsState = ReactionsNotLoaded | ReactionsLoading | ReactionsReadyState | ReactionsError;
+export type ReactionsReadyState = {
+    readonly status: ReactionStatus.ready;
+    readonly reactions: ReactionSummary[];
+};
+export type ReactionsLoading = {
+    readonly status: ReactionStatus.loading;
+};
+export type ReactionsError = {
+    readonly status: ReactionStatus.error;
+    readonly message: string;
+};
+export type ReactionsNotLoaded = {
+    readonly status: ReactionStatus.notLoaded;
+};
+/**
+ * Source where the emoji selected from ("quickSelector" -> default list, "emojiPicker" -> custom emoji list)
+ */
+export type ReactionSource = 'quickSelector' | 'emojiPicker';

package/dist/types-ts4.5/types/store.d.ts

@@ -0,0 +1,63 @@
+import { CreateUIAnalyticsEvent } from '@atlaskit/analytics-next';
+import { Actions } from './Actions';
+import { ReactionsState } from './reaction';
+/**
+ * Callback event when changes apply to the main store
+ * @param state latest store state
+ */
+export type OnChangeCallback = (state: State) => void;
+/**
+ * Map of state props
+ */
+export interface StoreProps {
+    /**
+     * Get current state of the stor
+     */
+    getState: () => State;
+    /**
+     * Register a callbsack event on change to the store instance state data
+     * @param callback event to register
+     * @deprecated initially implemented by the MemoryReactionsStore class and kept. This will be removed in a future release
+     */
+    onChange: (callback: OnChangeCallback) => void;
+    /**
+     * Deregister any callback event on changes to the store instance state data
+     * @param callback event to de-register
+     * @deprecated initially implemented by the MemoryReactionsStore class and kept. This will be removed in a future release
+     */
+    removeOnChangeListener: (callback: OnChangeCallback) => void;
+    /**
+     * Add Atlaskit analytics events to different operations in the store
+     * @param createAnalyticsEvent analytics event trigger
+     * @deprecated initially implemented by the MemoryReactionsStore class and kept. This will be removed in a future release
+     */
+    setCreateAnalyticsEvent?: (createAnalyticsEvent: CreateUIAnalyticsEvent) => void;
+}
+/**
+ * General Interface for a reaction store
+ */
+export interface Store extends Actions, StoreProps {
+}
+/**
+ * the "store" prop option to the connected view and picker components
+ */
+export type StorePropInput = Store | Promise<Store>;
+/**
+ * store main structure
+ */
+export type State = {
+    /**
+     * collection of the different reactions (key => unique reaction id , value => state of the reaction)
+     */
+    reactions: {
+        [key: string]: ReactionsState;
+    };
+    /**
+     * custom animation for given emojis as true|false (key => unique reaction id, value => collection of emojiIds and true|false to apply custom animation)
+     */
+    flash: {
+        [key: string]: {
+            [emojiId: string]: boolean;
+        };
+    };
+};

package/package.json

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