Calling Reactions
This commit is contained in:
parent
ab187ab265
commit
4603832258
24 changed files with 942 additions and 35 deletions
|
@ -20,6 +20,10 @@ import { usePrevious } from '../hooks/usePrevious';
|
|||
import { difference } from '../util/setUtil';
|
||||
|
||||
const DEFAULT_LIFETIME = 5000;
|
||||
const DEFAULT_TRANSITION_FROM = {
|
||||
opacity: 0,
|
||||
scale: 0.85,
|
||||
};
|
||||
|
||||
export type CallingToastType = {
|
||||
// If key is provided, calls to showToast will be idempotent; otherwise an
|
||||
|
@ -59,11 +63,15 @@ export function CallingToastProvider({
|
|||
children,
|
||||
region,
|
||||
maxNonPersistentToasts = 5,
|
||||
lifetime = DEFAULT_LIFETIME,
|
||||
transitionFrom = DEFAULT_TRANSITION_FROM,
|
||||
}: {
|
||||
i18n: LocalizerType;
|
||||
children: React.ReactNode;
|
||||
region?: React.RefObject<HTMLElement>;
|
||||
maxNonPersistentToasts?: number;
|
||||
lifetime?: number;
|
||||
transitionFrom?: object;
|
||||
}): JSX.Element {
|
||||
const [toasts, setToasts] = React.useState<Array<CallingToastStateType>>([]);
|
||||
const previousToasts = usePrevious([], toasts);
|
||||
|
@ -153,7 +161,7 @@ export function CallingToastProvider({
|
|||
}
|
||||
|
||||
if (toast.autoClose) {
|
||||
startTimer(key, DEFAULT_LIFETIME);
|
||||
startTimer(key, lifetime);
|
||||
nonPersistentToasts.unshift({ ...toast, key });
|
||||
} else {
|
||||
persistentToasts.unshift({ ...toast, key });
|
||||
|
@ -166,7 +174,7 @@ export function CallingToastProvider({
|
|||
|
||||
return key;
|
||||
},
|
||||
[startTimer, clearToastTimeout, maxNonPersistentToasts]
|
||||
[startTimer, clearToastTimeout, maxNonPersistentToasts, lifetime]
|
||||
);
|
||||
|
||||
const pauseAll = useCallback(() => {
|
||||
|
@ -225,9 +233,8 @@ export function CallingToastProvider({
|
|||
previousToasts[enteringItemIndex]
|
||||
);
|
||||
return {
|
||||
opacity: 0,
|
||||
...transitionFrom,
|
||||
zIndex: item.autoClose ? 1 : 2,
|
||||
scale: 0.85,
|
||||
marginTop:
|
||||
// If this toast is replacing an existing one, don't slide-down, just fade-in
|
||||
// Note: this just refers to toasts added / removed within one render cycle;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue