@zendeskgarden/react-notifications 8.49.2 → 8.50.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.
- package/dist/index.cjs.js +11 -11
- package/dist/index.esm.js +11 -11
- package/dist/typings/elements/Alert.d.ts +2 -5
- package/dist/typings/elements/Notification.d.ts +2 -6
- package/dist/typings/elements/Well.d.ts +2 -7
- package/dist/typings/elements/content/Title.d.ts +2 -5
- package/dist/typings/elements/toaster/Toast.d.ts +1 -1
- package/dist/typings/elements/toaster/ToastProvider.d.ts +2 -16
- package/dist/typings/elements/toaster/ToastSlot.d.ts +3 -2
- package/dist/typings/elements/toaster/reducer.d.ts +2 -17
- package/dist/typings/elements/toaster/styled.d.ts +3 -3
- package/dist/typings/elements/toaster/useToast.d.ts +20 -3
- package/dist/typings/index.d.ts +6 -5
- package/dist/typings/styled/StyledBase.d.ts +2 -2
- package/dist/typings/styled/StyledNotification.d.ts +2 -6
- package/dist/typings/styled/content/StyledClose.d.ts +2 -2
- package/dist/typings/styled/index.d.ts +0 -4
- package/dist/typings/types/index.d.ts +43 -0
- package/dist/typings/utils/icons.d.ts +3 -3
- package/dist/typings/utils/useNotificationsContext.d.ts +3 -3
- package/package.json +4 -4
- package/dist/typings/utils/types.d.ts +0 -9
package/dist/index.cjs.js
CHANGED
|
@@ -212,10 +212,12 @@ function _nonIterableRest() {
|
|
|
212
212
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
213
213
|
}
|
|
214
214
|
|
|
215
|
+
var TYPE = ['success', 'warning', 'error', 'info'];
|
|
216
|
+
|
|
215
217
|
var COMPONENT_ID$5 = 'notifications.close';
|
|
216
218
|
var StyledClose = styled__default["default"].button.attrs({
|
|
217
219
|
'data-garden-id': COMPONENT_ID$5,
|
|
218
|
-
'data-garden-version': '8.
|
|
220
|
+
'data-garden-version': '8.50.0'
|
|
219
221
|
}).withConfig({
|
|
220
222
|
displayName: "StyledClose",
|
|
221
223
|
componentId: "sc-1mr9nx1-0"
|
|
@@ -247,7 +249,7 @@ StyledClose.defaultProps = {
|
|
|
247
249
|
var COMPONENT_ID$4 = 'notifications.paragraph';
|
|
248
250
|
var StyledParagraph = styled__default["default"].p.attrs({
|
|
249
251
|
'data-garden-id': COMPONENT_ID$4,
|
|
250
|
-
'data-garden-version': '8.
|
|
252
|
+
'data-garden-version': '8.50.0'
|
|
251
253
|
}).withConfig({
|
|
252
254
|
displayName: "StyledParagraph",
|
|
253
255
|
componentId: "sc-12tmd6p-0"
|
|
@@ -263,7 +265,7 @@ StyledParagraph.defaultProps = {
|
|
|
263
265
|
var COMPONENT_ID$3 = 'notifications.title';
|
|
264
266
|
var StyledTitle = styled__default["default"].div.attrs({
|
|
265
267
|
'data-garden-id': COMPONENT_ID$3,
|
|
266
|
-
'data-garden-version': '8.
|
|
268
|
+
'data-garden-version': '8.50.0'
|
|
267
269
|
}).withConfig({
|
|
268
270
|
displayName: "StyledTitle",
|
|
269
271
|
componentId: "sc-xx4jsv-0"
|
|
@@ -335,7 +337,7 @@ var colorStyles$1 = function colorStyles(props) {
|
|
|
335
337
|
var StyledAlert = styled__default["default"](StyledBase).attrs(function (props) {
|
|
336
338
|
return {
|
|
337
339
|
'data-garden-id': COMPONENT_ID$2,
|
|
338
|
-
'data-garden-version': '8.
|
|
340
|
+
'data-garden-version': '8.50.0',
|
|
339
341
|
role: props.role === undefined ? 'alert' : props.role
|
|
340
342
|
};
|
|
341
343
|
}).withConfig({
|
|
@@ -348,8 +350,6 @@ StyledAlert.defaultProps = {
|
|
|
348
350
|
theme: reactTheming.DEFAULT_THEME
|
|
349
351
|
};
|
|
350
352
|
|
|
351
|
-
var ARRAY_VALIDATION_TYPE = ['success', 'warning', 'error', 'info'];
|
|
352
|
-
|
|
353
353
|
var COMPONENT_ID$1 = 'notifications.notification';
|
|
354
354
|
var colorStyles = function colorStyles(props) {
|
|
355
355
|
var type = props.type,
|
|
@@ -382,7 +382,7 @@ var colorStyles = function colorStyles(props) {
|
|
|
382
382
|
var StyledNotification = styled__default["default"](StyledBase).attrs(function (props) {
|
|
383
383
|
return {
|
|
384
384
|
'data-garden-id': COMPONENT_ID$1,
|
|
385
|
-
'data-garden-version': '8.
|
|
385
|
+
'data-garden-version': '8.50.0',
|
|
386
386
|
role: props.role === undefined ? 'status' : props.role
|
|
387
387
|
};
|
|
388
388
|
}).withConfig({
|
|
@@ -392,7 +392,7 @@ var StyledNotification = styled__default["default"](StyledBase).attrs(function (
|
|
|
392
392
|
return reactTheming.retrieveComponentStyles(COMPONENT_ID$1, props);
|
|
393
393
|
});
|
|
394
394
|
StyledNotification.propTypes = {
|
|
395
|
-
type: PropTypes__default["default"].oneOf(
|
|
395
|
+
type: PropTypes__default["default"].oneOf(TYPE)
|
|
396
396
|
};
|
|
397
397
|
StyledNotification.defaultProps = {
|
|
398
398
|
theme: reactTheming.DEFAULT_THEME
|
|
@@ -401,7 +401,7 @@ StyledNotification.defaultProps = {
|
|
|
401
401
|
var COMPONENT_ID = 'notifications.well';
|
|
402
402
|
var StyledWell = styled__default["default"](StyledBase).attrs({
|
|
403
403
|
'data-garden-id': COMPONENT_ID,
|
|
404
|
-
'data-garden-version': '8.
|
|
404
|
+
'data-garden-version': '8.50.0'
|
|
405
405
|
}).withConfig({
|
|
406
406
|
displayName: "StyledWell",
|
|
407
407
|
componentId: "sc-a5831c-0"
|
|
@@ -580,7 +580,7 @@ var Alert = React__default["default"].forwardRef(function (props, ref) {
|
|
|
580
580
|
});
|
|
581
581
|
Alert.displayName = 'Alert';
|
|
582
582
|
Alert.propTypes = {
|
|
583
|
-
type: PropTypes__default["default"].oneOf(
|
|
583
|
+
type: PropTypes__default["default"].oneOf(TYPE).isRequired
|
|
584
584
|
};
|
|
585
585
|
|
|
586
586
|
var Notification = React__default["default"].forwardRef(function (props, ref) {
|
|
@@ -596,7 +596,7 @@ var Notification = React__default["default"].forwardRef(function (props, ref) {
|
|
|
596
596
|
});
|
|
597
597
|
Notification.displayName = 'Notification';
|
|
598
598
|
Notification.propTypes = {
|
|
599
|
-
type: PropTypes__default["default"].oneOf(
|
|
599
|
+
type: PropTypes__default["default"].oneOf(TYPE)
|
|
600
600
|
};
|
|
601
601
|
|
|
602
602
|
var Well = React__default["default"].forwardRef(function (props, ref) {
|
package/dist/index.esm.js
CHANGED
|
@@ -184,10 +184,12 @@ function _nonIterableRest() {
|
|
|
184
184
|
throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
185
185
|
}
|
|
186
186
|
|
|
187
|
+
var TYPE = ['success', 'warning', 'error', 'info'];
|
|
188
|
+
|
|
187
189
|
var COMPONENT_ID$5 = 'notifications.close';
|
|
188
190
|
var StyledClose = styled.button.attrs({
|
|
189
191
|
'data-garden-id': COMPONENT_ID$5,
|
|
190
|
-
'data-garden-version': '8.
|
|
192
|
+
'data-garden-version': '8.50.0'
|
|
191
193
|
}).withConfig({
|
|
192
194
|
displayName: "StyledClose",
|
|
193
195
|
componentId: "sc-1mr9nx1-0"
|
|
@@ -219,7 +221,7 @@ StyledClose.defaultProps = {
|
|
|
219
221
|
var COMPONENT_ID$4 = 'notifications.paragraph';
|
|
220
222
|
var StyledParagraph = styled.p.attrs({
|
|
221
223
|
'data-garden-id': COMPONENT_ID$4,
|
|
222
|
-
'data-garden-version': '8.
|
|
224
|
+
'data-garden-version': '8.50.0'
|
|
223
225
|
}).withConfig({
|
|
224
226
|
displayName: "StyledParagraph",
|
|
225
227
|
componentId: "sc-12tmd6p-0"
|
|
@@ -235,7 +237,7 @@ StyledParagraph.defaultProps = {
|
|
|
235
237
|
var COMPONENT_ID$3 = 'notifications.title';
|
|
236
238
|
var StyledTitle = styled.div.attrs({
|
|
237
239
|
'data-garden-id': COMPONENT_ID$3,
|
|
238
|
-
'data-garden-version': '8.
|
|
240
|
+
'data-garden-version': '8.50.0'
|
|
239
241
|
}).withConfig({
|
|
240
242
|
displayName: "StyledTitle",
|
|
241
243
|
componentId: "sc-xx4jsv-0"
|
|
@@ -307,7 +309,7 @@ var colorStyles$1 = function colorStyles(props) {
|
|
|
307
309
|
var StyledAlert = styled(StyledBase).attrs(function (props) {
|
|
308
310
|
return {
|
|
309
311
|
'data-garden-id': COMPONENT_ID$2,
|
|
310
|
-
'data-garden-version': '8.
|
|
312
|
+
'data-garden-version': '8.50.0',
|
|
311
313
|
role: props.role === undefined ? 'alert' : props.role
|
|
312
314
|
};
|
|
313
315
|
}).withConfig({
|
|
@@ -320,8 +322,6 @@ StyledAlert.defaultProps = {
|
|
|
320
322
|
theme: DEFAULT_THEME
|
|
321
323
|
};
|
|
322
324
|
|
|
323
|
-
var ARRAY_VALIDATION_TYPE = ['success', 'warning', 'error', 'info'];
|
|
324
|
-
|
|
325
325
|
var COMPONENT_ID$1 = 'notifications.notification';
|
|
326
326
|
var colorStyles = function colorStyles(props) {
|
|
327
327
|
var type = props.type,
|
|
@@ -354,7 +354,7 @@ var colorStyles = function colorStyles(props) {
|
|
|
354
354
|
var StyledNotification = styled(StyledBase).attrs(function (props) {
|
|
355
355
|
return {
|
|
356
356
|
'data-garden-id': COMPONENT_ID$1,
|
|
357
|
-
'data-garden-version': '8.
|
|
357
|
+
'data-garden-version': '8.50.0',
|
|
358
358
|
role: props.role === undefined ? 'status' : props.role
|
|
359
359
|
};
|
|
360
360
|
}).withConfig({
|
|
@@ -364,7 +364,7 @@ var StyledNotification = styled(StyledBase).attrs(function (props) {
|
|
|
364
364
|
return retrieveComponentStyles(COMPONENT_ID$1, props);
|
|
365
365
|
});
|
|
366
366
|
StyledNotification.propTypes = {
|
|
367
|
-
type: PropTypes.oneOf(
|
|
367
|
+
type: PropTypes.oneOf(TYPE)
|
|
368
368
|
};
|
|
369
369
|
StyledNotification.defaultProps = {
|
|
370
370
|
theme: DEFAULT_THEME
|
|
@@ -373,7 +373,7 @@ StyledNotification.defaultProps = {
|
|
|
373
373
|
var COMPONENT_ID = 'notifications.well';
|
|
374
374
|
var StyledWell = styled(StyledBase).attrs({
|
|
375
375
|
'data-garden-id': COMPONENT_ID,
|
|
376
|
-
'data-garden-version': '8.
|
|
376
|
+
'data-garden-version': '8.50.0'
|
|
377
377
|
}).withConfig({
|
|
378
378
|
displayName: "StyledWell",
|
|
379
379
|
componentId: "sc-a5831c-0"
|
|
@@ -552,7 +552,7 @@ var Alert = React__default.forwardRef(function (props, ref) {
|
|
|
552
552
|
});
|
|
553
553
|
Alert.displayName = 'Alert';
|
|
554
554
|
Alert.propTypes = {
|
|
555
|
-
type: PropTypes.oneOf(
|
|
555
|
+
type: PropTypes.oneOf(TYPE).isRequired
|
|
556
556
|
};
|
|
557
557
|
|
|
558
558
|
var Notification = React__default.forwardRef(function (props, ref) {
|
|
@@ -568,7 +568,7 @@ var Notification = React__default.forwardRef(function (props, ref) {
|
|
|
568
568
|
});
|
|
569
569
|
Notification.displayName = 'Notification';
|
|
570
570
|
Notification.propTypes = {
|
|
571
|
-
type: PropTypes.oneOf(
|
|
571
|
+
type: PropTypes.oneOf(TYPE)
|
|
572
572
|
};
|
|
573
573
|
|
|
574
574
|
var Well = React__default.forwardRef(function (props, ref) {
|
|
@@ -4,11 +4,8 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
import React
|
|
8
|
-
|
|
9
|
-
/** Applies alert type styles */
|
|
10
|
-
type: 'success' | 'warning' | 'error' | 'info';
|
|
11
|
-
}
|
|
7
|
+
import React from 'react';
|
|
8
|
+
import { IAlertProps } from '../types';
|
|
12
9
|
/**
|
|
13
10
|
* @extends HTMLAttributes<HTMLDivElement>
|
|
14
11
|
*/
|
|
@@ -4,12 +4,8 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
import React
|
|
8
|
-
import {
|
|
9
|
-
export interface INotificationProps extends HTMLAttributes<HTMLDivElement> {
|
|
10
|
-
/** Applies notification type styles */
|
|
11
|
-
type?: VALIDATION_TYPE;
|
|
12
|
-
}
|
|
7
|
+
import React from 'react';
|
|
8
|
+
import { INotificationProps } from '../types';
|
|
13
9
|
/**
|
|
14
10
|
* @extends HTMLAttributes<HTMLDivElement>
|
|
15
11
|
*/
|
|
@@ -4,13 +4,8 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
import React
|
|
8
|
-
|
|
9
|
-
/** Applies a background color */
|
|
10
|
-
isRecessed?: boolean;
|
|
11
|
-
/** Applies a drop shadow */
|
|
12
|
-
isFloating?: boolean;
|
|
13
|
-
}
|
|
7
|
+
import React from 'react';
|
|
8
|
+
import { IWellProps } from '../types';
|
|
14
9
|
/**
|
|
15
10
|
* @extends HTMLAttributes<HTMLDivElement>
|
|
16
11
|
*/
|
|
@@ -4,11 +4,8 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
import React
|
|
8
|
-
|
|
9
|
-
/** Applies regular (non-bold) font weight */
|
|
10
|
-
isRegular?: boolean;
|
|
11
|
-
}
|
|
7
|
+
import React from 'react';
|
|
8
|
+
import { ITitleProps } from '../../types';
|
|
12
9
|
/**
|
|
13
10
|
* @extends HTMLAttributes<HTMLDivElement>
|
|
14
11
|
*/
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
import { IToast } from './
|
|
7
|
+
import { IToast } from './useToast';
|
|
8
8
|
interface IToastProps {
|
|
9
9
|
toast: IToast;
|
|
10
10
|
pauseTimers: boolean;
|
|
@@ -4,23 +4,9 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
import {
|
|
7
|
+
import { PropsWithChildren } from 'react';
|
|
8
8
|
import PropTypes from 'prop-types';
|
|
9
|
-
import {
|
|
10
|
-
export interface IToastProviderProps {
|
|
11
|
-
/**
|
|
12
|
-
* Limits the number of visible toasts
|
|
13
|
-
*/
|
|
14
|
-
limit?: number;
|
|
15
|
-
/**
|
|
16
|
-
* Passes placement-based customization props to the toast's parent element
|
|
17
|
-
*/
|
|
18
|
-
placementProps?: Partial<Record<ToastPlacement, HTMLAttributes<HTMLDivElement>>>;
|
|
19
|
-
/**
|
|
20
|
-
* Sets the `z-index` of the toast
|
|
21
|
-
*/
|
|
22
|
-
zIndex?: number;
|
|
23
|
-
}
|
|
9
|
+
import { IToastProviderProps } from '../../types';
|
|
24
10
|
export declare const ToastProvider: {
|
|
25
11
|
({ limit, zIndex, placementProps, children }: PropsWithChildren<IToastProviderProps>): JSX.Element;
|
|
26
12
|
displayName: string;
|
|
@@ -5,10 +5,11 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import { HTMLAttributes } from 'react';
|
|
8
|
-
import {
|
|
8
|
+
import { Placement } from '../../types';
|
|
9
|
+
import { IToast } from './useToast';
|
|
9
10
|
interface IToastSlotProps extends HTMLAttributes<HTMLDivElement> {
|
|
10
11
|
toasts: IToast[];
|
|
11
|
-
placement:
|
|
12
|
+
placement: Placement;
|
|
12
13
|
limit: number;
|
|
13
14
|
zIndex?: number;
|
|
14
15
|
}
|
|
@@ -4,22 +4,7 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
import {
|
|
8
|
-
export declare type ToastPlacement = 'top-start' | 'top' | 'top-end' | 'bottom-start' | 'bottom' | 'bottom-end';
|
|
9
|
-
export declare type ToastContent = ({ close }: {
|
|
10
|
-
close: () => void;
|
|
11
|
-
}) => ReactElement;
|
|
12
|
-
export interface IToastOptions<T = any> {
|
|
13
|
-
id?: string;
|
|
14
|
-
autoDismiss: boolean | number;
|
|
15
|
-
placement: ToastPlacement;
|
|
16
|
-
data?: T;
|
|
17
|
-
}
|
|
18
|
-
export interface IToast {
|
|
19
|
-
id: string;
|
|
20
|
-
content: ToastContent;
|
|
21
|
-
options: IToastOptions;
|
|
22
|
-
}
|
|
7
|
+
import { Content, IToast, IToastOptions } from './useToast';
|
|
23
8
|
export interface IToasterState {
|
|
24
9
|
toasts: IToast[];
|
|
25
10
|
}
|
|
@@ -34,7 +19,7 @@ export declare type ToasterReducerAction = {
|
|
|
34
19
|
payload: {
|
|
35
20
|
id: string;
|
|
36
21
|
options: {
|
|
37
|
-
content?:
|
|
22
|
+
content?: Content;
|
|
38
23
|
} & Partial<IToastOptions>;
|
|
39
24
|
};
|
|
40
25
|
} | {
|
|
@@ -6,14 +6,14 @@
|
|
|
6
6
|
*/
|
|
7
7
|
import { DefaultTheme } from 'styled-components';
|
|
8
8
|
import { TransitionGroup } from 'react-transition-group';
|
|
9
|
-
import {
|
|
9
|
+
import { Placement } from '../../types';
|
|
10
10
|
export declare const TRANSITION_CLASS = "garden-toast-transition";
|
|
11
11
|
export declare const StyledFadeInTransition: import("styled-components").StyledComponent<"div", DefaultTheme, {
|
|
12
12
|
isHidden: boolean;
|
|
13
|
-
placement:
|
|
13
|
+
placement: Placement;
|
|
14
14
|
}, never>;
|
|
15
15
|
interface IStyledTransitionGroupProps {
|
|
16
|
-
$placement:
|
|
16
|
+
$placement: Placement;
|
|
17
17
|
$zIndex?: number;
|
|
18
18
|
}
|
|
19
19
|
export declare const StyledTransitionGroup: import("styled-components").StyledComponent<typeof TransitionGroup, DefaultTheme, IStyledTransitionGroupProps, never>;
|
|
@@ -4,12 +4,29 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
import {
|
|
7
|
+
import { ReactElement } from 'react';
|
|
8
|
+
import { Placement } from '../../types';
|
|
9
|
+
export interface IToastOptions {
|
|
10
|
+
/** Sets the toast ID, otherwise the ID is generated */
|
|
11
|
+
id?: string;
|
|
12
|
+
/** Determines whether to automatically dismiss the toast. Can be expressed in milliseconds. */
|
|
13
|
+
autoDismiss: boolean | number;
|
|
14
|
+
/** Adjusts the placement of the toast content */
|
|
15
|
+
placement: Placement;
|
|
16
|
+
}
|
|
17
|
+
export declare type Content = ({ close }: {
|
|
18
|
+
close: () => void;
|
|
19
|
+
}) => ReactElement;
|
|
20
|
+
export interface IToast {
|
|
21
|
+
id: string;
|
|
22
|
+
content: Content;
|
|
23
|
+
options: IToastOptions;
|
|
24
|
+
}
|
|
8
25
|
export declare const useToast: () => {
|
|
9
|
-
addToast: (content:
|
|
26
|
+
addToast: (content: Content, options?: Partial<IToastOptions>) => string;
|
|
10
27
|
removeToast: (id: string) => void;
|
|
11
28
|
updateToast: (id: string, options: {
|
|
12
|
-
content?:
|
|
29
|
+
content?: Content;
|
|
13
30
|
} & Partial<IToastOptions>) => void;
|
|
14
31
|
removeAllToasts: () => void;
|
|
15
32
|
toasts: IToast[];
|
package/dist/typings/index.d.ts
CHANGED
|
@@ -5,15 +5,16 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
export { Alert } from './elements/Alert';
|
|
8
|
-
export type { IAlertProps } from './elements/Alert';
|
|
9
8
|
export { Notification } from './elements/Notification';
|
|
10
|
-
export type { INotificationProps } from './elements/Notification';
|
|
11
9
|
export { Well } from './elements/Well';
|
|
12
|
-
export type { IWellProps } from './elements/Well';
|
|
13
10
|
export { Close } from './elements/content/Close';
|
|
14
11
|
export { Paragraph } from './elements/content/Paragraph';
|
|
15
12
|
export { Title } from './elements/content/Title';
|
|
16
13
|
export { ToastProvider } from './elements/toaster/ToastProvider';
|
|
17
|
-
export type { IToastProviderProps } from './elements/toaster/ToastProvider';
|
|
18
|
-
export type { IToast, IToastOptions, ToastContent, ToastPlacement } from './elements/toaster/reducer';
|
|
19
14
|
export { useToast } from './elements/toaster/useToast';
|
|
15
|
+
export type { IAlertProps, INotificationProps, IWellProps, ITitleProps, IToastProviderProps,
|
|
16
|
+
/** @deprecated can be dereferenced via IToastOptions['placement'] */
|
|
17
|
+
Placement as ToastPlacement } from './types';
|
|
18
|
+
export type { IToastOptions, IToast,
|
|
19
|
+
/** @deprecated can be dereferenced via IToast['content'] */
|
|
20
|
+
Content as ToastContent } from './elements/toaster/useToast';
|
|
@@ -5,10 +5,10 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import { DefaultTheme } from 'styled-components';
|
|
8
|
-
import {
|
|
8
|
+
import { Type } from '../types';
|
|
9
9
|
export interface IStyledBaseProps {
|
|
10
10
|
isFloating?: boolean;
|
|
11
11
|
hue?: string;
|
|
12
|
-
type?:
|
|
12
|
+
type?: Type;
|
|
13
13
|
}
|
|
14
14
|
export declare const StyledBase: import("styled-components").StyledComponent<"div", DefaultTheme, IStyledBaseProps, never>;
|
|
@@ -5,11 +5,7 @@
|
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
7
|
import { DefaultTheme } from 'styled-components';
|
|
8
|
-
import {
|
|
9
|
-
export interface IStyledNotificationProps {
|
|
10
|
-
/** Applies notification type styles */
|
|
11
|
-
type?: VALIDATION_TYPE;
|
|
12
|
-
}
|
|
8
|
+
import { INotificationProps } from '../types';
|
|
13
9
|
/**
|
|
14
10
|
* Supports all `<div>` props
|
|
15
11
|
*/
|
|
@@ -17,4 +13,4 @@ export declare const StyledNotification: import("styled-components").StyledCompo
|
|
|
17
13
|
'data-garden-id': string;
|
|
18
14
|
'data-garden-version': string;
|
|
19
15
|
role: import("react").AriaRole;
|
|
20
|
-
} &
|
|
16
|
+
} & INotificationProps, "role" | "data-garden-id" | "data-garden-version">;
|
|
@@ -4,9 +4,9 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
import {
|
|
7
|
+
import { Hue } from '../../utils/useNotificationsContext';
|
|
8
8
|
interface IStyledCloseProps {
|
|
9
|
-
hue?:
|
|
9
|
+
hue?: Hue;
|
|
10
10
|
}
|
|
11
11
|
/**
|
|
12
12
|
* Used to close a Notification. Supports all `<button>` props
|
|
@@ -8,11 +8,7 @@ export { StyledClose } from './content/StyledClose';
|
|
|
8
8
|
export { StyledParagraph } from './content/StyledParagraph';
|
|
9
9
|
export { StyledTitle } from './content/StyledTitle';
|
|
10
10
|
export { StyledAlert } from './StyledAlert';
|
|
11
|
-
export type { IStyledAlertProps } from './StyledAlert';
|
|
12
11
|
export { StyledNotification } from './StyledNotification';
|
|
13
|
-
export type { IStyledNotificationProps } from './StyledNotification';
|
|
14
12
|
export { StyledWell } from './StyledWell';
|
|
15
|
-
export type { IStyledWellProps } from './StyledWell';
|
|
16
13
|
export { StyledIcon } from './StyledIcon';
|
|
17
14
|
export { StyledBase } from './StyledBase';
|
|
18
|
-
export type { IStyledBaseProps } from './StyledBase';
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Copyright Zendesk, Inc.
|
|
3
|
+
*
|
|
4
|
+
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
|
+
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
|
+
*/
|
|
7
|
+
import { HTMLAttributes } from 'react';
|
|
8
|
+
export declare const PLACEMENT: readonly ["top-start", "top", "top-end", "bottom-start", "bottom", "bottom-end"];
|
|
9
|
+
export declare const TYPE: readonly ["success", "warning", "error", "info"];
|
|
10
|
+
export declare type Placement = typeof PLACEMENT[number];
|
|
11
|
+
export declare type Type = typeof TYPE[number];
|
|
12
|
+
export interface IAlertProps extends HTMLAttributes<HTMLDivElement> {
|
|
13
|
+
/** Applies alert type styles */
|
|
14
|
+
type: Type;
|
|
15
|
+
}
|
|
16
|
+
export interface INotificationProps extends HTMLAttributes<HTMLDivElement> {
|
|
17
|
+
/** Applies notification type styles */
|
|
18
|
+
type?: Type;
|
|
19
|
+
}
|
|
20
|
+
export interface IWellProps extends HTMLAttributes<HTMLDivElement> {
|
|
21
|
+
/** Applies a background color */
|
|
22
|
+
isRecessed?: boolean;
|
|
23
|
+
/** Applies a drop shadow */
|
|
24
|
+
isFloating?: boolean;
|
|
25
|
+
}
|
|
26
|
+
export interface ITitleProps extends HTMLAttributes<HTMLDivElement> {
|
|
27
|
+
/** Applies regular (non-bold) font weight */
|
|
28
|
+
isRegular?: boolean;
|
|
29
|
+
}
|
|
30
|
+
export interface IToastProviderProps {
|
|
31
|
+
/**
|
|
32
|
+
* Limits the number of visible toasts
|
|
33
|
+
*/
|
|
34
|
+
limit?: number;
|
|
35
|
+
/**
|
|
36
|
+
* Passes placement-based customization props to the toast's parent element
|
|
37
|
+
*/
|
|
38
|
+
placementProps?: Partial<Record<Placement, HTMLAttributes<HTMLDivElement>>>;
|
|
39
|
+
/**
|
|
40
|
+
* Sets the `z-index` of the toast
|
|
41
|
+
*/
|
|
42
|
+
zIndex?: number;
|
|
43
|
+
}
|
|
@@ -4,6 +4,6 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
import {
|
|
8
|
-
export declare const validationIcons: Record<
|
|
9
|
-
export declare const validationHues: Record<
|
|
7
|
+
import { Type } from '../types';
|
|
8
|
+
export declare const validationIcons: Record<Type, Record<string, unknown>>;
|
|
9
|
+
export declare const validationHues: Record<Type, string>;
|
|
@@ -4,6 +4,6 @@
|
|
|
4
4
|
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
5
|
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
6
|
*/
|
|
7
|
-
|
|
8
|
-
export declare const NotificationsContext: import("react").Context<
|
|
9
|
-
export declare const useNotificationsContext: () =>
|
|
7
|
+
export declare type Hue = 'successHue' | 'warningHue' | 'dangerHue' | 'neutralHue';
|
|
8
|
+
export declare const NotificationsContext: import("react").Context<Hue | undefined>;
|
|
9
|
+
export declare const useNotificationsContext: () => Hue | undefined;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@zendeskgarden/react-notifications",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.50.0",
|
|
4
4
|
"description": "Notification and Well components within the Garden Design System",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"author": "Zendesk Garden <garden@zendesk.com>",
|
|
@@ -34,8 +34,8 @@
|
|
|
34
34
|
},
|
|
35
35
|
"devDependencies": {
|
|
36
36
|
"@types/react-transition-group": "4.4.4",
|
|
37
|
-
"@zendeskgarden/react-theming": "^8.
|
|
38
|
-
"@zendeskgarden/svg-icons": "6.
|
|
37
|
+
"@zendeskgarden/react-theming": "^8.50.0",
|
|
38
|
+
"@zendeskgarden/svg-icons": "6.31.1"
|
|
39
39
|
},
|
|
40
40
|
"keywords": [
|
|
41
41
|
"components",
|
|
@@ -47,5 +47,5 @@
|
|
|
47
47
|
"access": "public"
|
|
48
48
|
},
|
|
49
49
|
"zendeskgarden:src": "src/index.ts",
|
|
50
|
-
"gitHead": "
|
|
50
|
+
"gitHead": "d5b66e1980faf0fd40818c9e74801dfa1c3550a0"
|
|
51
51
|
}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Copyright Zendesk, Inc.
|
|
3
|
-
*
|
|
4
|
-
* Use of this source code is governed under the Apache License, Version 2.0
|
|
5
|
-
* found at http://www.apache.org/licenses/LICENSE-2.0.
|
|
6
|
-
*/
|
|
7
|
-
export declare type VALIDATION_TYPE = 'success' | 'warning' | 'error' | 'info';
|
|
8
|
-
export declare type VALIDATION_HUE = 'successHue' | 'warningHue' | 'dangerHue' | 'neutralHue';
|
|
9
|
-
export declare const ARRAY_VALIDATION_TYPE: VALIDATION_TYPE[];
|