@snack-uikit/toaster 0.6.7 → 0.6.8-preview-8c773b48.0

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.
Files changed (16) hide show
  1. package/dist/components/ToastSystemEvent/ToastSystemEvent.js +2 -3
  2. package/dist/components/ToasterContainer/ToasterContainer.js +3 -4
  3. package/dist/constants.d.ts +4 -0
  4. package/dist/constants.js +10 -7
  5. package/dist/helpers.js +21 -22
  6. package/dist/index.d.ts +2 -0
  7. package/dist/index.js +1 -0
  8. package/dist/types.d.ts +5 -6
  9. package/dist/types.js +1 -5
  10. package/package.json +2 -2
  11. package/src/components/ToastSystemEvent/ToastSystemEvent.tsx +3 -3
  12. package/src/components/ToasterContainer/ToasterContainer.tsx +3 -3
  13. package/src/constants.ts +11 -6
  14. package/src/helpers.tsx +21 -20
  15. package/src/index.ts +4 -0
  16. package/src/types.ts +6 -6
package/dist/components/ToastSystemEvent/ToastSystemEvent.js CHANGED
@@ -16,10 +16,9 @@ import { CrossSVG } from '@snack-uikit/icons';
16
16
  import { Link } from '@snack-uikit/link';
17
17
  import { TruncateString } from '@snack-uikit/truncate-string';
18
18
  import { extractSupportProps } from '@snack-uikit/utils';
19
- import { AUTO_CLOSE_TIME } from '../../constants';
19
+ import { AUTO_CLOSE_TIME, TOASTER_TYPE } from '../../constants';
20
20
  import { ButtonAction } from '../../helperComponents/ButtonAction';
21
21
  import { TOAST_SYSTEM_EVENT_TEST_IDS } from '../../testIds';
22
- import { ToasterType } from '../../types';
23
22
  import { APPEARANCE_TO_ON_COLOR_MAP } from './constants';
24
23
  import styles from './styles.module.css';
25
24
  import { getIcon } from './utils';
@@ -30,5 +29,5 @@ export function ToastSystemEvent(_a) {
30
29
  onCloseClick ? onCloseClick(e, closeToast) : closeToast === null || closeToast === void 0 ? void 0 : closeToast();
31
30
  };
32
31
  const icon = useMemo(() => getIcon(appearance), [appearance]);
33
- return (_jsxs("div", Object.assign({ className: cn(styles.container, className) }, extractSupportProps(rest), { "data-appearance": appearance, children: [_jsxs("div", { className: styles.body, children: [_jsx("div", { className: styles.icon, children: icon }), _jsxs("div", { className: styles.contentLayout, children: [_jsxs("div", { children: [_jsx("span", { className: styles.title, children: _jsx(TruncateString, { text: title, maxLines: 2, hideTooltip: true, "data-test-id": TOAST_SYSTEM_EVENT_TEST_IDS.title }) }), description && (_jsx("span", { className: styles.description, children: _jsx(TruncateString, { maxLines: 4, text: description, hideTooltip: true, "data-test-id": TOAST_SYSTEM_EVENT_TEST_IDS.description }) }))] }), link && (_jsx(Link, { text: link.text, href: link.href, size: 'm', onClick: link.onClick, appearance: APPEARANCE_TO_ON_COLOR_MAP[appearance], "data-test-id": TOAST_SYSTEM_EVENT_TEST_IDS.link, textMode: appearance === 'errorCritical' ? 'on-accent' : 'accent' }))] }), closable && (_jsx("button", { className: styles.buttonClose, onClick: handleCloseClick, "data-test-id": TOAST_SYSTEM_EVENT_TEST_IDS.buttonClose, "aria-label": 'close notification', children: _jsx(CrossSVG, {}) }))] }), progressBar && (_jsx("div", { role: 'progressbar', "aria-label": 'progressbar', "data-test-id": TOAST_SYSTEM_EVENT_TEST_IDS.progressbar, className: styles.progress, style: { animationDuration: `${AUTO_CLOSE_TIME[ToasterType.SystemEvent]}ms` } })), Array.isArray(action) && action.length > 0 && (_jsx("div", { className: styles.footer, children: action.map(buttonProps => (_jsx(ButtonAction, Object.assign({}, buttonProps, { critical: appearance === 'errorCritical' }), buttonProps.label))) }))] })));
32
+ return (_jsxs("div", Object.assign({ className: cn(styles.container, className) }, extractSupportProps(rest), { "data-appearance": appearance, children: [_jsxs("div", { className: styles.body, children: [_jsx("div", { className: styles.icon, children: icon }), _jsxs("div", { className: styles.contentLayout, children: [_jsxs("div", { children: [_jsx("span", { className: styles.title, children: _jsx(TruncateString, { text: title, maxLines: 2, hideTooltip: true, "data-test-id": TOAST_SYSTEM_EVENT_TEST_IDS.title }) }), description && (_jsx("span", { className: styles.description, children: _jsx(TruncateString, { maxLines: 4, text: description, hideTooltip: true, "data-test-id": TOAST_SYSTEM_EVENT_TEST_IDS.description }) }))] }), link && (_jsx(Link, { text: link.text, href: link.href, size: 'm', onClick: link.onClick, appearance: APPEARANCE_TO_ON_COLOR_MAP[appearance], "data-test-id": TOAST_SYSTEM_EVENT_TEST_IDS.link, textMode: appearance === 'errorCritical' ? 'on-accent' : 'accent' }))] }), closable && (_jsx("button", { className: styles.buttonClose, onClick: handleCloseClick, "data-test-id": TOAST_SYSTEM_EVENT_TEST_IDS.buttonClose, "aria-label": 'close notification', children: _jsx(CrossSVG, {}) }))] }), progressBar && (_jsx("div", { role: 'progressbar', "aria-label": 'progressbar', "data-test-id": TOAST_SYSTEM_EVENT_TEST_IDS.progressbar, className: styles.progress, style: { animationDuration: `${AUTO_CLOSE_TIME[TOASTER_TYPE.SystemEvent]}ms` } })), Array.isArray(action) && action.length > 0 && (_jsx("div", { className: styles.footer, children: action.map(buttonProps => (_jsx(ButtonAction, Object.assign({}, buttonProps, { critical: appearance === 'errorCritical' }), buttonProps.label))) }))] })));
34
33
  }
package/dist/components/ToasterContainer/ToasterContainer.js CHANGED
@@ -3,11 +3,10 @@ import 'react-toastify/dist/ReactToastify.css';
3
3
  import cn from 'classnames';
4
4
  import { useEffect, useState } from 'react';
5
5
  import { toast, ToastContainer as RtToastContainer, } from 'react-toastify';
6
- import { TOASTER_CONTAINER_PREFIX } from '../../constants';
6
+ import { TOASTER_CONTAINER_PREFIX, TOASTER_TYPE } from '../../constants';
7
7
  import { TOAST_SYSTEM_EVENT_TEST_IDS } from '../../testIds';
8
- import { ToasterType } from '../../types';
9
8
  import styles from './styles.module.css';
10
- export function ToasterContainer({ position = toast.POSITION.BOTTOM_RIGHT, limit = 5, containerId, displayCloseAllButton, type = ToasterType.SystemEvent, }) {
9
+ export function ToasterContainer({ position = toast.POSITION.BOTTOM_RIGHT, limit = 5, containerId, displayCloseAllButton, type = TOASTER_TYPE.SystemEvent, }) {
11
10
  const [notificationCounter, setNotificationCounter] = useState(0);
12
11
  const [isCloseAllButtonHidden, setIsCloseAllButtonHidden] = useState(false);
13
12
  const closeAll = () => {
@@ -16,7 +15,7 @@ export function ToasterContainer({ position = toast.POSITION.BOTTOM_RIGHT, limit
16
15
  };
17
16
  useEffect(() => {
18
17
  const unsubscribe = toast.onChange(({ status, containerId }) => {
19
- if (containerId === `${TOASTER_CONTAINER_PREFIX}${ToasterType.SystemEvent}`) {
18
+ if (containerId === `${TOASTER_CONTAINER_PREFIX}${TOASTER_TYPE.SystemEvent}`) {
20
19
  if (status === 'added') {
21
20
  setIsCloseAllButtonHidden(false);
22
21
  setNotificationCounter(prev => prev + 1);
package/dist/constants.d.ts CHANGED
@@ -1,5 +1,9 @@
1
1
  import { ToasterContainerProps } from './components';
2
2
  import { ToasterType } from './types';
3
+ export declare const TOASTER_TYPE: {
4
+ readonly SystemEvent: "system-event";
5
+ readonly UserAction: "user-action";
6
+ };
3
7
  export declare const TOASTER_CONTAINER_DEFAULT_PROPS: Record<ToasterType, ToasterContainerProps>;
4
8
  export declare const AUTO_CLOSE_TIME: {
5
9
  "system-event": number;
package/dist/constants.js CHANGED
@@ -1,22 +1,25 @@
1
1
  import { ToasterContainer } from './components';
2
- import { ToasterType } from './types';
2
+ export const TOASTER_TYPE = {
3
+ SystemEvent: 'system-event',
4
+ UserAction: 'user-action',
5
+ };
3
6
  export const TOASTER_CONTAINER_DEFAULT_PROPS = {
4
- [ToasterType.SystemEvent]: {
7
+ [TOASTER_TYPE.SystemEvent]: {
5
8
  limit: 5,
6
9
  position: ToasterContainer.position.BOTTOM_RIGHT,
7
10
  displayCloseAllButton: true,
8
- type: ToasterType.SystemEvent,
11
+ type: TOASTER_TYPE.SystemEvent,
9
12
  },
10
- [ToasterType.UserAction]: {
13
+ [TOASTER_TYPE.UserAction]: {
11
14
  limit: 2,
12
15
  position: ToasterContainer.position.BOTTOM_CENTER,
13
16
  displayCloseAllButton: false,
14
- type: ToasterType.UserAction,
17
+ type: TOASTER_TYPE.UserAction,
15
18
  },
16
19
  };
17
20
  export const AUTO_CLOSE_TIME = {
18
- [ToasterType.SystemEvent]: 5000,
19
- [ToasterType.UserAction]: 2000,
21
+ [TOASTER_TYPE.SystemEvent]: 5000,
22
+ [TOASTER_TYPE.UserAction]: 2000,
20
23
  };
21
24
  export const TOASTER_ROOT_ID = 'toaster-root';
22
25
  export const TOASTER_CONTAINER_PREFIX = 'toaster-container__';
package/dist/helpers.js CHANGED
@@ -3,8 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
3
3
  import { render } from 'react-dom';
4
4
  import { toast } from 'react-toastify';
5
5
  import { ToasterContainer, ToastSystemEvent, ToastUserAction, } from './components';
6
- import { AUTO_CLOSE_TIME, TOASTER_CONTAINER_DEFAULT_PROPS, TOASTER_CONTAINER_PREFIX, TOASTER_ROOT_ID, } from './constants';
7
- import { ToasterType, } from './types';
6
+ import { AUTO_CLOSE_TIME, TOASTER_CONTAINER_DEFAULT_PROPS, TOASTER_CONTAINER_PREFIX, TOASTER_ROOT_ID, TOASTER_TYPE, } from './constants';
8
7
  function getToasterContainer({ type, toasterParent, containerProps, }) {
9
8
  const containerId = (containerProps === null || containerProps === void 0 ? void 0 : containerProps.containerId) || `${TOASTER_CONTAINER_PREFIX}${type}`;
10
9
  const toasterContainerProps = Object.assign(Object.assign(Object.assign({}, TOASTER_CONTAINER_DEFAULT_PROPS[type]), (containerProps || {})), { containerId });
@@ -33,9 +32,9 @@ function getToastOptions({ type, toastOptions, containerId, toasterProps, }) {
33
32
  }
34
33
  function getToastComponent({ type, toasterProps, }) {
35
34
  switch (type) {
36
- case ToasterType.UserAction:
35
+ case TOASTER_TYPE.UserAction:
37
36
  return _jsx(ToastUserAction, Object.assign({}, toasterProps));
38
- case ToasterType.SystemEvent:
37
+ case TOASTER_TYPE.SystemEvent:
39
38
  return _jsx(ToastSystemEvent, Object.assign({}, toasterProps));
40
39
  default:
41
40
  return undefined;
@@ -78,50 +77,50 @@ export const isToastActive = toast.isActive;
78
77
  const userAction = {
79
78
  success(options) {
80
79
  return openToast({
81
- type: ToasterType.UserAction,
80
+ type: TOASTER_TYPE.UserAction,
82
81
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'success' }),
83
82
  });
84
83
  },
85
84
  neutral(options) {
86
85
  return openToast({
87
- type: ToasterType.UserAction,
86
+ type: TOASTER_TYPE.UserAction,
88
87
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'neutral' }),
89
88
  });
90
89
  },
91
90
  error(options) {
92
91
  return openToast({
93
- type: ToasterType.UserAction,
92
+ type: TOASTER_TYPE.UserAction,
94
93
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'error' }),
95
94
  });
96
95
  },
97
96
  warning(options) {
98
97
  return openToast({
99
- type: ToasterType.UserAction,
98
+ type: TOASTER_TYPE.UserAction,
100
99
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'warning' }),
101
100
  });
102
101
  },
103
102
  update: {
104
103
  success(id, options) {
105
104
  updateToast(id, {
106
- type: ToasterType.UserAction,
105
+ type: TOASTER_TYPE.UserAction,
107
106
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'success' }),
108
107
  });
109
108
  },
110
109
  neutral(id, options) {
111
110
  updateToast(id, {
112
- type: ToasterType.UserAction,
111
+ type: TOASTER_TYPE.UserAction,
113
112
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'neutral' }),
114
113
  });
115
114
  },
116
115
  warning(id, options) {
117
116
  updateToast(id, {
118
- type: ToasterType.UserAction,
117
+ type: TOASTER_TYPE.UserAction,
119
118
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'warning' }),
120
119
  });
121
120
  },
122
121
  error(id, options) {
123
122
  updateToast(id, {
124
- type: ToasterType.UserAction,
123
+ type: TOASTER_TYPE.UserAction,
125
124
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'error' }),
126
125
  });
127
126
  },
@@ -133,62 +132,62 @@ const userAction = {
133
132
  const systemEvent = {
134
133
  success(options) {
135
134
  return openToast({
136
- type: ToasterType.SystemEvent,
135
+ type: TOASTER_TYPE.SystemEvent,
137
136
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'success' }),
138
137
  });
139
138
  },
140
139
  neutral(options) {
141
140
  return openToast({
142
- type: ToasterType.SystemEvent,
141
+ type: TOASTER_TYPE.SystemEvent,
143
142
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'neutral' }),
144
143
  });
145
144
  },
146
145
  warning(options) {
147
146
  return openToast({
148
- type: ToasterType.SystemEvent,
147
+ type: TOASTER_TYPE.SystemEvent,
149
148
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'warning' }),
150
149
  });
151
150
  },
152
151
  error(options) {
153
152
  return openToast({
154
- type: ToasterType.SystemEvent,
153
+ type: TOASTER_TYPE.SystemEvent,
155
154
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'error' }),
156
155
  });
157
156
  },
158
157
  errorCritical(options) {
159
158
  return openToast({
160
- type: ToasterType.SystemEvent,
159
+ type: TOASTER_TYPE.SystemEvent,
161
160
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'errorCritical' }),
162
161
  });
163
162
  },
164
163
  update: {
165
164
  success(id, options) {
166
165
  return updateToast(id, {
167
- type: ToasterType.SystemEvent,
166
+ type: TOASTER_TYPE.SystemEvent,
168
167
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'success' }),
169
168
  });
170
169
  },
171
170
  neutral(id, options) {
172
171
  return updateToast(id, {
173
- type: ToasterType.SystemEvent,
172
+ type: TOASTER_TYPE.SystemEvent,
174
173
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'neutral' }),
175
174
  });
176
175
  },
177
176
  warning(id, options) {
178
177
  return updateToast(id, {
179
- type: ToasterType.SystemEvent,
178
+ type: TOASTER_TYPE.SystemEvent,
180
179
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'warning' }),
181
180
  });
182
181
  },
183
182
  error(id, options) {
184
183
  return updateToast(id, {
185
- type: ToasterType.SystemEvent,
184
+ type: TOASTER_TYPE.SystemEvent,
186
185
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'error' }),
187
186
  });
188
187
  },
189
188
  errorCritical(id, options) {
190
189
  return updateToast(id, {
191
- type: ToasterType.SystemEvent,
190
+ type: TOASTER_TYPE.SystemEvent,
192
191
  toasterProps: Object.assign(Object.assign({}, options), { appearance: 'errorCritical' }),
193
192
  });
194
193
  },
package/dist/index.d.ts CHANGED
@@ -1,2 +1,4 @@
1
1
  export { toaster } from './helpers';
2
2
  export type { ToastSystemEventProps, ToastUserActionProps } from './components';
3
+ export { openToast, updateToast, dismissToast } from './helpers';
4
+ export type { Toaster, UpdateToast, OpenToast } from './types';
package/dist/index.js CHANGED
@@ -1 +1,2 @@
1
1
  export { toaster } from './helpers';
2
+ export { openToast, updateToast, dismissToast } from './helpers';
package/dist/types.d.ts CHANGED
@@ -1,5 +1,7 @@
1
1
  import { Id, ToastOptions as RtToastOptions } from 'react-toastify';
2
+ import { ValueOf } from '@snack-uikit/utils';
2
3
  import { ToasterContainerProps, ToastSystemEventProps, ToastUserActionProps } from './components';
4
+ import { TOASTER_TYPE } from './constants';
3
5
  export type ToasterId = Id;
4
6
  export type PromisedId = Promise<ToasterId>;
5
7
  export type ToastOptions = {
@@ -7,13 +9,10 @@ export type ToastOptions = {
7
9
  autoClose?: RtToastOptions['autoClose'];
8
10
  onClose?(id?: ToasterId): void;
9
11
  };
10
- export declare enum ToasterType {
11
- SystemEvent = "system-event",
12
- UserAction = "user-action"
13
- }
12
+ export type ToasterType = ValueOf<typeof TOASTER_TYPE>;
14
13
  export type ToasterPropsMap = {
15
- [ToasterType.UserAction]: ToastUserActionProps;
16
- [ToasterType.SystemEvent]: ToastSystemEventProps;
14
+ [TOASTER_TYPE.UserAction]: ToastUserActionProps;
15
+ [TOASTER_TYPE.SystemEvent]: ToastSystemEventProps;
17
16
  };
18
17
  type OpenNotificationProps<T extends keyof ToasterPropsMap> = {
19
18
  type: T;
package/dist/types.js CHANGED
@@ -1,5 +1 @@
1
- export var ToasterType;
2
- (function (ToasterType) {
3
- ToasterType["SystemEvent"] = "system-event";
4
- ToasterType["UserAction"] = "user-action";
5
- })(ToasterType || (ToasterType = {}));
1
+ import { TOASTER_TYPE } from './constants';
package/package.json CHANGED
@@ -4,7 +4,7 @@
4
4
  "access": "public"
5
5
  },
6
6
  "title": "Toaster",
7
- "version": "0.6.7",
7
+ "version": "0.6.8-preview-8c773b48.0",
8
8
  "sideEffects": [
9
9
  "*.css",
10
10
  "*.woff",
@@ -40,5 +40,5 @@
40
40
  "classnames": "2.3.2",
41
41
  "react-toastify": "9.1.3"
42
42
  },
43
- "gitHead": "52f53f82be47e223ad63678b709e32d38c5bca87"
43
+ "gitHead": "96a2e4b7298bb6e7be522f5e7b22f90bc1861cf3"
44
44
  }
package/src/components/ToastSystemEvent/ToastSystemEvent.tsx CHANGED
@@ -7,10 +7,10 @@ import { Link } from '@snack-uikit/link';
7
7
  import { TruncateString } from '@snack-uikit/truncate-string';
8
8
  import { extractSupportProps, WithSupportProps } from '@snack-uikit/utils';
9
9
 
10
- import { AUTO_CLOSE_TIME } from '../../constants';
10
+ import { AUTO_CLOSE_TIME, TOASTER_TYPE } from '../../constants';
11
11
  import { ButtonAction, ButtonActionProps } from '../../helperComponents/ButtonAction';
12
12
  import { TOAST_SYSTEM_EVENT_TEST_IDS } from '../../testIds';
13
- import { ToasterId, ToasterType } from '../../types';
13
+ import { ToasterId } from '../../types';
14
14
  import { APPEARANCE_TO_ON_COLOR_MAP } from './constants';
15
15
  import styles from './styles.module.scss';
16
16
  import { ToastSystemEventAppearance } from './types';
@@ -113,7 +113,7 @@ export function ToastSystemEvent({
113
113
  aria-label='progressbar'
114
114
  data-test-id={TOAST_SYSTEM_EVENT_TEST_IDS.progressbar}
115
115
  className={styles.progress}
116
- style={{ animationDuration: `${AUTO_CLOSE_TIME[ToasterType.SystemEvent]}ms` }}
116
+ style={{ animationDuration: `${AUTO_CLOSE_TIME[TOASTER_TYPE.SystemEvent]}ms` }}
117
117
  />
118
118
  )}
119
119
 
package/src/components/ToasterContainer/ToasterContainer.tsx CHANGED
@@ -10,7 +10,7 @@ import {
10
10
  ToastPosition,
11
11
  } from 'react-toastify';
12
12
 
13
- import { TOASTER_CONTAINER_PREFIX } from '../../constants';
13
+ import { TOASTER_CONTAINER_PREFIX, TOASTER_TYPE } from '../../constants';
14
14
  import { TOAST_SYSTEM_EVENT_TEST_IDS } from '../../testIds';
15
15
  import { ToasterType } from '../../types';
16
16
  import styles from './styles.module.scss';
@@ -28,7 +28,7 @@ export function ToasterContainer({
28
28
  limit = 5,
29
29
  containerId,
30
30
  displayCloseAllButton,
31
- type = ToasterType.SystemEvent,
31
+ type = TOASTER_TYPE.SystemEvent,
32
32
  }: ToasterContainerProps) {
33
33
  const [notificationCounter, setNotificationCounter] = useState(0);
34
34
  const [isCloseAllButtonHidden, setIsCloseAllButtonHidden] = useState(false);
@@ -39,7 +39,7 @@ export function ToasterContainer({
39
39
 
40
40
  useEffect(() => {
41
41
  const unsubscribe = toast.onChange(({ status, containerId }: ToastItem) => {
42
- if (containerId === `${TOASTER_CONTAINER_PREFIX}${ToasterType.SystemEvent}`) {
42
+ if (containerId === `${TOASTER_CONTAINER_PREFIX}${TOASTER_TYPE.SystemEvent}`) {
43
43
  if (status === 'added') {
44
44
  setIsCloseAllButtonHidden(false);
45
45
  setNotificationCounter(prev => prev + 1);
package/src/constants.ts CHANGED
@@ -1,24 +1,29 @@
1
1
  import { ToasterContainer, ToasterContainerProps } from './components';
2
2
  import { ToasterType } from './types';
3
3
 
4
+ export const TOASTER_TYPE = {
5
+ SystemEvent: 'system-event',
6
+ UserAction: 'user-action',
7
+ } as const;
8
+
4
9
  export const TOASTER_CONTAINER_DEFAULT_PROPS: Record<ToasterType, ToasterContainerProps> = {
5
- [ToasterType.SystemEvent]: {
10
+ [TOASTER_TYPE.SystemEvent]: {
6
11
  limit: 5,
7
12
  position: ToasterContainer.position.BOTTOM_RIGHT,
8
13
  displayCloseAllButton: true,
9
- type: ToasterType.SystemEvent,
14
+ type: TOASTER_TYPE.SystemEvent,
10
15
  },
11
- [ToasterType.UserAction]: {
16
+ [TOASTER_TYPE.UserAction]: {
12
17
  limit: 2,
13
18
  position: ToasterContainer.position.BOTTOM_CENTER,
14
19
  displayCloseAllButton: false,
15
- type: ToasterType.UserAction,
20
+ type: TOASTER_TYPE.UserAction,
16
21
  },
17
22
  };
18
23
 
19
24
  export const AUTO_CLOSE_TIME = {
20
- [ToasterType.SystemEvent]: 5000,
21
- [ToasterType.UserAction]: 2000,
25
+ [TOASTER_TYPE.SystemEvent]: 5000,
26
+ [TOASTER_TYPE.UserAction]: 2000,
22
27
  };
23
28
 
24
29
  export const TOASTER_ROOT_ID = 'toaster-root';
package/src/helpers.tsx CHANGED
@@ -15,6 +15,7 @@ import {
15
15
  TOASTER_CONTAINER_DEFAULT_PROPS,
16
16
  TOASTER_CONTAINER_PREFIX,
17
17
  TOASTER_ROOT_ID,
18
+ TOASTER_TYPE,
18
19
  } from './constants';
19
20
  import {
20
21
  OpenToast,
@@ -90,9 +91,9 @@ function getToastComponent<T extends keyof ToasterPropsMap>({
90
91
  toasterProps: ToasterPropsMap[T];
91
92
  }) {
92
93
  switch (type) {
93
- case ToasterType.UserAction:
94
+ case TOASTER_TYPE.UserAction:
94
95
  return <ToastUserAction {...(toasterProps as ToastUserActionProps)} />;
95
- case ToasterType.SystemEvent:
96
+ case TOASTER_TYPE.SystemEvent:
96
97
  return <ToastSystemEvent {...(toasterProps as ToastSystemEventProps)} />;
97
98
  default:
98
99
  return undefined;
@@ -153,28 +154,28 @@ export const isToastActive = toast.isActive;
153
154
  const userAction = {
154
155
  success(options: UserActionOptions) {
155
156
  return openToast({
156
- type: ToasterType.UserAction,
157
+ type: TOASTER_TYPE.UserAction,
157
158
  toasterProps: { ...options, appearance: 'success' },
158
159
  });
159
160
  },
160
161
 
161
162
  neutral(options: UserActionOptions) {
162
163
  return openToast({
163
- type: ToasterType.UserAction,
164
+ type: TOASTER_TYPE.UserAction,
164
165
  toasterProps: { ...options, appearance: 'neutral' },
165
166
  });
166
167
  },
167
168
 
168
169
  error(options: UserActionOptions) {
169
170
  return openToast({
170
- type: ToasterType.UserAction,
171
+ type: TOASTER_TYPE.UserAction,
171
172
  toasterProps: { ...options, appearance: 'error' },
172
173
  });
173
174
  },
174
175
 
175
176
  warning(options: UserActionOptions) {
176
177
  return openToast({
177
- type: ToasterType.UserAction,
178
+ type: TOASTER_TYPE.UserAction,
178
179
  toasterProps: { ...options, appearance: 'warning' },
179
180
  });
180
181
  },
@@ -182,28 +183,28 @@ const userAction = {
182
183
  update: {
183
184
  success(id: ToasterId, options: UserActionOptions) {
184
185
  updateToast(id, {
185
- type: ToasterType.UserAction,
186
+ type: TOASTER_TYPE.UserAction,
186
187
  toasterProps: { ...options, appearance: 'success' },
187
188
  });
188
189
  },
189
190
 
190
191
  neutral(id: ToasterId, options: UserActionOptions) {
191
192
  updateToast(id, {
192
- type: ToasterType.UserAction,
193
+ type: TOASTER_TYPE.UserAction,
193
194
  toasterProps: { ...options, appearance: 'neutral' },
194
195
  });
195
196
  },
196
197
 
197
198
  warning(id: ToasterId, options: UserActionOptions) {
198
199
  updateToast(id, {
199
- type: ToasterType.UserAction,
200
+ type: TOASTER_TYPE.UserAction,
200
201
  toasterProps: { ...options, appearance: 'warning' },
201
202
  });
202
203
  },
203
204
 
204
205
  error(id: ToasterId, options: UserActionOptions) {
205
206
  updateToast(id, {
206
- type: ToasterType.UserAction,
207
+ type: TOASTER_TYPE.UserAction,
207
208
  toasterProps: { ...options, appearance: 'error' },
208
209
  });
209
210
  },
@@ -217,35 +218,35 @@ const userAction = {
217
218
  const systemEvent = {
218
219
  success(options: SystemEventOptions) {
219
220
  return openToast({
220
- type: ToasterType.SystemEvent,
221
+ type: TOASTER_TYPE.SystemEvent,
221
222
  toasterProps: { ...options, appearance: 'success' },
222
223
  });
223
224
  },
224
225
 
225
226
  neutral(options: SystemEventOptions) {
226
227
  return openToast({
227
- type: ToasterType.SystemEvent,
228
+ type: TOASTER_TYPE.SystemEvent,
228
229
  toasterProps: { ...options, appearance: 'neutral' },
229
230
  });
230
231
  },
231
232
 
232
233
  warning(options: SystemEventOptions) {
233
234
  return openToast({
234
- type: ToasterType.SystemEvent,
235
+ type: TOASTER_TYPE.SystemEvent,
235
236
  toasterProps: { ...options, appearance: 'warning' },
236
237
  });
237
238
  },
238
239
 
239
240
  error(options: SystemEventOptions) {
240
241
  return openToast({
241
- type: ToasterType.SystemEvent,
242
+ type: TOASTER_TYPE.SystemEvent,
242
243
  toasterProps: { ...options, appearance: 'error' },
243
244
  });
244
245
  },
245
246
 
246
247
  errorCritical(options: SystemEventOptions) {
247
248
  return openToast({
248
- type: ToasterType.SystemEvent,
249
+ type: TOASTER_TYPE.SystemEvent,
249
250
  toasterProps: { ...options, appearance: 'errorCritical' },
250
251
  });
251
252
  },
@@ -253,35 +254,35 @@ const systemEvent = {
253
254
  update: {
254
255
  success(id: ToasterId, options: SystemEventOptions) {
255
256
  return updateToast(id, {
256
- type: ToasterType.SystemEvent,
257
+ type: TOASTER_TYPE.SystemEvent,
257
258
  toasterProps: { ...options, appearance: 'success' },
258
259
  });
259
260
  },
260
261
 
261
262
  neutral(id: ToasterId, options: SystemEventOptions) {
262
263
  return updateToast(id, {
263
- type: ToasterType.SystemEvent,
264
+ type: TOASTER_TYPE.SystemEvent,
264
265
  toasterProps: { ...options, appearance: 'neutral' },
265
266
  });
266
267
  },
267
268
 
268
269
  warning(id: ToasterId, options: SystemEventOptions) {
269
270
  return updateToast(id, {
270
- type: ToasterType.SystemEvent,
271
+ type: TOASTER_TYPE.SystemEvent,
271
272
  toasterProps: { ...options, appearance: 'warning' },
272
273
  });
273
274
  },
274
275
 
275
276
  error(id: ToasterId, options: SystemEventOptions) {
276
277
  return updateToast(id, {
277
- type: ToasterType.SystemEvent,
278
+ type: TOASTER_TYPE.SystemEvent,
278
279
  toasterProps: { ...options, appearance: 'error' },
279
280
  });
280
281
  },
281
282
 
282
283
  errorCritical(id: ToasterId, options: SystemEventOptions) {
283
284
  return updateToast(id, {
284
- type: ToasterType.SystemEvent,
285
+ type: TOASTER_TYPE.SystemEvent,
285
286
  toasterProps: { ...options, appearance: 'errorCritical' },
286
287
  });
287
288
  },
package/src/index.ts CHANGED
@@ -1,3 +1,7 @@
1
1
  export { toaster } from './helpers';
2
2
 
3
3
  export type { ToastSystemEventProps, ToastUserActionProps } from './components';
4
+
5
+ export { openToast, updateToast, dismissToast } from './helpers';
6
+
7
+ export type { Toaster, UpdateToast, OpenToast } from './types';
package/src/types.ts CHANGED
@@ -1,6 +1,9 @@
1
1
  import { Id, ToastOptions as RtToastOptions } from 'react-toastify';
2
2
 
3
+ import { ValueOf } from '@snack-uikit/utils';
4
+
3
5
  import { ToasterContainerProps, ToastSystemEventProps, ToastUserActionProps } from './components';
6
+ import { TOASTER_TYPE } from './constants';
4
7
 
5
8
  export type ToasterId = Id;
6
9
  export type PromisedId = Promise<ToasterId>;
@@ -11,14 +14,11 @@ export type ToastOptions = {
11
14
  onClose?(id?: ToasterId): void;
12
15
  };
13
16
 
14
- export enum ToasterType {
15
- SystemEvent = 'system-event',
16
- UserAction = 'user-action',
17
- }
17
+ export type ToasterType = ValueOf<typeof TOASTER_TYPE>;
18
18
 
19
19
  export type ToasterPropsMap = {
20
- [ToasterType.UserAction]: ToastUserActionProps;
21
- [ToasterType.SystemEvent]: ToastSystemEventProps;
20
+ [TOASTER_TYPE.UserAction]: ToastUserActionProps;
21
+ [TOASTER_TYPE.SystemEvent]: ToastSystemEventProps;
22
22
  };
23
23
 
24
24
  type OpenNotificationProps<T extends keyof ToasterPropsMap> = {