@snack-uikit/toaster 0.8.17-preview-bc9ca5dd.0 → 0.8.17
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/CHANGELOG.md +10 -0
- package/README.md +3 -9
- package/dist/cjs/components/ToastSystemEvent/styles.module.css +3 -2
- package/dist/cjs/components/ToasterContainer/styles.module.css +9 -9
- package/dist/cjs/components/index.d.ts +0 -1
- package/dist/cjs/components/index.js +1 -2
- package/dist/cjs/constants.d.ts +5 -10
- package/dist/cjs/constants.js +4 -77
- package/dist/cjs/helperComponents/ButtonAction/styles.module.css +2 -2
- package/dist/cjs/helpers.js +1 -43
- package/dist/cjs/index.d.ts +2 -2
- package/dist/cjs/testIds.d.ts +0 -14
- package/dist/cjs/testIds.js +1 -16
- package/dist/cjs/types.d.ts +1 -9
- package/dist/esm/components/ToastSystemEvent/styles.module.css +3 -2
- package/dist/esm/components/ToasterContainer/styles.module.css +9 -9
- package/dist/esm/components/index.d.ts +0 -1
- package/dist/esm/components/index.js +0 -1
- package/dist/esm/constants.d.ts +5 -10
- package/dist/esm/constants.js +0 -76
- package/dist/esm/helperComponents/ButtonAction/styles.module.css +2 -2
- package/dist/esm/helpers.js +0 -38
- package/dist/esm/index.d.ts +2 -2
- package/dist/esm/testIds.d.ts +0 -14
- package/dist/esm/testIds.js +0 -15
- package/dist/esm/types.d.ts +1 -9
- package/package.json +5 -6
- package/src/components/ToastSystemEvent/styles.module.scss +2 -2
- package/src/components/ToasterContainer/styles.module.scss +1 -1
- package/src/components/index.ts +0 -1
- package/src/constants.ts +2 -91
- package/src/helpers.tsx +0 -35
- package/src/index.ts +1 -7
- package/src/testIds.ts +0 -17
- package/src/types.ts +1 -7
- package/dist/cjs/components/ToastUpload/ToastUpload.d.ts +0 -60
- package/dist/cjs/components/ToastUpload/ToastUpload.js +0 -122
- package/dist/cjs/components/ToastUpload/ToastUploadToaster.d.ts +0 -3
- package/dist/cjs/components/ToastUpload/ToastUploadToaster.js +0 -16
- package/dist/cjs/components/ToastUpload/constants.d.ts +0 -16
- package/dist/cjs/components/ToastUpload/constants.js +0 -26
- package/dist/cjs/components/ToastUpload/helperComponents/ButtonIcon/ButtonIcon.d.ts +0 -3
- package/dist/cjs/components/ToastUpload/helperComponents/ButtonIcon/ButtonIcon.js +0 -32
- package/dist/cjs/components/ToastUpload/helperComponents/ButtonIcon/index.d.ts +0 -1
- package/dist/cjs/components/ToastUpload/helperComponents/ButtonIcon/index.js +0 -25
- package/dist/cjs/components/ToastUpload/helperComponents/ButtonIcon/styles.module.css +0 -30
- package/dist/cjs/components/ToastUpload/helperComponents/FileItem/FileItem.d.ts +0 -5
- package/dist/cjs/components/ToastUpload/helperComponents/FileItem/FileItem.js +0 -85
- package/dist/cjs/components/ToastUpload/helperComponents/FileItem/index.d.ts +0 -1
- package/dist/cjs/components/ToastUpload/helperComponents/FileItem/index.js +0 -25
- package/dist/cjs/components/ToastUpload/helperComponents/FileItem/styles.module.css +0 -85
- package/dist/cjs/components/ToastUpload/helperComponents/LoadingStatus/LoadingStatus.d.ts +0 -6
- package/dist/cjs/components/ToastUpload/helperComponents/LoadingStatus/LoadingStatus.js +0 -42
- package/dist/cjs/components/ToastUpload/helperComponents/LoadingStatus/index.d.ts +0 -1
- package/dist/cjs/components/ToastUpload/helperComponents/LoadingStatus/index.js +0 -25
- package/dist/cjs/components/ToastUpload/helperComponents/LoadingStatus/styles.module.css +0 -3
- package/dist/cjs/components/ToastUpload/index.d.ts +0 -1
- package/dist/cjs/components/ToastUpload/index.js +0 -25
- package/dist/cjs/components/ToastUpload/styles.module.css +0 -110
- package/dist/cjs/components/ToastUpload/types.d.ts +0 -59
- package/dist/cjs/components/ToastUpload/types.js +0 -5
- package/dist/cjs/components/ToastUpload/utils/formatPercent.d.ts +0 -1
- package/dist/cjs/components/ToastUpload/utils/formatPercent.js +0 -8
- package/dist/cjs/components/ToastUpload/utils/index.d.ts +0 -1
- package/dist/cjs/components/ToastUpload/utils/index.js +0 -25
- package/dist/cjs/helperComponents/ButtonTextNeutral/ButtonTextNeutral.d.ts +0 -7
- package/dist/cjs/helperComponents/ButtonTextNeutral/ButtonTextNeutral.js +0 -28
- package/dist/cjs/helperComponents/ButtonTextNeutral/index.d.ts +0 -1
- package/dist/cjs/helperComponents/ButtonTextNeutral/index.js +0 -25
- package/dist/cjs/helperComponents/ButtonTextNeutral/styles.module.css +0 -32
- package/dist/esm/components/ToastUpload/ToastUpload.d.ts +0 -60
- package/dist/esm/components/ToastUpload/ToastUpload.js +0 -36
- package/dist/esm/components/ToastUpload/ToastUploadToaster.d.ts +0 -3
- package/dist/esm/components/ToastUpload/ToastUploadToaster.js +0 -7
- package/dist/esm/components/ToastUpload/constants.d.ts +0 -16
- package/dist/esm/components/ToastUpload/constants.js +0 -20
- package/dist/esm/components/ToastUpload/helperComponents/ButtonIcon/ButtonIcon.d.ts +0 -3
- package/dist/esm/components/ToastUpload/helperComponents/ButtonIcon/ButtonIcon.js +0 -18
- package/dist/esm/components/ToastUpload/helperComponents/ButtonIcon/index.d.ts +0 -1
- package/dist/esm/components/ToastUpload/helperComponents/ButtonIcon/index.js +0 -1
- package/dist/esm/components/ToastUpload/helperComponents/ButtonIcon/styles.module.css +0 -30
- package/dist/esm/components/ToastUpload/helperComponents/FileItem/FileItem.d.ts +0 -5
- package/dist/esm/components/ToastUpload/helperComponents/FileItem/FileItem.js +0 -23
- package/dist/esm/components/ToastUpload/helperComponents/FileItem/index.d.ts +0 -1
- package/dist/esm/components/ToastUpload/helperComponents/FileItem/index.js +0 -1
- package/dist/esm/components/ToastUpload/helperComponents/FileItem/styles.module.css +0 -85
- package/dist/esm/components/ToastUpload/helperComponents/LoadingStatus/LoadingStatus.d.ts +0 -6
- package/dist/esm/components/ToastUpload/helperComponents/LoadingStatus/LoadingStatus.js +0 -16
- package/dist/esm/components/ToastUpload/helperComponents/LoadingStatus/index.d.ts +0 -1
- package/dist/esm/components/ToastUpload/helperComponents/LoadingStatus/index.js +0 -1
- package/dist/esm/components/ToastUpload/helperComponents/LoadingStatus/styles.module.css +0 -3
- package/dist/esm/components/ToastUpload/index.d.ts +0 -1
- package/dist/esm/components/ToastUpload/index.js +0 -1
- package/dist/esm/components/ToastUpload/styles.module.css +0 -110
- package/dist/esm/components/ToastUpload/types.d.ts +0 -59
- package/dist/esm/components/ToastUpload/types.js +0 -1
- package/dist/esm/components/ToastUpload/utils/formatPercent.d.ts +0 -1
- package/dist/esm/components/ToastUpload/utils/formatPercent.js +0 -1
- package/dist/esm/components/ToastUpload/utils/index.d.ts +0 -1
- package/dist/esm/components/ToastUpload/utils/index.js +0 -1
- package/dist/esm/helperComponents/ButtonTextNeutral/ButtonTextNeutral.d.ts +0 -7
- package/dist/esm/helperComponents/ButtonTextNeutral/ButtonTextNeutral.js +0 -5
- package/dist/esm/helperComponents/ButtonTextNeutral/index.d.ts +0 -1
- package/dist/esm/helperComponents/ButtonTextNeutral/index.js +0 -1
- package/dist/esm/helperComponents/ButtonTextNeutral/styles.module.css +0 -32
- package/src/components/ToastUpload/ToastUpload.tsx +0 -169
- package/src/components/ToastUpload/ToastUploadToaster.tsx +0 -11
- package/src/components/ToastUpload/constants.ts +0 -26
- package/src/components/ToastUpload/helperComponents/ButtonIcon/ButtonIcon.tsx +0 -10
- package/src/components/ToastUpload/helperComponents/ButtonIcon/index.ts +0 -1
- package/src/components/ToastUpload/helperComponents/ButtonIcon/styles.module.scss +0 -45
- package/src/components/ToastUpload/helperComponents/FileItem/FileItem.tsx +0 -76
- package/src/components/ToastUpload/helperComponents/FileItem/index.ts +0 -1
- package/src/components/ToastUpload/helperComponents/FileItem/styles.module.scss +0 -93
- package/src/components/ToastUpload/helperComponents/LoadingStatus/LoadingStatus.tsx +0 -38
- package/src/components/ToastUpload/helperComponents/LoadingStatus/index.ts +0 -1
- package/src/components/ToastUpload/helperComponents/LoadingStatus/styles.module.scss +0 -8
- package/src/components/ToastUpload/index.ts +0 -1
- package/src/components/ToastUpload/styles.module.scss +0 -123
- package/src/components/ToastUpload/types.ts +0 -67
- package/src/components/ToastUpload/utils/formatPercent.ts +0 -1
- package/src/components/ToastUpload/utils/index.ts +0 -1
- package/src/helperComponents/ButtonTextNeutral/ButtonTextNeutral.tsx +0 -23
- package/src/helperComponents/ButtonTextNeutral/index.ts +0 -1
- package/src/helperComponents/ButtonTextNeutral/styles.module.scss +0 -42
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,16 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## 0.8.17 (2025-03-05)
|
|
7
|
+
|
|
8
|
+
### Only dependencies have been changed
|
|
9
|
+
* [@snack-uikit/link@0.15.13](https://github.com/cloud-ru-tech/snack-uikit/blob/master/packages/link/CHANGELOG.md)
|
|
10
|
+
* [@snack-uikit/truncate-string@0.6.13](https://github.com/cloud-ru-tech/snack-uikit/blob/master/packages/truncate-string/CHANGELOG.md)
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
6
16
|
## 0.8.16 (2025-03-04)
|
|
7
17
|
|
|
8
18
|
### Only dependencies have been changed
|
package/README.md
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
# Toaster
|
|
2
2
|
|
|
3
3
|
## Installation
|
|
4
|
-
|
|
5
4
|
`npm i @snack-uikit/toaster`
|
|
6
5
|
|
|
7
6
|
[Changelog](./CHANGELOG.md)
|
|
@@ -22,8 +21,8 @@ toaster.userAction.update.error(userActionId, { label: 'new text' });
|
|
|
22
21
|
|
|
23
22
|
// update systemEvent toast
|
|
24
23
|
toaster.systemEvent.update.error(systemEventId, {
|
|
25
|
-
|
|
26
|
-
|
|
24
|
+
title: 'new text',
|
|
25
|
+
description: 'new description',
|
|
27
26
|
});
|
|
28
27
|
|
|
29
28
|
// dismiss userAction toast
|
|
@@ -31,14 +30,9 @@ toaster.userAction.dismiss(userActionId);
|
|
|
31
30
|
|
|
32
31
|
// dismiss systemEvent toast
|
|
33
32
|
toaster.systemEvent.dismiss(systemEventId);
|
|
34
|
-
|
|
35
|
-
// create or update upload toast
|
|
36
|
-
const uploadToastId = toaster.upload.startOrUpdate(options);
|
|
37
|
-
|
|
38
|
-
// dismiss upload toast
|
|
39
|
-
toaster.upload.dismiss(uploadToastId);
|
|
40
33
|
```
|
|
41
34
|
|
|
35
|
+
|
|
42
36
|
## Props
|
|
43
37
|
|
|
44
38
|
```typescript jsx
|
|
@@ -4,8 +4,9 @@
|
|
|
4
4
|
}
|
|
5
5
|
|
|
6
6
|
.buttonClose{
|
|
7
|
+
width:var(--size-toaster-toast-system-event-button-close, 24px);
|
|
8
|
+
height:var(--size-toaster-toast-system-event-button-close, 24px);
|
|
7
9
|
border-radius:var(--radius-toaster-toast-system-event-button, 8px);
|
|
8
|
-
height:var(--size-toaster-toast-system-event-button-neutral, 24px);
|
|
9
10
|
cursor:pointer;
|
|
10
11
|
display:flex;
|
|
11
12
|
align-items:center;
|
|
@@ -107,7 +108,7 @@
|
|
|
107
108
|
display:flex;
|
|
108
109
|
flex-direction:column;
|
|
109
110
|
box-sizing:border-box;
|
|
110
|
-
width:calc(var(--size-toaster-toast-system-event-container, 320px) - 2 * var(--space-toaster-
|
|
111
|
+
width:calc(var(--size-toaster-toast-system-event-container, 320px) - 2 * var(--space-toaster-system-event-padding, 8px));
|
|
111
112
|
max-width:100%;
|
|
112
113
|
}
|
|
113
114
|
.container:hover .progress{
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
.buttonCloseColumnWrapper{
|
|
2
|
-
gap:var(--space-toaster-
|
|
3
|
-
padding:var(--space-toaster-
|
|
2
|
+
gap:var(--space-toaster-system-event-gap, 8px);
|
|
3
|
+
padding:var(--space-toaster-system-event-padding, 8px);
|
|
4
4
|
width:var(--size-toaster-toast-system-event-container, 320px);
|
|
5
5
|
position:fixed;
|
|
6
6
|
box-sizing:border-box;
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
}
|
|
57
57
|
|
|
58
58
|
.containerWithCloseAllButton{
|
|
59
|
-
margin-bottom:calc(var(--size-toaster-button-close-column, 40px) + var(--space-toaster-
|
|
59
|
+
margin-bottom:calc(var(--size-toaster-button-close-column, 40px) + var(--space-toaster-system-event-gap, 8px));
|
|
60
60
|
}
|
|
61
61
|
|
|
62
62
|
@media only screen and (max-width: 480px){
|
|
@@ -95,8 +95,8 @@
|
|
|
95
95
|
max-width:100%;
|
|
96
96
|
}
|
|
97
97
|
:global .osThemeSnack.Toastify__toast-container .container-user-action{
|
|
98
|
-
padding-bottom:var(--space-toaster-
|
|
99
|
-
gap:var(--space-toaster-
|
|
98
|
+
padding-bottom:var(--space-toaster-user-action-padding-bottom, 8px);
|
|
99
|
+
gap:var(--space-toaster-user-action-gap, 8px);
|
|
100
100
|
display:flex;
|
|
101
101
|
flex-direction:column;
|
|
102
102
|
align-items:center;
|
|
@@ -138,16 +138,16 @@
|
|
|
138
138
|
animation-name:osSnackTheme__toast__bounceOutDown;
|
|
139
139
|
}
|
|
140
140
|
:global .osThemeSnack.Toastify__toast-container.osThemeSnack__toast-container__system-event{
|
|
141
|
-
gap:var(--space-toaster-
|
|
142
|
-
padding:var(--space-toaster-
|
|
141
|
+
gap:var(--space-toaster-system-event-gap, 8px);
|
|
142
|
+
padding:var(--space-toaster-system-event-padding, 8px);
|
|
143
143
|
width:var(--size-toaster-toast-system-event-container, 320px);
|
|
144
144
|
display:flex;
|
|
145
145
|
flex-direction:column;
|
|
146
146
|
max-width:calc(100vw - 2 * var(--space-toaster-toast-system-event-container-padding, 16px));
|
|
147
147
|
}
|
|
148
148
|
:global .osThemeSnack.Toastify__toast-container.osThemeSnack__toast-container__user-action{
|
|
149
|
-
padding-bottom:var(--space-toaster-
|
|
150
|
-
gap:var(--space-toaster-
|
|
149
|
+
padding-bottom:var(--space-toaster-user-action-padding-bottom, 8px);
|
|
150
|
+
gap:var(--space-toaster-user-action-gap, 8px);
|
|
151
151
|
display:flex;
|
|
152
152
|
flex-direction:column;
|
|
153
153
|
align-items:center;
|
|
@@ -24,5 +24,4 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
24
24
|
});
|
|
25
25
|
__exportStar(require("./ToastSystemEvent"), exports);
|
|
26
26
|
__exportStar(require("./ToastUserAction"), exports);
|
|
27
|
-
__exportStar(require("./ToasterContainer"), exports);
|
|
28
|
-
__exportStar(require("./ToastUpload"), exports);
|
|
27
|
+
__exportStar(require("./ToasterContainer"), exports);
|
package/dist/cjs/constants.d.ts
CHANGED
|
@@ -1,18 +1,13 @@
|
|
|
1
|
-
import { ToasterContainerProps
|
|
2
|
-
import { UploadItem } from './components/ToastUpload/types';
|
|
1
|
+
import { ToasterContainerProps } from './components';
|
|
3
2
|
import { ToasterType } from './types';
|
|
4
3
|
export declare const TOASTER_TYPE: {
|
|
5
4
|
readonly SystemEvent: "system-event";
|
|
6
5
|
readonly UserAction: "user-action";
|
|
7
|
-
readonly Upload: "upload";
|
|
8
6
|
};
|
|
9
7
|
export declare const TOASTER_CONTAINER_DEFAULT_PROPS: Record<ToasterType, ToasterContainerProps>;
|
|
10
|
-
export declare const AUTO_CLOSE_TIME:
|
|
8
|
+
export declare const AUTO_CLOSE_TIME: {
|
|
9
|
+
"system-event": number;
|
|
10
|
+
"user-action": number;
|
|
11
|
+
};
|
|
11
12
|
export declare const TOASTER_ROOT_ID = "toaster-root";
|
|
12
13
|
export declare const TOASTER_CONTAINER_PREFIX = "toaster-container__";
|
|
13
|
-
export declare const MOCK_TOAST_LOADING_ITEM: UploadItem;
|
|
14
|
-
export declare const MOCK_TOAST_PAUSED_ITEM: UploadItem;
|
|
15
|
-
export declare const MOCK_TOAST_ERROR_ITEM: UploadItem;
|
|
16
|
-
export declare const MOCK_TOAST_UPLOADED_ITEM: UploadItem;
|
|
17
|
-
export declare const MOCK_TOAST_PROPS: Partial<ToastUploadProps>;
|
|
18
|
-
export declare const MOCK_UPLOAD_ITEMS_LIST: UploadItem[];
|
package/dist/cjs/constants.js
CHANGED
|
@@ -3,11 +3,10 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.TOASTER_CONTAINER_PREFIX = exports.TOASTER_ROOT_ID = exports.AUTO_CLOSE_TIME = exports.TOASTER_CONTAINER_DEFAULT_PROPS = exports.TOASTER_TYPE = void 0;
|
|
7
7
|
exports.TOASTER_TYPE = {
|
|
8
8
|
SystemEvent: 'system-event',
|
|
9
|
-
UserAction: 'user-action'
|
|
10
|
-
Upload: 'upload'
|
|
9
|
+
UserAction: 'user-action'
|
|
11
10
|
};
|
|
12
11
|
exports.TOASTER_CONTAINER_DEFAULT_PROPS = {
|
|
13
12
|
[exports.TOASTER_TYPE.SystemEvent]: {
|
|
@@ -21,83 +20,11 @@ exports.TOASTER_CONTAINER_DEFAULT_PROPS = {
|
|
|
21
20
|
position: 'bottom-center',
|
|
22
21
|
displayCloseAllButton: false,
|
|
23
22
|
type: exports.TOASTER_TYPE.UserAction
|
|
24
|
-
},
|
|
25
|
-
[exports.TOASTER_TYPE.Upload]: {
|
|
26
|
-
limit: 5,
|
|
27
|
-
position: 'bottom-right',
|
|
28
|
-
displayCloseAllButton: true,
|
|
29
|
-
type: exports.TOASTER_TYPE.SystemEvent
|
|
30
23
|
}
|
|
31
24
|
};
|
|
32
25
|
exports.AUTO_CLOSE_TIME = {
|
|
33
26
|
[exports.TOASTER_TYPE.SystemEvent]: 5000,
|
|
34
|
-
[exports.TOASTER_TYPE.UserAction]: 2000
|
|
35
|
-
[exports.TOASTER_TYPE.Upload]: false
|
|
27
|
+
[exports.TOASTER_TYPE.UserAction]: 2000
|
|
36
28
|
};
|
|
37
29
|
exports.TOASTER_ROOT_ID = 'toaster-root';
|
|
38
|
-
exports.TOASTER_CONTAINER_PREFIX = 'toaster-container__';
|
|
39
|
-
exports.MOCK_TOAST_LOADING_ITEM = {
|
|
40
|
-
id: '1',
|
|
41
|
-
progress: 10,
|
|
42
|
-
size: '45 MB',
|
|
43
|
-
title: 'file name.extensions',
|
|
44
|
-
status: 'loading',
|
|
45
|
-
statusLabel: 'Loading...',
|
|
46
|
-
actions: {}
|
|
47
|
-
};
|
|
48
|
-
exports.MOCK_TOAST_PAUSED_ITEM = {
|
|
49
|
-
id: '2',
|
|
50
|
-
progress: 20,
|
|
51
|
-
size: '45 MB',
|
|
52
|
-
title: 'file name.extensions',
|
|
53
|
-
status: 'pause',
|
|
54
|
-
statusLabel: 'Paused',
|
|
55
|
-
actions: {}
|
|
56
|
-
};
|
|
57
|
-
exports.MOCK_TOAST_ERROR_ITEM = {
|
|
58
|
-
id: '3',
|
|
59
|
-
progress: 20,
|
|
60
|
-
size: '45 MB',
|
|
61
|
-
title: 'file name.extensions',
|
|
62
|
-
status: 'error',
|
|
63
|
-
statusLabel: 'Error',
|
|
64
|
-
actions: {}
|
|
65
|
-
};
|
|
66
|
-
exports.MOCK_TOAST_UPLOADED_ITEM = {
|
|
67
|
-
id: '4',
|
|
68
|
-
progress: 100,
|
|
69
|
-
size: '45 MB',
|
|
70
|
-
title: 'file name.extensions',
|
|
71
|
-
status: 'uploaded',
|
|
72
|
-
statusLabel: 'Uploaded',
|
|
73
|
-
actions: {},
|
|
74
|
-
link: {
|
|
75
|
-
href: '#',
|
|
76
|
-
text: 'Show'
|
|
77
|
-
}
|
|
78
|
-
};
|
|
79
|
-
exports.MOCK_TOAST_PROPS = {
|
|
80
|
-
title: 'Loading...',
|
|
81
|
-
description: '3 minutes left',
|
|
82
|
-
status: 'loading',
|
|
83
|
-
closable: true,
|
|
84
|
-
collapsed: true,
|
|
85
|
-
totalProgressCounter: '10/15',
|
|
86
|
-
totalProgressPercentage: 30,
|
|
87
|
-
cancelButton: {
|
|
88
|
-
label: 'Cancel all',
|
|
89
|
-
onClick: () => {}
|
|
90
|
-
},
|
|
91
|
-
generalActions: {
|
|
92
|
-
onCancel: () => {},
|
|
93
|
-
onContinue: () => {},
|
|
94
|
-
onPause: () => {},
|
|
95
|
-
onRetry: () => {}
|
|
96
|
-
},
|
|
97
|
-
onCollapsed: () => {}
|
|
98
|
-
};
|
|
99
|
-
exports.MOCK_UPLOAD_ITEMS_LIST = [exports.MOCK_TOAST_LOADING_ITEM, exports.MOCK_TOAST_PAUSED_ITEM, exports.MOCK_TOAST_ERROR_ITEM, exports.MOCK_TOAST_UPLOADED_ITEM, Object.assign(Object.assign({}, exports.MOCK_TOAST_UPLOADED_ITEM), {
|
|
100
|
-
id: '5'
|
|
101
|
-
}), Object.assign(Object.assign({}, exports.MOCK_TOAST_UPLOADED_ITEM), {
|
|
102
|
-
id: '6'
|
|
103
|
-
})];
|
|
30
|
+
exports.TOASTER_CONTAINER_PREFIX = 'toaster-container__';
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
.buttonAction{
|
|
2
2
|
border-radius:var(--radius-toaster-toast-system-event-button, 8px);
|
|
3
3
|
height:var(--size-toaster-toast-system-event-button, 32px);
|
|
4
|
-
padding-left:var(--space-toaster-
|
|
5
|
-
padding-right:var(--space-toaster-
|
|
4
|
+
padding-left:var(--space-toaster-system-event-padding, 8px);
|
|
5
|
+
padding-right:var(--space-toaster-system-event-padding, 8px);
|
|
6
6
|
font-family:var(--sans-body-m-font-family, SB Sans Interface);
|
|
7
7
|
font-weight:var(--sans-body-m-font-weight, Regular);
|
|
8
8
|
line-height:var(--sans-body-m-line-height, 20px);
|
package/dist/cjs/helpers.js
CHANGED
|
@@ -1,13 +1,5 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var __rest = void 0 && (void 0).__rest || function (s, e) {
|
|
4
|
-
var t = {};
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
6
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
7
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
3
|
Object.defineProperty(exports, "__esModule", {
|
|
12
4
|
value: true
|
|
13
5
|
});
|
|
@@ -18,7 +10,6 @@ const react_dom_1 = require("react-dom");
|
|
|
18
10
|
const react_toastify_1 = require("react-toastify");
|
|
19
11
|
const utils_1 = require("@snack-uikit/utils");
|
|
20
12
|
const components_1 = require("./components");
|
|
21
|
-
const ToastUploadToaster_1 = require("./components/ToastUpload/ToastUploadToaster");
|
|
22
13
|
const constants_1 = require("./constants");
|
|
23
14
|
function getToasterContainer(_ref) {
|
|
24
15
|
let {
|
|
@@ -69,8 +60,6 @@ function getToastComponent(_ref3) {
|
|
|
69
60
|
return (0, jsx_runtime_1.jsx)(components_1.ToastUserAction, Object.assign({}, toasterProps));
|
|
70
61
|
case constants_1.TOASTER_TYPE.SystemEvent:
|
|
71
62
|
return (0, jsx_runtime_1.jsx)(components_1.ToastSystemEvent, Object.assign({}, toasterProps));
|
|
72
|
-
case constants_1.TOASTER_TYPE.Upload:
|
|
73
|
-
return (0, jsx_runtime_1.jsx)(ToastUploadToaster_1.ToastUploadForToaster, Object.assign({}, toasterProps));
|
|
74
63
|
default:
|
|
75
64
|
return undefined;
|
|
76
65
|
}
|
|
@@ -329,38 +318,7 @@ const systemEvent = {
|
|
|
329
318
|
return react_toastify_1.toast.dismiss(id);
|
|
330
319
|
}
|
|
331
320
|
};
|
|
332
|
-
const upload = {
|
|
333
|
-
startOrUpdate(_a) {
|
|
334
|
-
var {
|
|
335
|
-
id
|
|
336
|
-
} = _a,
|
|
337
|
-
options = __rest(_a, ["id"]);
|
|
338
|
-
const toastId = id || constants_1.TOASTER_TYPE.Upload;
|
|
339
|
-
if (react_toastify_1.toast.isActive(toastId)) {
|
|
340
|
-
return (0, exports.updateToast)(toastId, {
|
|
341
|
-
type: constants_1.TOASTER_TYPE.Upload,
|
|
342
|
-
toasterProps: Object.assign(Object.assign({}, options), {
|
|
343
|
-
loading: true
|
|
344
|
-
})
|
|
345
|
-
});
|
|
346
|
-
}
|
|
347
|
-
return (0, exports.openToast)({
|
|
348
|
-
type: constants_1.TOASTER_TYPE.Upload,
|
|
349
|
-
toasterProps: Object.assign(Object.assign({}, options), {
|
|
350
|
-
loading: true
|
|
351
|
-
}),
|
|
352
|
-
toastOptions: {
|
|
353
|
-
id: toastId,
|
|
354
|
-
onClose: options.onClose
|
|
355
|
-
}
|
|
356
|
-
});
|
|
357
|
-
},
|
|
358
|
-
dismiss(id) {
|
|
359
|
-
return react_toastify_1.toast.dismiss(id);
|
|
360
|
-
}
|
|
361
|
-
};
|
|
362
321
|
exports.toaster = {
|
|
363
322
|
userAction,
|
|
364
|
-
systemEvent
|
|
365
|
-
upload
|
|
323
|
+
systemEvent
|
|
366
324
|
};
|
package/dist/cjs/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export { toaster, openToast, updateToast, dismissToast } from './helpers';
|
|
2
|
-
export type { ToastSystemEventProps, ToastUserActionProps, ToasterContainerProps
|
|
3
|
-
export type { Toaster, UpdateToast, OpenToast, UserActionOptions, SystemEventOptions, ToasterId, ToastOptions,
|
|
2
|
+
export type { ToastSystemEventProps, ToastUserActionProps, ToasterContainerProps } from './components';
|
|
3
|
+
export type { Toaster, UpdateToast, OpenToast, UserActionOptions, SystemEventOptions, ToasterId, ToastOptions, } from './types';
|
|
4
4
|
export { TOASTER_TYPE } from './constants';
|
package/dist/cjs/testIds.d.ts
CHANGED
|
@@ -16,17 +16,3 @@ export declare const TOAST_USER_ACTION_TEST_IDS: {
|
|
|
16
16
|
loader: string;
|
|
17
17
|
link: string;
|
|
18
18
|
};
|
|
19
|
-
export declare const TOAST_UPLOAD_TEST_IDS: {
|
|
20
|
-
main: string;
|
|
21
|
-
close: string;
|
|
22
|
-
title: string;
|
|
23
|
-
description: string;
|
|
24
|
-
counter: string;
|
|
25
|
-
progress: string;
|
|
26
|
-
list: string;
|
|
27
|
-
collapseButton: string;
|
|
28
|
-
progressBar: string;
|
|
29
|
-
uploadItem: string;
|
|
30
|
-
uploadItemLink: string;
|
|
31
|
-
uploadItemCancel: string;
|
|
32
|
-
};
|
package/dist/cjs/testIds.js
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.TOAST_USER_ACTION_TEST_IDS = exports.TOAST_SYSTEM_EVENT_TEST_IDS = void 0;
|
|
7
7
|
const TOAST_SYSTEM_EVENT_TEST_ID = 'toast-system-event';
|
|
8
8
|
exports.TOAST_SYSTEM_EVENT_TEST_IDS = {
|
|
9
9
|
icon: `${TOAST_SYSTEM_EVENT_TEST_ID}__icon`,
|
|
@@ -23,19 +23,4 @@ exports.TOAST_USER_ACTION_TEST_IDS = {
|
|
|
23
23
|
icon: `${TOAST_USER_ACTION_TEST_ID}__icon`,
|
|
24
24
|
loader: `${TOAST_USER_ACTION_TEST_ID}__loader`,
|
|
25
25
|
link: `${TOAST_USER_ACTION_TEST_ID}__link`
|
|
26
|
-
};
|
|
27
|
-
const TOAST_UPLOAD_TEST_ID = 'toast-upload';
|
|
28
|
-
exports.TOAST_UPLOAD_TEST_IDS = {
|
|
29
|
-
main: TOAST_UPLOAD_TEST_ID,
|
|
30
|
-
close: `${TOAST_UPLOAD_TEST_ID}__close`,
|
|
31
|
-
title: `${TOAST_UPLOAD_TEST_ID}__title`,
|
|
32
|
-
description: `${TOAST_UPLOAD_TEST_ID}__description`,
|
|
33
|
-
counter: `${TOAST_UPLOAD_TEST_ID}__counter`,
|
|
34
|
-
progress: `${TOAST_UPLOAD_TEST_ID}__progress`,
|
|
35
|
-
list: `${TOAST_UPLOAD_TEST_ID}__list`,
|
|
36
|
-
collapseButton: `${TOAST_UPLOAD_TEST_ID}__collapseButton`,
|
|
37
|
-
progressBar: `${TOAST_UPLOAD_TEST_ID}__progressBar`,
|
|
38
|
-
uploadItem: `${TOAST_UPLOAD_TEST_ID}__uploadItem`,
|
|
39
|
-
uploadItemLink: `${TOAST_UPLOAD_TEST_ID}__uploadItemLink`,
|
|
40
|
-
uploadItemCancel: `${TOAST_UPLOAD_TEST_ID}__uploadItemCancel`
|
|
41
26
|
};
|
package/dist/cjs/types.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { Id, ToastOptions as RtToastOptions } from 'react-toastify';
|
|
2
2
|
import { ValueOf } from '@snack-uikit/utils';
|
|
3
|
-
import { ToasterContainerProps, ToastSystemEventProps,
|
|
3
|
+
import { ToasterContainerProps, ToastSystemEventProps, ToastUserActionProps } from './components';
|
|
4
4
|
import { TOASTER_TYPE } from './constants';
|
|
5
5
|
export type ToasterId = Id;
|
|
6
6
|
export type PromisedId = Promise<ToasterId>;
|
|
@@ -13,9 +13,6 @@ export type ToasterType = ValueOf<typeof TOASTER_TYPE>;
|
|
|
13
13
|
export type ToasterPropsMap = {
|
|
14
14
|
[TOASTER_TYPE.UserAction]: ToastUserActionProps;
|
|
15
15
|
[TOASTER_TYPE.SystemEvent]: ToastSystemEventProps;
|
|
16
|
-
[TOASTER_TYPE.Upload]: ToastUploadProps & {
|
|
17
|
-
loading: boolean;
|
|
18
|
-
};
|
|
19
16
|
};
|
|
20
17
|
type OpenNotificationProps<T extends keyof ToasterPropsMap> = {
|
|
21
18
|
type: T;
|
|
@@ -36,7 +33,6 @@ export type UpdateToast = <T extends keyof ToasterPropsMap>(id: string | number,
|
|
|
36
33
|
}) => void;
|
|
37
34
|
export type UserActionOptions = Omit<ToastUserActionProps, 'appearance'> & Pick<ToastOptions, 'id' | 'onClose'>;
|
|
38
35
|
export type SystemEventOptions = Omit<ToastSystemEventProps, 'appearance'> & Pick<ToastOptions, 'id' | 'onClose'>;
|
|
39
|
-
export type UploadOptions = ToastUploadProps & Pick<ToastOptions, 'id' | 'onClose'>;
|
|
40
36
|
export type Toaster = {
|
|
41
37
|
userAction: {
|
|
42
38
|
success(options: UserActionOptions): PromisedId;
|
|
@@ -66,9 +62,5 @@ export type Toaster = {
|
|
|
66
62
|
};
|
|
67
63
|
dismiss(id?: ToasterId): void;
|
|
68
64
|
};
|
|
69
|
-
upload: {
|
|
70
|
-
startOrUpdate(options: UploadOptions): void;
|
|
71
|
-
dismiss(id?: ToasterId): void;
|
|
72
|
-
};
|
|
73
65
|
};
|
|
74
66
|
export {};
|
|
@@ -4,8 +4,9 @@
|
|
|
4
4
|
}
|
|
5
5
|
|
|
6
6
|
.buttonClose{
|
|
7
|
+
width:var(--size-toaster-toast-system-event-button-close, 24px);
|
|
8
|
+
height:var(--size-toaster-toast-system-event-button-close, 24px);
|
|
7
9
|
border-radius:var(--radius-toaster-toast-system-event-button, 8px);
|
|
8
|
-
height:var(--size-toaster-toast-system-event-button-neutral, 24px);
|
|
9
10
|
cursor:pointer;
|
|
10
11
|
display:flex;
|
|
11
12
|
align-items:center;
|
|
@@ -107,7 +108,7 @@
|
|
|
107
108
|
display:flex;
|
|
108
109
|
flex-direction:column;
|
|
109
110
|
box-sizing:border-box;
|
|
110
|
-
width:calc(var(--size-toaster-toast-system-event-container, 320px) - 2 * var(--space-toaster-
|
|
111
|
+
width:calc(var(--size-toaster-toast-system-event-container, 320px) - 2 * var(--space-toaster-system-event-padding, 8px));
|
|
111
112
|
max-width:100%;
|
|
112
113
|
}
|
|
113
114
|
.container:hover .progress{
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
.buttonCloseColumnWrapper{
|
|
2
|
-
gap:var(--space-toaster-
|
|
3
|
-
padding:var(--space-toaster-
|
|
2
|
+
gap:var(--space-toaster-system-event-gap, 8px);
|
|
3
|
+
padding:var(--space-toaster-system-event-padding, 8px);
|
|
4
4
|
width:var(--size-toaster-toast-system-event-container, 320px);
|
|
5
5
|
position:fixed;
|
|
6
6
|
box-sizing:border-box;
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
}
|
|
57
57
|
|
|
58
58
|
.containerWithCloseAllButton{
|
|
59
|
-
margin-bottom:calc(var(--size-toaster-button-close-column, 40px) + var(--space-toaster-
|
|
59
|
+
margin-bottom:calc(var(--size-toaster-button-close-column, 40px) + var(--space-toaster-system-event-gap, 8px));
|
|
60
60
|
}
|
|
61
61
|
|
|
62
62
|
@media only screen and (max-width: 480px){
|
|
@@ -95,8 +95,8 @@
|
|
|
95
95
|
max-width:100%;
|
|
96
96
|
}
|
|
97
97
|
:global .osThemeSnack.Toastify__toast-container .container-user-action{
|
|
98
|
-
padding-bottom:var(--space-toaster-
|
|
99
|
-
gap:var(--space-toaster-
|
|
98
|
+
padding-bottom:var(--space-toaster-user-action-padding-bottom, 8px);
|
|
99
|
+
gap:var(--space-toaster-user-action-gap, 8px);
|
|
100
100
|
display:flex;
|
|
101
101
|
flex-direction:column;
|
|
102
102
|
align-items:center;
|
|
@@ -138,16 +138,16 @@
|
|
|
138
138
|
animation-name:osSnackTheme__toast__bounceOutDown;
|
|
139
139
|
}
|
|
140
140
|
:global .osThemeSnack.Toastify__toast-container.osThemeSnack__toast-container__system-event{
|
|
141
|
-
gap:var(--space-toaster-
|
|
142
|
-
padding:var(--space-toaster-
|
|
141
|
+
gap:var(--space-toaster-system-event-gap, 8px);
|
|
142
|
+
padding:var(--space-toaster-system-event-padding, 8px);
|
|
143
143
|
width:var(--size-toaster-toast-system-event-container, 320px);
|
|
144
144
|
display:flex;
|
|
145
145
|
flex-direction:column;
|
|
146
146
|
max-width:calc(100vw - 2 * var(--space-toaster-toast-system-event-container-padding, 16px));
|
|
147
147
|
}
|
|
148
148
|
:global .osThemeSnack.Toastify__toast-container.osThemeSnack__toast-container__user-action{
|
|
149
|
-
padding-bottom:var(--space-toaster-
|
|
150
|
-
gap:var(--space-toaster-
|
|
149
|
+
padding-bottom:var(--space-toaster-user-action-padding-bottom, 8px);
|
|
150
|
+
gap:var(--space-toaster-user-action-gap, 8px);
|
|
151
151
|
display:flex;
|
|
152
152
|
flex-direction:column;
|
|
153
153
|
align-items:center;
|
package/dist/esm/constants.d.ts
CHANGED
|
@@ -1,18 +1,13 @@
|
|
|
1
|
-
import { ToasterContainerProps
|
|
2
|
-
import { UploadItem } from './components/ToastUpload/types';
|
|
1
|
+
import { ToasterContainerProps } from './components';
|
|
3
2
|
import { ToasterType } from './types';
|
|
4
3
|
export declare const TOASTER_TYPE: {
|
|
5
4
|
readonly SystemEvent: "system-event";
|
|
6
5
|
readonly UserAction: "user-action";
|
|
7
|
-
readonly Upload: "upload";
|
|
8
6
|
};
|
|
9
7
|
export declare const TOASTER_CONTAINER_DEFAULT_PROPS: Record<ToasterType, ToasterContainerProps>;
|
|
10
|
-
export declare const AUTO_CLOSE_TIME:
|
|
8
|
+
export declare const AUTO_CLOSE_TIME: {
|
|
9
|
+
"system-event": number;
|
|
10
|
+
"user-action": number;
|
|
11
|
+
};
|
|
11
12
|
export declare const TOASTER_ROOT_ID = "toaster-root";
|
|
12
13
|
export declare const TOASTER_CONTAINER_PREFIX = "toaster-container__";
|
|
13
|
-
export declare const MOCK_TOAST_LOADING_ITEM: UploadItem;
|
|
14
|
-
export declare const MOCK_TOAST_PAUSED_ITEM: UploadItem;
|
|
15
|
-
export declare const MOCK_TOAST_ERROR_ITEM: UploadItem;
|
|
16
|
-
export declare const MOCK_TOAST_UPLOADED_ITEM: UploadItem;
|
|
17
|
-
export declare const MOCK_TOAST_PROPS: Partial<ToastUploadProps>;
|
|
18
|
-
export declare const MOCK_UPLOAD_ITEMS_LIST: UploadItem[];
|
package/dist/esm/constants.js
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
export const TOASTER_TYPE = {
|
|
2
2
|
SystemEvent: 'system-event',
|
|
3
3
|
UserAction: 'user-action',
|
|
4
|
-
Upload: 'upload',
|
|
5
4
|
};
|
|
6
5
|
export const TOASTER_CONTAINER_DEFAULT_PROPS = {
|
|
7
6
|
[TOASTER_TYPE.SystemEvent]: {
|
|
@@ -16,85 +15,10 @@ export const TOASTER_CONTAINER_DEFAULT_PROPS = {
|
|
|
16
15
|
displayCloseAllButton: false,
|
|
17
16
|
type: TOASTER_TYPE.UserAction,
|
|
18
17
|
},
|
|
19
|
-
[TOASTER_TYPE.Upload]: {
|
|
20
|
-
limit: 5,
|
|
21
|
-
position: 'bottom-right',
|
|
22
|
-
displayCloseAllButton: true,
|
|
23
|
-
type: TOASTER_TYPE.SystemEvent,
|
|
24
|
-
},
|
|
25
18
|
};
|
|
26
19
|
export const AUTO_CLOSE_TIME = {
|
|
27
20
|
[TOASTER_TYPE.SystemEvent]: 5000,
|
|
28
21
|
[TOASTER_TYPE.UserAction]: 2000,
|
|
29
|
-
[TOASTER_TYPE.Upload]: false,
|
|
30
22
|
};
|
|
31
23
|
export const TOASTER_ROOT_ID = 'toaster-root';
|
|
32
24
|
export const TOASTER_CONTAINER_PREFIX = 'toaster-container__';
|
|
33
|
-
export const MOCK_TOAST_LOADING_ITEM = {
|
|
34
|
-
id: '1',
|
|
35
|
-
progress: 10,
|
|
36
|
-
size: '45 MB',
|
|
37
|
-
title: 'file name.extensions',
|
|
38
|
-
status: 'loading',
|
|
39
|
-
statusLabel: 'Loading...',
|
|
40
|
-
actions: {},
|
|
41
|
-
};
|
|
42
|
-
export const MOCK_TOAST_PAUSED_ITEM = {
|
|
43
|
-
id: '2',
|
|
44
|
-
progress: 20,
|
|
45
|
-
size: '45 MB',
|
|
46
|
-
title: 'file name.extensions',
|
|
47
|
-
status: 'pause',
|
|
48
|
-
statusLabel: 'Paused',
|
|
49
|
-
actions: {},
|
|
50
|
-
};
|
|
51
|
-
export const MOCK_TOAST_ERROR_ITEM = {
|
|
52
|
-
id: '3',
|
|
53
|
-
progress: 20,
|
|
54
|
-
size: '45 MB',
|
|
55
|
-
title: 'file name.extensions',
|
|
56
|
-
status: 'error',
|
|
57
|
-
statusLabel: 'Error',
|
|
58
|
-
actions: {},
|
|
59
|
-
};
|
|
60
|
-
export const MOCK_TOAST_UPLOADED_ITEM = {
|
|
61
|
-
id: '4',
|
|
62
|
-
progress: 100,
|
|
63
|
-
size: '45 MB',
|
|
64
|
-
title: 'file name.extensions',
|
|
65
|
-
status: 'uploaded',
|
|
66
|
-
statusLabel: 'Uploaded',
|
|
67
|
-
actions: {},
|
|
68
|
-
link: {
|
|
69
|
-
href: '#',
|
|
70
|
-
text: 'Show',
|
|
71
|
-
},
|
|
72
|
-
};
|
|
73
|
-
export const MOCK_TOAST_PROPS = {
|
|
74
|
-
title: 'Loading...',
|
|
75
|
-
description: '3 minutes left',
|
|
76
|
-
status: 'loading',
|
|
77
|
-
closable: true,
|
|
78
|
-
collapsed: true,
|
|
79
|
-
totalProgressCounter: '10/15',
|
|
80
|
-
totalProgressPercentage: 30,
|
|
81
|
-
cancelButton: {
|
|
82
|
-
label: 'Cancel all',
|
|
83
|
-
onClick: () => { },
|
|
84
|
-
},
|
|
85
|
-
generalActions: {
|
|
86
|
-
onCancel: () => { },
|
|
87
|
-
onContinue: () => { },
|
|
88
|
-
onPause: () => { },
|
|
89
|
-
onRetry: () => { },
|
|
90
|
-
},
|
|
91
|
-
onCollapsed: () => { },
|
|
92
|
-
};
|
|
93
|
-
export const MOCK_UPLOAD_ITEMS_LIST = [
|
|
94
|
-
MOCK_TOAST_LOADING_ITEM,
|
|
95
|
-
MOCK_TOAST_PAUSED_ITEM,
|
|
96
|
-
MOCK_TOAST_ERROR_ITEM,
|
|
97
|
-
MOCK_TOAST_UPLOADED_ITEM,
|
|
98
|
-
Object.assign(Object.assign({}, MOCK_TOAST_UPLOADED_ITEM), { id: '5' }),
|
|
99
|
-
Object.assign(Object.assign({}, MOCK_TOAST_UPLOADED_ITEM), { id: '6' }),
|
|
100
|
-
];
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
.buttonAction{
|
|
2
2
|
border-radius:var(--radius-toaster-toast-system-event-button, 8px);
|
|
3
3
|
height:var(--size-toaster-toast-system-event-button, 32px);
|
|
4
|
-
padding-left:var(--space-toaster-
|
|
5
|
-
padding-right:var(--space-toaster-
|
|
4
|
+
padding-left:var(--space-toaster-system-event-padding, 8px);
|
|
5
|
+
padding-right:var(--space-toaster-system-event-padding, 8px);
|
|
6
6
|
font-family:var(--sans-body-m-font-family, SB Sans Interface);
|
|
7
7
|
font-weight:var(--sans-body-m-font-weight, Regular);
|
|
8
8
|
line-height:var(--sans-body-m-line-height, 20px);
|