@ttt-productions/ui-core 0.4.2 → 0.4.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/react/components/toast.d.ts +3 -1
- package/dist/react/components/toast.d.ts.map +1 -1
- package/dist/react/components/toast.js +8 -5
- package/dist/react/components/toast.js.map +1 -1
- package/dist/react/components/toaster.d.ts.map +1 -1
- package/dist/react/components/toaster.js +2 -2
- package/dist/react/components/toaster.js.map +1 -1
- package/dist/react/hooks/use-toast.d.ts +6 -0
- package/dist/react/hooks/use-toast.d.ts.map +1 -1
- package/dist/react/hooks/use-toast.js +8 -2
- package/dist/react/hooks/use-toast.js.map +1 -1
- package/package.json +1 -1
- package/src/react/components/toast.tsx +22 -14
- package/src/react/components/toaster.tsx +3 -2
- package/src/react/hooks/use-toast.tsx +15 -2
|
@@ -6,10 +6,12 @@ declare const ToastViewport: React.ForwardRefExoticComponent<Omit<ToastPrimitive
|
|
|
6
6
|
declare const Toast: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastProps & React.RefAttributes<HTMLLIElement>, "ref"> & VariantProps<(props?: ({
|
|
7
7
|
variant?: "default" | "destructive" | "success" | "warning" | "error" | null | undefined;
|
|
8
8
|
} & import("class-variance-authority/types").ClassProp) | undefined) => string> & {
|
|
9
|
-
/** ms */
|
|
9
|
+
/** ms; ignored when `persistent` is true */
|
|
10
10
|
duration?: number;
|
|
11
11
|
/** show X button */
|
|
12
12
|
dismissible?: boolean;
|
|
13
|
+
/** When true: no auto-dismiss, no countdown bar. */
|
|
14
|
+
persistent?: boolean;
|
|
13
15
|
} & React.RefAttributes<HTMLLIElement>>;
|
|
14
16
|
declare const ToastAction: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastActionProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
15
17
|
declare const ToastClose: React.ForwardRefExoticComponent<Omit<ToastPrimitives.ToastCloseProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../../src/react/components/toast.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,eAAe,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAmDlE,QAAA,MAAM,aAAa,8CAA2B,CAAC;AAE/C,QAAA,MAAM,aAAa,kKAajB,CAAC;
|
|
1
|
+
{"version":3,"file":"toast.d.ts","sourceRoot":"","sources":["../../../src/react/components/toast.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,eAAe,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAmDlE,QAAA,MAAM,aAAa,8CAA2B,CAAC;AAE/C,QAAA,MAAM,aAAa,kKAajB,CAAC;AAaH,QAAA,MAAM,KAAK;;;IARP,4CAA4C;eACjC,MAAM;IACjB,oBAAoB;kBACN,OAAO;IACrB,oDAAoD;iBACvC,OAAO;uCAwDvB,CAAC;AAGF,QAAA,MAAM,WAAW,kKAKf,CAAC;AAGH,QAAA,MAAM,UAAU,iKAcd,CAAC;AAGH,QAAA,MAAM,UAAU,2JAKd,CAAC;AAGH,QAAA,MAAM,gBAAgB,iKAKpB,CAAC;AAGH,mCAAmC;AACnC,MAAM,MAAM,UAAU,GAAG,KAAK,CAAC,wBAAwB,CAAC,OAAO,KAAK,CAAC,CAAC;AACtE,MAAM,MAAM,kBAAkB,GAAG,KAAK,CAAC,YAAY,CAAC,OAAO,WAAW,CAAC,CAAC;AAExE,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,UAAU,EAAE,WAAW,EAAE,CAAC"}
|
|
@@ -39,18 +39,21 @@ const toastVariants = cva(cn(
|
|
|
39
39
|
const ToastProvider = ToastPrimitives.Provider;
|
|
40
40
|
const ToastViewport = React.forwardRef(({ className, ...props }, ref) => (_jsx(ToastPrimitives.Viewport, { ref: ref, className: cn("fixed top-0 left-1/2 -translate-x-1/2 z-[100] flex max-h-screen w-full flex-col gap-2 p-4", "sm:max-w-[480px] md:max-w-[600px]", className), ...props })));
|
|
41
41
|
ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
|
|
42
|
-
const Toast = React.forwardRef(({ className, variant, duration =
|
|
42
|
+
const Toast = React.forwardRef(({ className, variant, duration, dismissible = true, persistent = false, style, children, ...props }, ref) => {
|
|
43
|
+
// Caller is the source of truth for duration. Persistent toasts disable
|
|
44
|
+
// the auto-dismiss entirely by passing `Infinity` to Radix.
|
|
45
|
+
const effectiveDuration = persistent ? Infinity : (duration ?? 5000);
|
|
43
46
|
// pass duration to Radix AND to CSS countdown bar
|
|
44
47
|
const mergedStyle = {
|
|
45
48
|
...style,
|
|
46
|
-
["--toast-duration"]: `${
|
|
49
|
+
["--toast-duration"]: `${effectiveDuration}ms`,
|
|
47
50
|
};
|
|
48
|
-
return (_jsxs(ToastPrimitives.Root, { ref: ref, duration:
|
|
51
|
+
return (_jsxs(ToastPrimitives.Root, { ref: ref, duration: effectiveDuration, "data-variant": variant, "data-persistent": persistent ? "" : undefined, className: cn(toastVariants({ variant }), className), style: mergedStyle, ...props, children: [_jsx(ToastKeyframes, {}), children, !persistent ? (_jsx("div", { className: cn("absolute bottom-0 left-0 h-1 w-full bg-foreground/30", "origin-left"), style: {
|
|
49
52
|
animationName: "toast-progress",
|
|
50
|
-
animationDuration: `${
|
|
53
|
+
animationDuration: `${effectiveDuration}ms`,
|
|
51
54
|
animationTimingFunction: "linear",
|
|
52
55
|
animationFillMode: "forwards",
|
|
53
|
-
} }), dismissible ? (_jsx(ToastPrimitives.Close, { className: cn("absolute right-2 top-2 inline-flex h-7 w-7 items-center justify-center rounded-md", "text-foreground/60 hover:text-foreground", "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:ring-offset-background"), "aria-label": "Dismiss toast", children: _jsx(X, { className: "h-4 w-4" }) })) : null] }));
|
|
56
|
+
} })) : null, dismissible ? (_jsx(ToastPrimitives.Close, { className: cn("absolute right-2 top-2 inline-flex h-7 w-7 items-center justify-center rounded-md", "text-foreground/60 hover:text-foreground", "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:ring-offset-background"), "aria-label": "Dismiss toast", children: _jsx(X, { className: "h-4 w-4" }) })) : null] }));
|
|
54
57
|
});
|
|
55
58
|
Toast.displayName = ToastPrimitives.Root.displayName;
|
|
56
59
|
const ToastAction = React.forwardRef(({ className, ...props }, ref) => (_jsx(ToastPrimitives.Action, { ref: ref, className: cn(className), ...props })));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.js","sourceRoot":"","sources":["../../../src/react/components/toast.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,eAAe,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAClE,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AAEjC,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAC;AAExC;;;;;GAKG;AACH,SAAS,cAAc;IACrB,oEAAoE;IACpE,OAAO,CACL;QACE,2CAA2C;QAC3C,uBAAuB,EAAE;YACvB,MAAM,EAAE,6EAA6E;SACtF,GACD,CACH,CAAC;AACJ,CAAC;AAED,MAAM,aAAa,GAAG,GAAG,CACvB,EAAE;AACA,OAAO;AACP,yKAAyK;AACzK,wBAAwB;AACxB,8DAA8D,EAC9D,8DAA8D,EAC9D,oFAAoF,EACpF,iEAAiE,EACjE,6FAA6F,EAC7F,uEAAuE,CACxE,EACD;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,EAAE;YACX,WAAW,EAAE,sCAAsC;YACnD,OAAO,EAAE,8CAA8C;YACvD,OAAO,EAAE,0CAA0C;YACnD,KAAK,EAAE,sCAAsC;SAC9C;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;KACnB;CACF,CACF,CAAC;AAEF,MAAM,aAAa,GAAG,eAAe,CAAC,QAAQ,CAAC;AAE/C,MAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CAGpC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAClC,KAAC,eAAe,CAAC,QAAQ,IACvB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,2FAA2F,EAC3F,mCAAmC,EACnC,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC,CAAC;AACH,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC,QAAQ,CAAC,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"toast.js","sourceRoot":"","sources":["../../../src/react/components/toast.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toaster.d.ts","sourceRoot":"","sources":["../../../src/react/components/toaster.tsx"],"names":[],"mappings":"AAMA,wBAAgB,OAAO,
|
|
1
|
+
{"version":3,"file":"toaster.d.ts","sourceRoot":"","sources":["../../../src/react/components/toaster.tsx"],"names":[],"mappings":"AAMA,wBAAgB,OAAO,4CAoCtB"}
|
|
@@ -5,9 +5,9 @@ import { useToast } from "../hooks/use-toast.js";
|
|
|
5
5
|
export function Toaster() {
|
|
6
6
|
const { toasts } = useToast();
|
|
7
7
|
return (_jsxs(ToastProvider, { swipeDirection: "right", swipeThreshold: 32, children: [toasts.map((t) => {
|
|
8
|
-
const { id, title, description, action, variant, duration, dismissible, open, onOpenChange, ...props } = t;
|
|
8
|
+
const { id, title, description, action, variant, duration, dismissible, persistent, open, onOpenChange, ...props } = t;
|
|
9
9
|
const v = variant === "error" ? "destructive" : (variant ?? "default");
|
|
10
|
-
return (_jsxs(Toast, { open: open, onOpenChange: onOpenChange, variant: v, duration: duration
|
|
10
|
+
return (_jsxs(Toast, { open: open, onOpenChange: onOpenChange, variant: v, duration: duration, dismissible: dismissible ?? true, persistent: persistent ?? false, ...props, children: [_jsxs("div", { className: "grid gap-1 pr-10", children: [title ? _jsx(ToastTitle, { className: "font-bold", children: title }) : null, description ? _jsx(ToastDescription, { className: "font-bold", children: description }) : null] }), action, _jsx(ToastClose, {})] }, id));
|
|
11
11
|
}), _jsx(ToastViewport, {})] }));
|
|
12
12
|
}
|
|
13
13
|
//# sourceMappingURL=toaster.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toaster.js","sourceRoot":"","sources":["../../../src/react/components/toaster.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,aAAa,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3G,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAGjD,MAAM,UAAU,OAAO;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAgC,CAAC;IAE5D,OAAO,CACL,MAAC,aAAa,IAAC,cAAc,EAAC,OAAO,EAAC,cAAc,EAAE,EAAE,aACrD,MAAM,CAAC,GAAG,CAAC,CAAC,CAAe,EAAE,EAAE;gBAC9B,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,IAAI,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,GAAG,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"toaster.js","sourceRoot":"","sources":["../../../src/react/components/toaster.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,gBAAgB,EAAE,aAAa,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3G,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAGjD,MAAM,UAAU,OAAO;IACrB,MAAM,EAAE,MAAM,EAAE,GAAG,QAAQ,EAAgC,CAAC;IAE5D,OAAO,CACL,MAAC,aAAa,IAAC,cAAc,EAAC,OAAO,EAAC,cAAc,EAAE,EAAE,aACrD,MAAM,CAAC,GAAG,CAAC,CAAC,CAAe,EAAE,EAAE;gBAC9B,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,UAAU,EAAE,IAAI,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,GAAG,CAAC,CAAC;gBAEvH,MAAM,CAAC,GACL,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,OAAO,IAAI,SAAS,CAAC,CAAC;gBAE/D,OAAO,CACL,MAAC,KAAK,IAEJ,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,YAAY,EAC1B,OAAO,EAAE,CAAQ,EACjB,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,IAAI,IAAI,EAChC,UAAU,EAAE,UAAU,IAAI,KAAK,KAC1B,KAAa,aAElB,eAAK,SAAS,EAAC,kBAAkB,aAC9B,KAAK,CAAC,CAAC,CAAC,KAAC,UAAU,IAAC,SAAS,EAAC,WAAW,YAAE,KAAK,GAAc,CAAC,CAAC,CAAC,IAAI,EACrE,WAAW,CAAC,CAAC,CAAC,KAAC,gBAAgB,IAAC,SAAS,EAAC,WAAW,YAAE,WAAW,GAAoB,CAAC,CAAC,CAAC,IAAI,IAC1F,EACL,MAAM,EACP,KAAC,UAAU,KAAG,KAdT,EAAE,CAeD,CACT,CAAC;YACJ,CAAC,CAAC,EAGF,KAAC,aAAa,KAAG,IACH,CACjB,CAAC;AACJ,CAAC"}
|
|
@@ -13,6 +13,12 @@ export type ToasterToast = {
|
|
|
13
13
|
duration?: number;
|
|
14
14
|
/** show X button */
|
|
15
15
|
dismissible?: boolean;
|
|
16
|
+
/**
|
|
17
|
+
* When `true`, the toast does not auto-dismiss and renders no countdown bar.
|
|
18
|
+
* `duration` is ignored. The user must click the X (or programmatic `dismiss`)
|
|
19
|
+
* to remove it.
|
|
20
|
+
*/
|
|
21
|
+
persistent?: boolean;
|
|
16
22
|
};
|
|
17
23
|
type ToastProps = ToasterToast;
|
|
18
24
|
export declare function toast(input: Omit<ToastProps, "id">): {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-toast.d.ts","sourceRoot":"","sources":["../../../src/react/hooks/use-toast.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"use-toast.d.ts","sourceRoot":"","sources":["../../../src/react/hooks/use-toast.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,aAAa,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AAEvF,MAAM,MAAM,YAAY,GAAG;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB,kCAAkC;IAClC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAEvC,SAAS;IACT,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,oBAAoB;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,KAAK,UAAU,GAAG,YAAY,CAAC;AAuF/B,wBAAgB,KAAK,CAAC,KAAK,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC;;;oBAQ1B,OAAO,CAAC,UAAU,CAAC;EAwB3C;AAED,wBAAgB,QAAQ;;wBAcA,MAAM;YA9HpB,UAAU,EAAE;EAmIrB"}
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
const TOAST_LIMIT = 3;
|
|
3
|
-
|
|
3
|
+
// Time between Radix flipping `open=false` and the toast actually unmounting.
|
|
4
|
+
// Just long enough for the close animation to finish. Larger values produce a
|
|
5
|
+
// visible dead-air gap after the countdown bar reaches empty.
|
|
6
|
+
const TOAST_REMOVE_DELAY = 150;
|
|
4
7
|
const toastTimeouts = new Map();
|
|
5
8
|
const listeners = [];
|
|
6
9
|
let memoryState = { toasts: [] };
|
|
@@ -71,7 +74,10 @@ export function toast(input) {
|
|
|
71
74
|
};
|
|
72
75
|
const update = (props) => dispatch({ type: "UPDATE_TOAST", toast: { ...props, id } });
|
|
73
76
|
const variant = input.variant ?? "default";
|
|
74
|
-
|
|
77
|
+
// Persistent toasts disable auto-dismiss entirely; Radix accepts `Infinity`.
|
|
78
|
+
const duration = input.persistent
|
|
79
|
+
? Infinity
|
|
80
|
+
: input.duration ?? defaultDurationForVariant(variant);
|
|
75
81
|
dispatch({
|
|
76
82
|
type: "ADD_TOAST",
|
|
77
83
|
toast: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-toast.js","sourceRoot":"","sources":["../../../src/react/hooks/use-toast.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,MAAM,WAAW,GAAG,CAAC,CAAC;AACtB,MAAM,kBAAkB,GAAG,
|
|
1
|
+
{"version":3,"file":"use-toast.js","sourceRoot":"","sources":["../../../src/react/hooks/use-toast.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -71,25 +71,31 @@ ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
|
|
|
71
71
|
|
|
72
72
|
type ToastRootProps = React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> &
|
|
73
73
|
VariantProps<typeof toastVariants> & {
|
|
74
|
-
/** ms */
|
|
74
|
+
/** ms; ignored when `persistent` is true */
|
|
75
75
|
duration?: number;
|
|
76
76
|
/** show X button */
|
|
77
77
|
dismissible?: boolean;
|
|
78
|
+
/** When true: no auto-dismiss, no countdown bar. */
|
|
79
|
+
persistent?: boolean;
|
|
78
80
|
};
|
|
79
81
|
|
|
80
82
|
const Toast = React.forwardRef<React.ElementRef<typeof ToastPrimitives.Root>, ToastRootProps>(
|
|
81
|
-
({ className, variant, duration =
|
|
83
|
+
({ className, variant, duration, dismissible = true, persistent = false, style, children, ...props }, ref) => {
|
|
84
|
+
// Caller is the source of truth for duration. Persistent toasts disable
|
|
85
|
+
// the auto-dismiss entirely by passing `Infinity` to Radix.
|
|
86
|
+
const effectiveDuration = persistent ? Infinity : (duration ?? 5000);
|
|
82
87
|
// pass duration to Radix AND to CSS countdown bar
|
|
83
88
|
const mergedStyle: React.CSSProperties = {
|
|
84
89
|
...(style as React.CSSProperties),
|
|
85
|
-
["--toast-duration" as any]: `${
|
|
90
|
+
["--toast-duration" as any]: `${effectiveDuration}ms`,
|
|
86
91
|
};
|
|
87
92
|
|
|
88
93
|
return (
|
|
89
94
|
<ToastPrimitives.Root
|
|
90
95
|
ref={ref}
|
|
91
|
-
duration={
|
|
96
|
+
duration={effectiveDuration}
|
|
92
97
|
data-variant={variant}
|
|
98
|
+
data-persistent={persistent ? "" : undefined}
|
|
93
99
|
className={cn(toastVariants({ variant }), className)}
|
|
94
100
|
style={mergedStyle}
|
|
95
101
|
{...props}
|
|
@@ -97,16 +103,18 @@ const Toast = React.forwardRef<React.ElementRef<typeof ToastPrimitives.Root>, To
|
|
|
97
103
|
<ToastKeyframes />
|
|
98
104
|
{children}
|
|
99
105
|
|
|
100
|
-
{/* countdown bar */}
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
106
|
+
{/* countdown bar — hidden entirely for persistent toasts */}
|
|
107
|
+
{!persistent ? (
|
|
108
|
+
<div
|
|
109
|
+
className={cn("absolute bottom-0 left-0 h-1 w-full bg-foreground/30", "origin-left")}
|
|
110
|
+
style={{
|
|
111
|
+
animationName: "toast-progress",
|
|
112
|
+
animationDuration: `${effectiveDuration}ms`,
|
|
113
|
+
animationTimingFunction: "linear",
|
|
114
|
+
animationFillMode: "forwards",
|
|
115
|
+
}}
|
|
116
|
+
/>
|
|
117
|
+
) : null}
|
|
110
118
|
|
|
111
119
|
{/* dismiss button */}
|
|
112
120
|
{dismissible ? (
|
|
@@ -10,7 +10,7 @@ export function Toaster() {
|
|
|
10
10
|
return (
|
|
11
11
|
<ToastProvider swipeDirection="right" swipeThreshold={32}>
|
|
12
12
|
{toasts.map((t: ToasterToast) => {
|
|
13
|
-
const { id, title, description, action, variant, duration, dismissible, open, onOpenChange, ...props } = t;
|
|
13
|
+
const { id, title, description, action, variant, duration, dismissible, persistent, open, onOpenChange, ...props } = t;
|
|
14
14
|
|
|
15
15
|
const v: ToastVariant | "destructive" =
|
|
16
16
|
variant === "error" ? "destructive" : (variant ?? "default");
|
|
@@ -21,8 +21,9 @@ export function Toaster() {
|
|
|
21
21
|
open={open}
|
|
22
22
|
onOpenChange={onOpenChange}
|
|
23
23
|
variant={v as any}
|
|
24
|
-
duration={duration
|
|
24
|
+
duration={duration}
|
|
25
25
|
dismissible={dismissible ?? true}
|
|
26
|
+
persistent={persistent ?? false}
|
|
26
27
|
{...(props as any)}
|
|
27
28
|
>
|
|
28
29
|
<div className="grid gap-1 pr-10">
|
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
|
|
3
3
|
const TOAST_LIMIT = 3;
|
|
4
|
-
|
|
4
|
+
// Time between Radix flipping `open=false` and the toast actually unmounting.
|
|
5
|
+
// Just long enough for the close animation to finish. Larger values produce a
|
|
6
|
+
// visible dead-air gap after the countdown bar reaches empty.
|
|
7
|
+
const TOAST_REMOVE_DELAY = 150;
|
|
5
8
|
|
|
6
9
|
export type ToastVariant = "default" | "destructive" | "success" | "warning" | "error";
|
|
7
10
|
|
|
@@ -21,6 +24,13 @@ export type ToasterToast = {
|
|
|
21
24
|
|
|
22
25
|
/** show X button */
|
|
23
26
|
dismissible?: boolean;
|
|
27
|
+
|
|
28
|
+
/**
|
|
29
|
+
* When `true`, the toast does not auto-dismiss and renders no countdown bar.
|
|
30
|
+
* `duration` is ignored. The user must click the X (or programmatic `dismiss`)
|
|
31
|
+
* to remove it.
|
|
32
|
+
*/
|
|
33
|
+
persistent?: boolean;
|
|
24
34
|
};
|
|
25
35
|
|
|
26
36
|
type ToastProps = ToasterToast;
|
|
@@ -121,7 +131,10 @@ export function toast(input: Omit<ToastProps, "id">) {
|
|
|
121
131
|
const update = (props: Partial<ToastProps>) => dispatch({ type: "UPDATE_TOAST", toast: { ...props, id } });
|
|
122
132
|
|
|
123
133
|
const variant = input.variant ?? "default";
|
|
124
|
-
|
|
134
|
+
// Persistent toasts disable auto-dismiss entirely; Radix accepts `Infinity`.
|
|
135
|
+
const duration = input.persistent
|
|
136
|
+
? Infinity
|
|
137
|
+
: input.duration ?? defaultDurationForVariant(variant);
|
|
125
138
|
|
|
126
139
|
dispatch({
|
|
127
140
|
type: "ADD_TOAST",
|