react-rewards-using-selector/dist/react-rewards-using-selector.d.ts

This package lets you easily add micro-interactions to your app and reward users with the rain of confetti, emoji or balloons.

type ConfettiConfig = {
    lifetime?: number;
    angle?: number;
    decay?: number;
    spread?: number;
    startVelocity?: number;
    elementCount?: number;
    elementSize?: number;
    zIndex?: number;
    position?: string;
    colors?: string[];
    onAnimationComplete?: () => void;
    fps?: number;
};

type EmojiConfig = {
    lifetime?: number;
    angle?: number;
    decay?: number;
    spread?: number;
    startVelocity?: number;
    elementCount?: number;
    elementSize?: number;
    zIndex?: number;
    position?: string;
    emoji?: string[];
    rotate?: boolean;
    onAnimationComplete?: () => void;
    fps?: number;
};

type BalloonsConfig = {
    lifetime?: number;
    angle?: number;
    decay?: number;
    spread?: number;
    startVelocity?: number;
    elementCount?: number;
    elementSize?: number;
    zIndex?: number;
    position?: string;
    colors?: string[];
    onAnimationComplete?: () => void;
    fps?: number;
};

interface RewardConfigs {
    confetti: ConfettiConfig;
    emoji: EmojiConfig;
    balloons: BalloonsConfig;
}
type RewardType = keyof RewardConfigs;
type RewardFunction = {
    reward: () => void;
    isAnimating: boolean;
};
type UseRewardType = <T extends RewardType>(selector: string, type: T, config?: RewardConfigs[T]) => RewardFunction;

declare const useReward: UseRewardType;

declare const confetti: (root: Element, internalAnimatingCallback: () => void, config?: ConfettiConfig) => void;

declare const balloons: (root: Element, internalAnimatingCallback: () => void, config?: BalloonsConfig) => void;

declare const emoji: (root: Element, internalAnimatingCallback: () => void, config?: EmojiConfig) => void;

export { balloons, confetti, emoji, useReward };