@muraldevkit/ui-toolkit 4.57.0 → 4.58.0-dev-PIuc.1
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.
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
+
import { MrlAvatarPropTypes } from '../../avatar/MrlAvatar';
|
|
2
3
|
import { NotificationKind } from '../constants';
|
|
3
4
|
export type MrlToastKind = NotificationKind | 'collaborator' | 'general';
|
|
4
5
|
export type MrlToastPosition = 'bottom' | 'top';
|
|
@@ -7,6 +8,10 @@ export interface MrlToastCTA {
|
|
|
7
8
|
text: string;
|
|
8
9
|
dataQa: string;
|
|
9
10
|
}
|
|
11
|
+
export interface MrlToastLink {
|
|
12
|
+
text: string;
|
|
13
|
+
url: string;
|
|
14
|
+
}
|
|
10
15
|
export interface MrlToastProps {
|
|
11
16
|
['data-qa']?: string;
|
|
12
17
|
/**
|
|
@@ -15,6 +20,22 @@ export interface MrlToastProps {
|
|
|
15
20
|
* Note: auto-closing is only possible when no interactive elements (e.g. close button & CTA's) exist on the toast notification
|
|
16
21
|
*/
|
|
17
22
|
autoClose?: boolean;
|
|
23
|
+
/**
|
|
24
|
+
* A MrlAvatar component instance to display in the toast notification.
|
|
25
|
+
*
|
|
26
|
+
* Note: This is only applicable when `kind` is set to 'collaborator'. When provided, the avatar will be shown instead of the default icon.
|
|
27
|
+
* The `showIcon` prop will be ignored when `avatar` is present.
|
|
28
|
+
*
|
|
29
|
+
* @example
|
|
30
|
+
* ```tsx
|
|
31
|
+
* <MrlToast
|
|
32
|
+
* kind="collaborator"
|
|
33
|
+
* avatar={<MrlAvatar name="John Doe" size="small" avatarColor="#FF5733" />}
|
|
34
|
+
* primaryMessage="John Doe joined the mural"
|
|
35
|
+
* />
|
|
36
|
+
* ```
|
|
37
|
+
*/
|
|
38
|
+
avatar?: React.ReactElement<MrlAvatarPropTypes>;
|
|
18
39
|
/**
|
|
19
40
|
* Sets the background color of the toast notification.
|
|
20
41
|
*
|
|
@@ -27,6 +48,7 @@ export interface MrlToastProps {
|
|
|
27
48
|
*/
|
|
28
49
|
closeAfterMs?: number;
|
|
29
50
|
kind?: MrlToastKind;
|
|
51
|
+
link?: MrlToastLink;
|
|
30
52
|
onClose?: () => void;
|
|
31
53
|
primaryCTA?: MrlToastCTA;
|
|
32
54
|
primaryMessage: string | JSX.Element;
|
|
@@ -41,4 +63,4 @@ export interface MrlToastProps {
|
|
|
41
63
|
* @param {MrlToastProps} props - The props for the MrlToast component.
|
|
42
64
|
* @returns {React.ReactElement} The MrlToast component.
|
|
43
65
|
*/
|
|
44
|
-
export declare const MrlToast: ({ ["data-qa"]: qa, autoClose, backgroundColor, className, closeAfterMs, kind, onClose, primaryCTA, primaryMessage, secondaryCTA, secondaryMessage, showCloseButton, showIcon, ...rest }: MrlToastProps) => React.ReactElement;
|
|
66
|
+
export declare const MrlToast: ({ ["data-qa"]: qa, autoClose, avatar, backgroundColor, className, closeAfterMs, kind, link, onClose, primaryCTA, primaryMessage, secondaryCTA, secondaryMessage, showCloseButton, showIcon, ...rest }: MrlToastProps) => React.ReactElement;
|